/* ============================================================
   CASACOSI DÉVELOPPEMENT — DESIGN SYSTEM
   Recréation du design de référence (Sonet), 100 % auto-hébergé :
   aucune police, aucun script, aucune image chargés depuis un
   service externe.
   ============================================================ */

/* ── POLICE ──────────────────────────────────────────────────
   Helvetica Neue partout : seules les épaisseurs varient
   (100 UltraLight, 200 Thin, 300 Light, 400 Regular, 500 Medium, 700 Bold).
   Aucun fichier de police n'est chargé. */

/* ── TOKENS ────────────────────────────────────────────────── */
:root {
  --accent: #a53b12;
  --accent-400: #ae4f2a;
  --accent-600: #842f0e;
  --accent-strong: #63230b;
  --accent-subtle: #e4c4b8;
  --accent-05: rgba(165, 59, 18, .05);
  --accent-10: rgba(165, 59, 18, .10);
  --accent-20: rgba(165, 59, 18, .20);
  --accent-30: rgba(165, 59, 18, .30);
  --accent-40: rgba(165, 59, 18, .40);
  --accent-50: rgba(165, 59, 18, .50);
  --accent-60: rgba(165, 59, 18, .60);
  --accent-80: rgba(165, 59, 18, .80);
  --subtle-30: rgba(228, 196, 184, .30);
  --subtle-40: rgba(228, 196, 184, .40);

  --dark-strong: #210c04;
  --dark-base: #3b1606;
  --dark-subtle: #552f20;
  --light-base: #f4f1f0;
  --light-strong: #ece8e6;
  --light-subtle: #f7f6f5;
  --light-05: rgba(244, 241, 240, .05);
  --light-10: rgba(244, 241, 240, .10);
  --light-20: rgba(244, 241, 240, .20);
  --light-30: rgba(244, 241, 240, .30);
  --light-40: rgba(244, 241, 240, .40);
  --light-90: rgba(244, 241, 240, .90);
  --dark-20: rgba(59, 22, 6, .20);
  --dark-40: rgba(59, 22, 6, .40);
  --dark-50: rgba(59, 22, 6, .50);
  --dark-80: rgba(59, 22, 6, .80);

  --text-primary: #552f20;
  --text-secondary: #684639;
  --text-muted: #d2c8c3;
  --text-inverse: #ece8e6;
  --success: #24690a;
  --accepting: #bee6af;
  --warning: #e2cd40;

  --font: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --mono: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --label-tracking: .06em;

  --s-2xs: clamp(.25rem, .5vw, .25rem);
  --s-xs: clamp(.5rem, 1vw, .5rem);
  --s-sm: clamp(.5rem, 1.5vw, .75rem);
  --s-md: clamp(.75rem, 2vw, 1rem);
  --s-lg: clamp(1rem, 3vw, 1.5rem);
  --s-xl: clamp(1.25rem, 4vw, 2rem);
  --s-2xl: clamp(2rem, 6vw, 3rem);
  --s-3xl: clamp(3rem, 8vw, 4rem);
  --pad-sm: clamp(1rem, 3vw, 2.5rem);
  --pad-md: clamp(1rem, 4vw, 4rem);
  --pad-lg: clamp(2rem, 8vw, 8rem);
  --pad-xl: clamp(4rem, 12vw, 12rem);
  --gap: var(--s-md);
  --col-2: calc((100% - var(--gap)) / 2);
  --r: 6px;

  --img-2xs: clamp(4rem, 8vw, 8rem);
  --img-xs: clamp(6rem, 12vw, 12rem);
  --img-sm: clamp(8rem, 16vw, 18rem);
  --img-md: clamp(10rem, 20vw, 25rem);
  --img-lg: clamp(14rem, 26vw, 34rem);
  --img-xl: clamp(18rem, 32vw, 44rem);
  --img-2xl: clamp(24rem, 40vw, 60rem);

  --h-2xl: clamp(2.75rem, 8vw, 5rem);
  --h-xl: clamp(2.25rem, 5vw, 3.5rem);
  --h-lg: clamp(1.75rem, 4vw, 2.5rem);
  --h-md: clamp(1.5rem, 3vw, 2rem);
  --h-sm: clamp(1.25rem, 2.5vw, 1.5rem);
  --h-xs: clamp(1.125rem, 2vw, 1.25rem);
  --h-2xs: clamp(.875rem, 1.5vw, 1rem);
  --p-lg: clamp(1.125rem, 1.6vw, 1.25rem);
  --p-md: clamp(1rem, 1.4vw, 1.125rem);
  --p-sm: clamp(.9375rem, 1.2vw, 1rem);

  --ease-out: cubic-bezier(.19, 1, .22, 1);
  --ease-expo: cubic-bezier(.075, .82, .165, 1);
  --nav-h: 5rem;
}

/* ── BASE ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html.has-smooth { scroll-behavior: auto; }
body {
  margin: 0;
  min-height: 100%;
  background-color: var(--dark-strong);
  font-family: var(--font);
  color: var(--text-inverse);
  font-size: 16px;
  line-height: 130%;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body.is-locked { overflow: hidden; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font); font-weight: 400; line-height: 110%; }
h1 { margin: var(--s-lg) 0; font-size: var(--h-xl); }
h2 { margin: var(--s-md) 0 var(--s-sm); font-size: var(--h-lg); }
h3, h4 { margin: var(--s-md) 0 var(--s-sm); font-size: var(--h-md); }
h5 { margin: var(--s-md) 0 var(--s-sm); font-size: var(--h-sm); }
h6 { margin: var(--s-md) 0 var(--s-sm); font-size: var(--h-xs); }
p { margin: var(--s-sm) 0 var(--s-md); font-size: var(--p-md); line-height: 160%; }
a { color: var(--accent); text-decoration: none; transition: color .2s; }
a:hover { color: var(--accent-strong); }
ul, ol { margin: var(--s-md) 0; padding-left: var(--s-md); }
li { margin-bottom: var(--s-2xs); font-size: var(--p-md); line-height: 160%; }
img { max-width: 100%; display: inline-block; vertical-align: middle; border: 0; }
strong { font-weight: 500; }
blockquote {
  margin: var(--s-md) 0; padding: var(--s-md);
  border-left: 1px solid var(--accent);
  font-size: var(--p-md); line-height: 160%; text-transform: uppercase;
}
figure { margin: 0 0 var(--s-xl); }
button { font: inherit; }
:focus-visible { outline: 1px dashed var(--accent-subtle); outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 1rem; top: -4rem; z-index: 2000; padding: .5rem 1rem; border-radius: var(--r); background: var(--accent); color: var(--text-inverse); font-family: var(--mono); text-transform: uppercase; }
.skip-link:focus { top: 1rem; color: var(--text-inverse); }

/* ── LAYOUT ────────────────────────────────────────────────── */
.page-wrapper { position: relative; }
.main { position: relative; z-index: 99; display: flex; flex-direction: column; align-items: flex-start; width: 100%; max-width: 100vw; overflow: clip; }
.container { position: relative; z-index: 9; width: 100%; max-width: 140rem; margin: 0 auto; padding: 0 var(--pad-md); }
.container.fullwidth { max-width: 150rem; }
.container.flex-grow { display: flex; flex: 1; flex-direction: column; justify-content: space-between; align-items: stretch; }
.container.grow-sizing { flex: 1; }
.section { position: relative; z-index: 9; width: 100%; max-width: 100vw; padding: var(--pad-lg) 0; background-color: var(--light-base); color: var(--text-primary); overflow: clip; }
.section.light-subtle { background-color: var(--light-subtle); }
.section.light-strong { background-color: var(--light-strong); }
.section.dark-strong { background-color: var(--dark-strong); color: var(--text-inverse); }
.section.dark-base { background-color: var(--dark-base); color: var(--text-inverse); }
.section.dark-subtle { background-color: var(--dark-subtle); color: var(--text-inverse); }
.section.case-study { padding: var(--pad-md) 0; background-color: var(--dark-strong); color: var(--text-inverse); }
.section.default-paddings { padding: var(--pad-md) 0; }
.section.no-space { padding: 0; background-color: var(--light-strong); }
.section.leadership-action { padding: var(--pad-md) 0; background-color: var(--light-strong); color: var(--text-inverse); }
.padding { position: relative; z-index: 9; padding: var(--pad-md) 0; }
.flex-row { display: flex; flex-direction: column; align-items: stretch; gap: var(--s-md); width: 100%; }
.flex-row.with-gap-small { gap: var(--s-sm); }
.flex-row.with-gap-2xsmall { gap: var(--s-2xs); }
.flex-row.with-gap-xlarge { gap: var(--s-xl); }
.flex-wrap { display: flex; flex-wrap: wrap; gap: var(--s-md); }
.max-width-30 { max-width: 30rem; }
.max-width-40 { max-width: 40rem; }
.opacity-80 { opacity: .8; }
.element-align-left { align-self: flex-start; }
.cover-image { position: absolute; inset: 0; z-index: 5; width: 100%; height: 100%; object-fit: cover; }
.cover-image.fit-to-bottom { object-position: 50% 100%; }
.cover-image.fit-to-top { object-position: 50% 0%; }
.fullwidth-line { width: 100%; height: 1px; background-color: var(--dark-strong); }
.fullwidth-line.with-margin { margin-bottom: var(--s-md); }
.dark-strong .fullwidth-line, .dark-base .fullwidth-line { background-color: var(--accent-50); }

/* ── TYPOGRAPHIE ───────────────────────────────────────────── */
.heading { position: relative; z-index: 9; margin: 0; font-size: 2rem; line-height: 120%; font-weight: 400; }
.heading.is-2xlarge { font-size: var(--h-2xl); line-height: 100%; font-weight: 500; letter-spacing: -.1rem; }
.heading.is-xlarge { font-size: var(--h-xl); letter-spacing: -.05rem; }
.heading.is-large { font-size: var(--h-lg); letter-spacing: -.03rem; }
.heading.is-medium { font-size: var(--h-md); }
.heading.is-small { font-size: var(--h-sm); }
.heading.is-xsmall { font-size: var(--h-xs); }
.heading.is-call-to-action { font-size: var(--h-lg); line-height: 110%; font-weight: 500; text-transform: uppercase; }
.heading-bold { position: relative; z-index: 9; margin: 0; font-size: var(--h-md); line-height: 110%; font-weight: 500; text-transform: uppercase; }
.heading-bold.is-2xlarge { font-size: var(--h-2xl); letter-spacing: -.05rem; }
.heading-bold.is-xlarge { font-size: var(--h-xl); letter-spacing: -.05rem; }
.heading-bold.is-large { font-size: var(--h-xl); letter-spacing: -.03rem; }
.heading-bold.is-medium { font-size: var(--h-md); }
.heading-bold.is-small { font-size: var(--h-sm); }
.heading-bold.is-xsmall { font-size: var(--h-xs); }
.paragraph { position: relative; z-index: 9; display: block; margin: 0; opacity: .8; font-size: var(--p-md); line-height: 150%; }
.paragraph.is-large { font-size: var(--p-lg); line-height: 120%; }
.paragraph.is-small { font-size: var(--p-sm); }
.paragraph.is-medium { font-weight: 500; }
.paragraph.is-bold { opacity: .85; line-height: 150%; text-transform: uppercase; }
.paragraph-bold { position: relative; z-index: 9; display: block; margin: 0; opacity: .9; font-size: var(--p-md); line-height: 150%; text-transform: uppercase; }
.paragraph-bold.is-large { font-size: var(--p-lg); }
.paragraph-bold.is-small { font-size: var(--p-sm); }
.label-text { position: relative; z-index: 9; margin: 0; font-family: var(--mono); font-size: var(--p-sm); line-height: 110%; font-weight: 400; text-transform: uppercase; }
.label-text.in-list { color: var(--text-secondary); }
.label-text.is-bold { font-weight: 700; }
.label-text.in-nav { margin: var(--s-md) auto 0; }
.label-number { font-family: var(--mono); font-size: 1.25rem; line-height: 100%; font-weight: 300; text-transform: uppercase; }
.about-label-text { font-family: var(--mono); color: var(--text-inverse); font-size: 1rem; line-height: 110%; text-transform: uppercase; }
.about-label-text.is-muted { color: var(--text-muted); }

/* Rich text */
.rich-text { width: 100%; }
.rich-text > :first-child { margin-top: 0; }
.rich-text p { opacity: .85; }
.rich-text a { text-decoration: underline; }
.rich-text img { border-radius: var(--r); }
.rich-text h2 { margin-top: var(--s-2xl); }
.rich-text h3 { margin-top: var(--s-xl); font-size: var(--h-sm); text-transform: uppercase; font-weight: 500; }
.rich-text ul { padding-left: 0; list-style: none; }
.rich-text li { position: relative; padding-left: 1.8rem; }
.rich-text li::before { content: ""; position: absolute; left: 0; top: .3em; width: 1.1rem; height: 1.1rem; background: url("images/icons/check.svg") center / contain no-repeat; }
.bold-rich-text { width: 100%; opacity: .9; }
.bold-rich-text ul { padding-left: 0; list-style: none; margin: 0; }
.bold-rich-text li { margin: 0; padding: var(--s-xs) 0 var(--s-xs) 2rem; border-bottom: 1px solid var(--accent); color: var(--accent); text-transform: uppercase; background: url("images/icons/check.svg") 0 50% / 1.4rem no-repeat; }

/* ── LABEL / BADGE / STATUS ────────────────────────────────── */
.label { position: relative; z-index: 9; display: flex; flex: none; align-items: center; padding: .25rem .75rem; border: 1px solid var(--subtle-40); border-radius: var(--r); background-color: var(--accent-10); overflow: hidden; }
.label.is-dark { border-color: var(--accent-30); background-color: var(--accent-20); color: var(--text-inverse); }
.label-dot { flex: none; width: 5px; height: 5px; margin-right: var(--s-md); border-radius: 3px; background-color: var(--accent); }
.label.is-dark .label-dot { background-color: var(--accent-400); }
.label-with-margin { display: flex; justify-content: center; margin-bottom: var(--s-lg); }
.labels-flex { display: flex; flex-wrap: wrap; gap: var(--s-xs); }
.badge { position: absolute; left: var(--s-md); top: var(--s-md); z-index: 10; padding: var(--s-2xs) var(--s-xs); border-radius: var(--r); background-color: rgba(244, 241, 240, .7); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: var(--text-primary); }
.badge-text { font-family: var(--mono); font-size: .85rem; line-height: 120%; font-weight: 500; letter-spacing: .02rem; text-transform: uppercase; }
.icon-with-backgound { width: 2.5rem; height: 2.5rem; padding: .4rem; border: 1px solid var(--accent-10); border-radius: var(--r); background-color: var(--subtle-40); object-fit: contain; }
.list-item { position: relative; z-index: 9; display: flex; align-items: flex-start; gap: var(--s-xs); }
.list-item.is-reverse { flex-direction: row-reverse; }
.pricing-label-icon { flex: none; width: 1.2rem; height: 1.2rem; }
.pricing-label-text { margin-top: .05rem; opacity: .9; font-family: var(--mono); font-size: 1rem; line-height: 110%; text-transform: uppercase; }
.rotate-icon { width: 2rem; height: 2rem; object-fit: contain; animation: spin 14s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.status-label { position: relative; display: flex; align-items: center; gap: var(--s-md); color: var(--accepting); }
.status-roll { position: relative; display: block; height: 1.1em; overflow: hidden; }
.status-text { position: relative; z-index: 9; display: block; font-size: var(--p-md); line-height: 110%; text-transform: uppercase; white-space: nowrap; animation: status-roll 6s var(--ease-out) infinite; }
@keyframes status-roll { 0%, 40% { transform: translateY(0); } 50%, 90% { transform: translateY(-100%); } 90.01% { transform: translateY(100%); } 100% { transform: translateY(0); } }
.status-dot { position: relative; z-index: 5; width: .5rem; height: .5rem; border-radius: 50%; background-color: var(--accepting); }
.status-dot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background-color: inherit; animation: pulse 2s ease-out infinite; }
@keyframes pulse { from { transform: scale(1); opacity: .8; } to { transform: scale(3); opacity: 0; } }

/* ── BOUTONS ───────────────────────────────────────────────── */
.button-link { position: relative; z-index: 9; display: flex; flex: none; justify-content: center; align-items: center; padding-right: var(--s-2xs); border-radius: var(--r); overflow: hidden; color: var(--text-inverse); }
.button-link:hover { color: var(--text-inverse); }
.button-layout {
  position: relative; z-index: 9; display: flex; flex: 1; justify-content: center; align-items: center; align-self: stretch;
  gap: var(--s-sm); min-height: 2.5rem; padding: var(--s-2xs) var(--s-2xs) var(--s-2xs) var(--s-md);
  border-radius: var(--r); background-color: var(--accent); color: var(--text-inverse);
  letter-spacing: -.02rem; cursor: pointer; transition: border-color .2s, color .2s, background-color .2s;
}
.button-link.is-glass { -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.button-link.is-glass .button-layout { border: 1px solid var(--accent-30); background-color: var(--accent-40); }
.button-link.is-glass:hover .button-layout { border-color: var(--accent-80); background-color: var(--accent-10); }
.button-text { display: flex; flex: none; justify-content: center; align-items: center; overflow: hidden; font-family: var(--mono); font-size: var(--p-sm); line-height: 110%; text-transform: uppercase; transition: transform .7s var(--ease-out), opacity .4s; }
.button-icon-block { display: flex; justify-content: center; align-items: center; align-self: stretch; width: 2.5rem; border-radius: var(--r); }
.button-icon { width: 1.2rem; height: 1.2rem; object-fit: contain; transition: transform .7s var(--ease-out), opacity .4s; }
.button-icon-left { position: absolute; left: 0; display: block; width: 1.2rem; height: 1.2rem; opacity: 0; object-fit: contain; transition: transform .7s var(--ease-out), opacity .4s; }
.button-link:hover .button-icon-left, .button-link:focus-visible .button-icon-left { opacity: 1; transform: translateX(.75rem); }
.button-link:hover .button-text, .button-link:focus-visible .button-text { transform: translateX(2.5rem); }
.button-link:hover .button-icon, .button-link:focus-visible .button-icon { opacity: 0; transform: translateX(3rem); }
.button-shadow { position: absolute; left: 0; z-index: 5; width: 100%; height: 95%; border-radius: var(--r); background-color: var(--accent-subtle); }
.button-shadow.is-dark { background-color: var(--accent-600); }
.button-link.is-glass .button-shadow { background-color: var(--accent-40); }

.button-explore { position: relative; z-index: 9; display: flex; flex: none; justify-content: center; align-items: center; gap: var(--s-sm); min-height: 2.5rem; padding: var(--s-2xs) var(--s-md); border-radius: var(--r); background-color: var(--accent); color: var(--text-inverse); cursor: pointer; overflow: hidden; transition: background-color .2s; border: 0; }
.button-explore:hover { background-color: var(--accent-600); color: var(--text-inverse); }
.button-explore-icon { position: absolute; z-index: 5; width: 1.2rem; height: 1.2rem; opacity: 0; object-fit: contain; transform: translateX(-1rem); transition: transform .7s var(--ease-out), opacity .4s; }
.button-explore:hover .button-text, .button-explore:focus-visible .button-text { opacity: 0; transform: translateX(1rem); }
.button-explore:hover .button-explore-icon, .button-explore:focus-visible .button-explore-icon { opacity: 1; transform: translateX(0); }

.small-button { position: relative; z-index: 9; }
.small-button-size { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; width: 1.8rem; height: 1.6rem; margin-right: .3rem; border-radius: var(--r); background-color: var(--accent-strong); transition: transform .5s var(--ease-out); }
.small-button-shadow { position: absolute; inset: 0; z-index: 5; border-radius: var(--r); background-color: var(--accent-600); }
.small-button-icon { width: 1rem; height: 1rem; object-fit: contain; transition: transform .5s var(--ease-out); }

/* ── NAVIGATION ────────────────────────────────────────────── */
.nav { position: absolute; inset: 0 0 auto; z-index: 999; display: flex; justify-content: center; align-items: center; height: var(--nav-h); padding: .5rem var(--pad-md); color: var(--text-inverse); }
.nav-layout { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; width: 100%; padding: 0 10rem; }
.nav-slogan { position: absolute; left: 0; z-index: 8; max-width: 11rem; }
.brand-slogan-text { max-width: 12rem; opacity: .8; font-family: var(--mono); font-size: .8rem; line-height: 1.2; text-transform: uppercase; }
.nav-main { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; gap: var(--s-lg); padding: var(--s-2xs); }
.nav-blur-backgound { position: absolute; inset: 0; z-index: 1; border: 1px solid var(--accent-20); border-radius: var(--r); background-color: var(--accent-05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); pointer-events: none; transform: translateZ(0); }
.logo-link { position: relative; z-index: 7; display: flex; align-items: center; align-self: stretch; gap: var(--s-sm); padding: var(--s-xs); border: 1px solid transparent; border-radius: var(--r); color: var(--text-inverse); transition: background-color .2s; }
.logo-link:hover { background-color: var(--accent-40); color: var(--text-inverse); }
.brand-wordmark { display: inline-flex; flex-direction: column; align-items: stretch; line-height: 1; color: inherit; }
.brand-name-text { font-size: 1.35rem; line-height: 1; font-weight: 300; letter-spacing: .08em; margin-right: -.08em; text-transform: uppercase; }
.brand-sub-text { display: flex; justify-content: space-between; margin-top: .3rem; font-size: .5rem; line-height: 1; font-weight: 300; text-transform: uppercase; }
.footer-logo-link .brand-name-text { font-size: 2rem; }
.footer-logo-link .brand-sub-text { font-size: .72rem; margin-top: .45rem; }
.nav-links-wrap { position: static; z-index: 8; display: flex; justify-content: center; align-items: center; gap: .2em; }
.home-page .nav-links-wrap, .home-page .nav-action, .home-page .menu { display: none; }
.nav-link { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; gap: var(--s-xs); min-height: 2.5rem; padding: var(--s-xs); border: 1px solid transparent; border-radius: var(--r); background-color: var(--accent-10); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-family: var(--mono); color: var(--accent-subtle); font-size: var(--p-sm); line-height: 110%; text-transform: uppercase; cursor: pointer; transition: color .2s, background-color .2s; }
.nav-link:hover { background-color: var(--accent-30); color: var(--text-inverse); }
.nav-link.is-current { background-color: var(--accent-50); color: var(--text-inverse); }
.nav-link.dropdown { background-position: 90% 50%; background-repeat: no-repeat; background-size: 0 0; transition: padding .5s var(--ease-expo), color .2s, background-color .2s; }
.mega-menu:hover .nav-link.dropdown, .mega-menu:focus-within .nav-link.dropdown { padding-right: var(--s-xl); background-image: url("images/icons/chevron-down.svg"); background-size: 1rem 1rem; }
.mega-menu { position: static; flex: none; }
.mega-menu-trigger { position: absolute; top: 3rem; left: 50%; z-index: 3; width: 100%; visibility: hidden; opacity: 0; transform: translate(-50%, -.5rem); transition: opacity .35s var(--ease-out), transform .5s var(--ease-out), visibility 0s .35s; }
.mega-menu:hover .mega-menu-trigger, .mega-menu:focus-within .mega-menu-trigger { visibility: visible; opacity: 1; transform: translate(-50%, 0); transition-delay: 0s; }
.mega-menu-layout { position: relative; z-index: 9; display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); margin-top: 1rem; padding: var(--s-md); }
.mega-menu-wrap { position: relative; z-index: 9; display: flex; flex-direction: column; gap: var(--s-xs); width: 100%; }
.mega-menu-link { position: relative; z-index: 9; display: flex; align-items: center; gap: var(--s-md); padding: var(--s-sm); border: 1px solid var(--accent-40); border-radius: var(--r); background-color: var(--accent-20); color: var(--text-inverse); transition: color .2s, background-color .2s, transform .5s var(--ease-out); }
.mega-menu-link.is-primary { background-color: var(--accent-50); }
.mega-menu-link:hover { background-color: var(--accent-50); color: var(--text-inverse); }
.mega-menu-link.is-primary:hover { background-color: var(--accent); }
.mega-menu-link-text { font-family: var(--mono); font-size: var(--p-sm); line-height: 110%; text-transform: uppercase; }
.mega-menu-number { display: flex; justify-content: center; align-items: center; align-self: stretch; min-width: 1.4rem; margin-left: auto; padding: 0 .25rem; border: 1px solid var(--accent-50); border-radius: var(--r); background-color: var(--accent-40); font-size: .75rem; line-height: 110%; text-transform: uppercase; }
.mega-menu-blur-backgound { position: absolute; inset: 0; z-index: 5; border: 1px solid var(--accent-60); border-radius: var(--r); background-color: var(--accent-40); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); pointer-events: none; }
.mega-menu-trigger .mega-menu-link { opacity: 0; transform: translateY(.5rem); }
.mega-menu:hover .mega-menu-link, .mega-menu:focus-within .mega-menu-link { opacity: 1; transform: none; transition: opacity .4s, transform .6s var(--ease-out), background-color .2s; }
.mega-menu:hover .mega-menu-link:nth-child(2) { transition-delay: .05s; }
.mega-menu:hover .mega-menu-link:nth-child(3) { transition-delay: .1s; }
.nav-button { position: relative; z-index: 9; display: flex; align-items: stretch; align-self: stretch; margin-left: auto; padding: .05rem 0; }
.nav-action { position: absolute; right: 0; z-index: 99; width: 2.5vw; min-width: 1.8rem; }
.burger-menu { position: relative; z-index: 99; display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 1.5rem; padding: .5rem 0; border: 0; background: none; cursor: pointer; }
.burger-menu-line { width: 100%; height: 1px; background-color: var(--light-base); transition: transform .5s var(--ease-out); }
.menu-open .burger-menu-line:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-open .burger-menu-line:last-child { transform: translateY(-3.5px) rotate(-45deg); }

/* Menu plein écran */
.menu { position: fixed; inset: 0; z-index: 998; display: flex; width: 100%; max-width: 100vw; height: 100dvh; visibility: hidden; overflow: clip; pointer-events: none; }
.menu-open .menu { visibility: visible; pointer-events: auto; }
.menu-layout { position: relative; z-index: 20; display: flex; justify-content: flex-end; align-items: flex-start; width: 100%; height: 100dvh; overflow: auto; }
.menu-blur-backgound { position: absolute; inset: 0; z-index: 3; -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); background-color: rgba(33, 12, 4, .2); opacity: 0; transition: opacity .5s; }
.menu-open .menu-blur-backgound { opacity: 1; }
.menu-wrap { position: relative; right: 0; z-index: 8; display: flex; flex-direction: column; justify-content: space-between; gap: 2.5rem; min-width: 30rem; margin: 4.3rem var(--pad-md) 0 0; padding: var(--pad-md); border: 1px solid rgba(228, 196, 184, .1); border-radius: var(--r); background-color: var(--accent-strong); color: var(--text-inverse); overflow: hidden; opacity: 0; transform: translateY(-1.5rem) scale(.97); transform-origin: top right; transition: opacity .4s, transform .7s var(--ease-out); }
.menu-open .menu-wrap { opacity: 1; transform: none; }
.menu-flex { position: relative; z-index: 9; display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; }
.menu-links { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-xs); width: 100%; padding: var(--s-md) 0; }
.menu-link { padding: var(--s-sm) 0; color: var(--accent-subtle); font-size: var(--h-lg); font-weight: 300; opacity: 0; transform: translateY(1rem); transition: color .2s, opacity .5s, transform .7s var(--ease-out); }
.menu-open .menu-link { opacity: 1; transform: none; }
.menu-open .menu-link:nth-child(2) { transition-delay: .04s; } .menu-open .menu-link:nth-child(3) { transition-delay: .08s; }
.menu-open .menu-link:nth-child(4) { transition-delay: .12s; } .menu-open .menu-link:nth-child(5) { transition-delay: .16s; }
.menu-open .menu-link:nth-child(6) { transition-delay: .2s; } .menu-open .menu-link:nth-child(7) { transition-delay: .24s; }
.menu-link:hover, .menu-link.is-current { color: var(--text-inverse); }
.menu-small-links { display: flex; flex-wrap: wrap; gap: var(--s-xs) var(--s-lg); width: 100%; }
.menu-small-link { padding: var(--s-2xs) 0; border-bottom: 1px dashed var(--accent); font-family: var(--mono); color: var(--accent-subtle); font-size: var(--p-sm); text-transform: uppercase; }
.menu-small-link:hover { color: var(--text-inverse); }
.menu-backgound { position: absolute; inset: 0; z-index: 3; opacity: .45; }

/* ── FOND « MESH » (dégradés, sans image externe) ──────────── */
.mesh-backgrounds { position: absolute; inset: 0; z-index: 2; background-color: var(--dark-strong); }
.mesh-backgounds-sticky { position: sticky; top: 0; height: 100%; max-height: 100dvh; }
.mesh-backgound { position: absolute; inset: 0; z-index: 5;
  background:
    radial-gradient(60% 55% at 18% 30%, rgba(165, 59, 18, .55), transparent 70%),
    radial-gradient(45% 50% at 82% 65%, rgba(174, 79, 42, .45), transparent 70%),
    radial-gradient(40% 40% at 60% 15%, rgba(228, 196, 184, .18), transparent 70%),
    radial-gradient(55% 60% at 40% 90%, rgba(99, 35, 11, .7), transparent 70%),
    var(--dark-base);
  background-size: 140% 140%;
  animation: mesh-drift 22s ease-in-out infinite alternate;
}
@keyframes mesh-drift { from { background-position: 0% 0%; } to { background-position: 100% 100%; } }
.mesh-backgound-overlay-50 { position: absolute; inset: auto 0 0; z-index: 6; height: 100%; background-color: var(--dark-strong); opacity: .5; mix-blend-mode: multiply; }
.mesh-backgound-gradient { position: absolute; inset: 0; z-index: 7; background-image: linear-gradient(180deg, var(--dark-strong), transparent 20%, transparent 80%, var(--dark-strong)); }
.body-backgound-color { position: absolute; inset: 0; z-index: 1; background-color: var(--dark-strong); }
.forms-mesh-backgound { position: absolute; inset: 0; z-index: 3; }

/* ── PARALLAXE ─────────────────────────────────────────────── */
.parallax-wrap { position: absolute; inset: 0; z-index: 5; width: 100%; height: 100%; overflow: hidden; }
.parallax-image { position: absolute; top: -10%; width: 100%; height: 120%; object-fit: cover; will-change: transform; }

/* ── RÉVÉLATIONS AU SCROLL ─────────────────────────────────── */
.js [data-reveal] { opacity: 0; transform: translateY(1.5rem); transition: opacity .9s var(--ease-out), transform 1.1s var(--ease-out); }
.js [data-reveal="fade"] { transform: none; }
.js [data-reveal].is-in { opacity: 1; transform: none; }
.js .split-word { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.js .split-word > span { display: inline-block; transform: translateY(110%); transition: transform 1.1s var(--ease-out); transition-delay: calc(var(--i) * 45ms); }
.js .is-in .split-word > span, .js .split-word.is-in > span { transform: none; }
.js .content-bold-line-color { transform: scaleX(0); transform-origin: left; transition: transform 1.6s var(--ease-out) .15s; }
.js .content-bold.is-in .content-bold-line-color { transform: none; }
.js .content-bold.is-centered .content-bold-line-color { transform-origin: center; }

/* ── CONTENT BOLD (en-têtes de section) ────────────────────── */
.content-bold { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--s-md); width: 100%; }
.content-bold.is-centered { align-items: center; text-align: center; }
.content-bold-label { margin-bottom: var(--s-md); }
.content-bold-title { margin: 0 0 var(--s-md); font-size: var(--h-lg); line-height: 100%; font-weight: 500; letter-spacing: -.05rem; text-transform: uppercase; }
.content-bold.is-centered .content-bold-title { margin-left: auto; margin-right: auto; }
.content-bold-line { position: relative; z-index: 9; width: 100%; height: 1px; overflow: hidden; }
.content-bold-line-color { position: absolute; inset: 0; background-color: var(--accent-80); }
.content-bold-wrap { display: flex; flex-wrap: wrap; gap: var(--s-md); width: 100%; }
.content-bold.is-centered .content-bold-wrap { flex-direction: column; }
.content-bold-col { display: flex; width: var(--col-2); min-width: 30rem; }
.content-bold.is-centered .content-bold-col { margin: 0 auto; justify-content: center; }
.content-bold-col.is-2nd { justify-content: flex-start; align-items: flex-start; padding-top: .4rem; }
.content-bold-text { display: block; max-width: 30rem; }
.content-bold.is-centered .content-bold-text { margin: 0 auto; }
.content-bold-space { width: 100%; height: var(--s-xl); }

/* ── HERO ACCUEIL (séquence) ───────────────────────────────── */
.hero-sequence { position: relative; z-index: 9; width: 100%; background-color: var(--dark-strong); overflow: clip; }
.hero-sequence-backgound { position: absolute; inset: 0; z-index: 3; }
.hero-sequence-backgound-sticky { position: sticky; top: 0; z-index: 3; width: 100%; height: 100vh; overflow: hidden; }
.slider-images { position: absolute; inset: 0; z-index: 7; }
.slider-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.2); transition: opacity 1.6s ease, transform 7s linear; }
.slider-image.is-active { opacity: 1; transform: scale(1); }
.hero-sequence-overlay { position: absolute; inset: 0; z-index: 9; background-image: linear-gradient(0deg, var(--dark-strong) 20%, transparent 44%, transparent 87%, var(--dark-strong)); mix-blend-mode: multiply; }
.overlay-color-for-animation { position: absolute; inset: 0; z-index: 5; background-color: var(--dark-50); mix-blend-mode: multiply; opacity: 0; }
.hero-gradient-bottom { position: absolute; inset: auto 0 0; z-index: 7; height: 20rem; background-image: linear-gradient(0deg, var(--dark-strong), transparent); }
.hero-sequence-intro { position: sticky; top: 0; z-index: 8; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: var(--s-md); width: 94%; min-height: 100vh; margin: 0 auto; padding: 8rem 0 var(--hero-bottom, clamp(.75rem, 1.5vw, 1.5rem)); color: var(--text-inverse); }
.hero-sequence-title-wrap { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0 2vw; width: 100%; font-size: 4vw; }
.hero-sequence-keywords { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 2vw; width: 100%; }
.hero-sequence-title { margin: 0 0 .5vw; font-size: 1em; line-height: 100%; font-weight: 500; text-align: center; text-transform: uppercase; color: var(--text-inverse); }
.hero-sequence-title.is-2nd { color: var(--accent-subtle); }
.hero-sequence-symbol { position: relative; top: -.06em; width: 1.2em; height: .75em; object-fit: contain; }
.hero-sequence-action { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; gap: var(--s-xl); width: 100%; margin-top: var(--s-md); }
.hero-sequence-buttons { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--s-md); }
.hero-sequence-content { position: relative; z-index: 9; min-height: 250vh; color: var(--text-inverse); }
.hero-sequence-sicky { position: sticky; top: 0; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh; padding: var(--pad-md) 0; }
.hero-sequence-wrap { position: relative; display: flex; flex: 1; flex-direction: column; justify-content: space-between; gap: var(--s-md); width: 100%; max-width: 60rem; margin: 0 auto; }
.hero-sequence-card { position: relative; z-index: 9; display: flex; flex: 1; flex-direction: column; justify-content: space-between; align-items: center; align-self: stretch; gap: 1vh; padding: var(--s-xl); border: 1px solid var(--light-20); border-radius: var(--r); background-color: var(--light-20); -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px); overflow: hidden; will-change: transform, opacity; }
.hero-sequence-card-title { display: flex; justify-content: space-between; align-items: flex-end; align-self: stretch; gap: var(--s-md); padding-bottom: .5rem; }
.hero-sequence-number { margin-bottom: -.5rem; color: var(--text-inverse); font-size: 9vh; line-height: 100%; font-weight: 400; text-transform: uppercase; }
.hero-sequence-line { width: 100%; height: 1px; margin-bottom: auto; background-color: rgba(244, 241, 240, .7); opacity: .3; }
.hero-sequence-card-block { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-md); width: 100%; }
.hero-sequence-card-p { max-width: 32rem; margin: 0; color: var(--text-muted); font-size: var(--p-md); line-height: 150%; font-weight: 300; }
.hero-sequence-card-image { width: 8vw; height: 8vh; border-radius: var(--r); object-fit: cover; }

/* ── CALL TO ACTION (images flottantes) ────────────────────── */
.call-to-action-wrap { position: relative; z-index: 10; width: 100%; background-color: var(--dark-base); color: var(--text-inverse); }
.call-to-action-wrap.is-light { background-color: var(--accent-subtle); color: var(--accent-strong); }
.call-to-action-wrap.is-light .call-to-action-backgound { opacity: .5; }
.call-to-action-wrap.is-light .gradient-dark-top { display: none; }
.cta-images { position: absolute; inset: 0; z-index: 5; display: flex; justify-content: center; align-items: center; width: 70%; max-width: 70rem; margin: 0 auto; font-size: 1em; }
.cta-images > div { position: absolute; border-radius: var(--r); overflow: hidden; will-change: transform, opacity; }
.cta-image-1st { inset: 0 auto auto 0; width: 12em; height: 15em; }
.cta-image-2nd { inset: 4em 0 auto auto; width: 10em; height: 15em; }
.cta-image-3rd { inset: auto auto auto -22.3em; width: 19em; height: 12em; margin-top: -14.4em; }
.cta-image-4th { inset: auto 10.8em 4.7em auto; width: 12em; height: 8em; }
.cta-image-5th { inset: auto auto 9em 7em; width: 5em; height: 8em; opacity: .95; filter: blur(2.5px); }  /* légèrement flou : plan proche */
.cta-image-6th { inset: auto -5em auto auto; width: 6em; height: 4em; opacity: .85; filter: blur(6px); }  /* plus flou : plan lointain */
.call-to-action-layout { display: flex; flex-direction: column; align-items: center; gap: 2rem; width: 100%; max-width: 40rem; margin: 0 auto; padding: 20rem 0; text-align: center; }
.call-to-action-push, .call-to-action-label { position: relative; z-index: 9; }
.call-to-action-backgound { position: absolute; inset: 0; z-index: 3; }
.gradient-dark-top { position: absolute; inset: 0; z-index: 4; background-image: linear-gradient(180deg, var(--dark-strong), transparent); }
.calc-container { position: relative; z-index: 9; width: calc(100% - 2 * var(--pad-md)); margin: 0 auto; border-radius: var(--r); overflow: hidden; }

/* ── SERVICES (accueil) ────────────────────────────────────── */
.services-standard-wrap { width: 100%; }
.services-standard-list { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-md); width: 100%; }
.service-standard-item { position: relative; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; min-height: 30rem; border-radius: var(--r); color: var(--accent-subtle); overflow: hidden; }
.service-standard-backgound-media { position: absolute; inset: 0; z-index: 3; border-radius: var(--r); background-color: var(--accent); overflow: hidden; }
.service-standard-backgound-image { position: absolute; inset: 0; z-index: 5; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.service-standard-item:hover .service-standard-backgound-image { transform: scale(1.06); }
.service-standard-gradient { position: absolute; inset: 0; z-index: 8; background-image: linear-gradient(180deg, transparent 30%, rgba(33, 12, 4, .85)); mix-blend-mode: multiply; }
.service-standard-content { position: relative; z-index: 9; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--s-md); width: 100%; padding: var(--s-md); }
#explorer .service-standard-action { display: none; }
.services-standard-title { display: flex; flex: none; flex-direction: column; gap: var(--s-md); width: 100%; padding-bottom: var(--s-md); border-bottom: 1px solid var(--subtle-40); color: var(--text-inverse); }
.services-standard-about { position: relative; z-index: 9; max-width: 27rem; }

/* ── NEWSLETTER ────────────────────────────────────────────── */
.section-newsletter { position: relative; z-index: 9; width: 100%; padding: var(--pad-lg) 0; background-color: var(--dark-base); color: var(--text-inverse); }
.newsletter-wrap { display: flex; flex-direction: column; gap: var(--s-md); width: 100%; max-width: 64rem; margin: 0 auto; }
.newsletter-form-flex { display: flex; flex-direction: column; gap: var(--s-md); width: 100%; max-width: 72rem; margin: 0 auto; text-align: center; }
.newsletter-form-component { width: 100%; padding: var(--s-xs); border-radius: var(--r); background-color: var(--accent-10); }
.newsletter-form { display: flex; align-items: stretch; gap: var(--s-xs); width: 100%; font-family: var(--mono); font-weight: 500; }
.newsletter-field-wrap { position: relative; z-index: 9; width: 100%; transition: width .6s var(--ease-expo); }
.newsletter-field-wrap:hover, .newsletter-field-wrap:focus-within { width: 110%; }
.newsletter-point { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; opacity: .8; }

/* ── FORMULAIRES ───────────────────────────────────────────── */
.form-flex-size { display: flex; flex-direction: column; gap: var(--s-md); width: 100%; max-width: 56rem; margin: 0 auto; text-align: center; }
.form-component { position: relative; z-index: 9; display: flex; flex-direction: column; gap: var(--s-md); width: 100%; padding: var(--s-sm); border-radius: var(--r); background-color: var(--accent-10); }
.form { display: flex; flex-direction: column; align-items: stretch; width: 100%; font-family: var(--mono); font-weight: 500; }
.field-wrap { position: relative; z-index: 9; display: block; width: 100%; margin-bottom: var(--s-md); }
.text-field { position: relative; z-index: 7; display: block; width: 100%; height: 5rem; margin: 0; padding: var(--s-md); border: 1px solid transparent; border-bottom-color: var(--accent); border-radius: var(--r); background-color: var(--accent-10); color: var(--text-inverse); font-family: var(--font); font-size: 1.5rem; line-height: 110%; text-align: center; text-transform: uppercase; transition: border-color .2s, background-color .2s; }
.text-field:hover, .text-field:focus { border-color: var(--accent-400); background-color: var(--accent-20); outline: none; }
.text-field::placeholder { color: var(--accent-subtle); font-size: 1rem; }
.text-field.is-area { height: auto; min-height: 8rem; resize: vertical; text-transform: none; font-size: 1.15rem; padding-top: 2.5rem; }
.form-field-label { position: absolute; inset: 0 auto auto 0; z-index: 9; margin-bottom: var(--s-md); padding: var(--s-2xs); border: 1px solid var(--accent); border-radius: var(--r); background-color: var(--accent); color: var(--text-muted); font-family: var(--mono); font-size: .8rem; font-weight: 500; text-align: center; text-transform: uppercase; }
.form-field-label.is-required { inset: 0 0 auto auto; border-color: var(--accent-strong); background-color: var(--accent-strong); }
.form-field-label.for-checkbox { position: relative; width: 100%; margin: 0; padding: 0; border-color: transparent; background-color: transparent; }
.checkboxes { position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--s-md); padding: var(--s-md) 0; }
.checkbox-field { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; gap: var(--s-md); margin: 0; padding: var(--s-sm) var(--s-sm) var(--s-sm) 0; border: 1px solid var(--accent-50); border-radius: var(--r); background-color: var(--accent-05); color: var(--accent-subtle); cursor: pointer; transition: border-color .2s, background-color .2s; }
.checkbox-field:hover { border-color: var(--accent); background-color: var(--accent-20); }
.checkbox-field input { position: absolute; opacity: 0; pointer-events: none; }
.checkbox { flex: none; width: 1.25rem; height: 1.25rem; margin: 0 0 0 var(--s-sm); border: 1px solid var(--accent); border-radius: 50%; transition: background-color .2s; }
.checkbox-field input:checked + .checkbox { background: var(--accent) url("images/icons/plus.svg") center / 1rem no-repeat; }
.checkbox-field input:focus-visible + .checkbox { outline: 1px dashed var(--accent-subtle); outline-offset: 2px; }
.submit-button { width: 100%; margin-top: var(--s-md); padding: var(--s-lg) var(--s-md); border: 1px solid transparent; border-radius: var(--r); background-color: var(--accent); color: var(--text-inverse); font-family: var(--mono); font-size: 1rem; letter-spacing: .02rem; text-transform: uppercase; cursor: pointer; transition: background-color .2s; }
.submit-button:hover { border-color: var(--accent-50); background-color: var(--accent-400); }
.submit-button:disabled { opacity: .6; cursor: progress; }
.submit-button.in-newsletter { width: auto; min-width: 12rem; height: 5rem; margin: 0; }
.newsletter-mail-link { display: flex; justify-content: center; align-items: center; text-align: center; }
.form-honeypot { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.success-message, .success-newsletter-message { padding: var(--pad-lg) var(--s-md); border-radius: var(--r); background-color: var(--success); color: var(--text-inverse); text-align: center; }
.success-newsletter-message { padding: var(--pad-md) var(--s-md); }
.success-logo { width: 3rem; margin-bottom: var(--s-md); object-fit: contain; }
.error-message { margin-top: var(--s-md); padding: var(--s-md); border-radius: var(--r); background-color: var(--warning); color: var(--text-primary); text-align: center; }

/* Onglets formulaire */
.tabs { position: relative; z-index: 9; width: 100%; }
.tabs-menu { display: flex; justify-content: space-between; align-items: center; width: 100%; border-bottom: 1px solid var(--accent); }
.tab-link { flex: 1; padding: var(--s-md); border: 0; border-bottom: 5px solid transparent; background: transparent; color: var(--accent-subtle); letter-spacing: .02rem; text-align: center; text-transform: uppercase; cursor: pointer; transition: color .2s, border-color .3s; }
.tab-link:hover { color: var(--text-inverse); }
.tab-link.is-current { border-bottom-color: var(--accent); color: var(--text-inverse); }
.tabs-content { padding: var(--pad-md) 0; }
.tab-pane[hidden] { display: none; }
.tab-pane { animation: fade-in .6s var(--ease-out); }
@keyframes fade-in { from { opacity: 0; transform: translateY(.5rem); } to { opacity: 1; transform: none; } }

/* ── LISTE DE PROJETS DENSE (accueil) ──────────────────────── */
.projects-wrap { display: flex; flex-direction: column; gap: var(--s-md); width: 100%; }
.all-projects-dense { position: relative; z-index: 9; width: 100%; }
.project-dense-link { position: relative; z-index: 10; display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; padding: var(--s-md) 0; border-bottom: 1px solid var(--dark-strong); color: var(--dark-strong); text-align: left; transition: padding .6s var(--ease-expo), color .2s; }
.project-dense-link:hover { padding: var(--s-lg) 0; color: var(--accent); }
.project-dense-text { position: relative; z-index: 9; display: flex; align-items: center; width: 50%; }
.project-dense-min { width: 50%; }
.project-dense-min.is-2nd { color: var(--text-secondary); }
.project-dense-details { position: relative; z-index: 9; flex: none; min-width: 20%; opacity: .7; text-align: right; }
.project-dense-image-size { position: absolute; left: 50%; z-index: 9; width: 20vw; height: var(--img-xs); border-radius: var(--r); overflow: hidden; pointer-events: none; opacity: 0; transform: translate(-50%, 0) scale(.8) rotate(-3deg); transition: opacity .4s, transform .8s var(--ease-out); }
.project-dense-link:hover .project-dense-image-size { opacity: 1; transform: translate(-50%, 0) scale(1) rotate(0); }
.project-dense-image { position: relative; display: block; width: 100%; height: 100%; border-radius: var(--r); object-fit: cover; }
.realizations-table { border-top: 1px solid var(--dark-strong); }
.realization-row { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1.4fr) minmax(0, 1fr) 7rem; align-items: center; gap: var(--s-lg); padding: var(--s-md) 0; border-bottom: 1px solid var(--dark-strong); color: var(--dark-strong); font-size: .875rem; line-height: 130%; text-transform: uppercase; transition: color .2s, padding .6s var(--ease-expo); }
.realization-row:not(.realization-header):hover { padding: var(--s-lg) 0; color: var(--accent); }
.realization-row > :last-child { text-align: right; }
.realization-header { padding: var(--s-sm) 0; color: var(--text-secondary); font-size: .75rem; font-weight: 500; }

/* ── POURQUOI NOUS ─────────────────────────────────────────── */
.why-us { display: flex; flex-direction: column; border-radius: var(--r); overflow: hidden; }
.why-us-image { position: relative; height: var(--img-2xl); border-radius: var(--r); overflow: hidden; }
.why-us-wrap { display: flex; justify-content: space-around; align-items: flex-start; gap: var(--s-md); padding: var(--s-xl); background-color: var(--light-strong); }
.why-us-block { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--s-md); width: 100%; padding: var(--s-md) 0; text-align: left; }
.why-us-block.is-horizontal { flex-direction: column; flex-wrap: nowrap; }

/* ── SLIDER 3D (projets à la une) ──────────────────────────── */
.slider-wrap { position: relative; z-index: 9; width: calc(100% - 2 * var(--pad-md)); margin: 0 auto; transform-origin: 50% 100%; transform: perspective(1000px); }
.slider-3d-out { position: relative; z-index: 9; width: 100%; perspective-origin: 50% 100%; }
.slider-3d-out.is-2nd, .slider-3d-out.is-3rd { position: absolute; inset: 0; border-radius: var(--r); transition: transform 1s var(--ease-out); }
.slider-3d-out.is-2nd { z-index: 8; background-color: var(--accent); transform: translateY(1rem) scale(.97); }
.slider-3d-out.is-3rd { z-index: 7; background-color: var(--accent-50); transform: translateY(2rem) scale(.94); }
.slider-component { position: relative; z-index: 9; width: 100%; margin: 0 auto; }
.slider { position: relative; display: flex; width: 100%; overflow: clip; border-radius: var(--r); }
.slider-track { display: flex; width: 100%; transition: transform 1s var(--ease-out); }
.slide { flex: 0 0 100%; width: 100%; }
.featured-project-item { position: relative; display: flex; justify-content: flex-start; align-items: flex-end; width: 100%; height: 100%; min-height: calc(100svh - var(--nav-h) - var(--pad-md)); padding-top: 20rem; border-radius: var(--r); color: var(--text-primary); overflow: hidden; }
.featured-project-backgound-image { position: absolute; inset: 0; z-index: 3; }
.featured-project-backgound-image .cover-image { transform: scale(1.08); transition: transform 1.6s var(--ease-out); }
.slide.is-active .featured-project-backgound-image .cover-image { transform: scale(1); }
.featured-project-content { position: relative; z-index: 9; display: flex; flex-direction: column; gap: 4rem; width: 100%; border-radius: var(--r); background-color: var(--light-20); -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px); overflow: hidden; }
.featured-project-wrap { position: relative; z-index: 9; display: flex; flex-direction: column; align-items: flex-start; width: 50%; min-width: 50rem; padding: var(--s-md) var(--s-md) 0; }
.featured-project-about { position: relative; display: flex; gap: var(--s-md); width: 100%; min-height: 12rem; margin-bottom: var(--s-md); }
.featured-project-image { position: relative; z-index: 10; flex: 1; align-self: stretch; border-radius: var(--r); overflow: hidden; }
.featured-label { position: absolute; left: var(--s-md); top: var(--s-md); z-index: 9; border-radius: var(--r); background-color: rgba(228, 196, 184, .7); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: var(--accent-strong); }
.featured-project-block { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 70%; padding: var(--s-lg); border-radius: var(--r); background-color: var(--light-90); }
.project-title-link { color: var(--dark-strong); text-transform: uppercase; transition: color .2s; }
.project-title-link:hover { color: var(--accent); }
.featured-project-details { display: flex; align-items: center; gap: var(--s-xl); width: 100%; min-height: 8rem; padding: var(--s-md) 0; color: var(--accent); }
.featured-project-detail { display: flex; flex: 1; flex-direction: column; color: var(--text-primary); }
.featured-project-detail-block { display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; padding: var(--s-xs) 0; border-bottom: 1px solid var(--text-primary); }
.backgound-addon { position: absolute; inset: auto 0 0; z-index: 3; height: 8rem; border-radius: var(--r); background-color: var(--light-30); background-image: linear-gradient(315deg, rgba(244, 241, 240, .8) 32%, var(--light-20) 70%); }
.slider-icon { position: absolute; bottom: 2rem; right: 0; z-index: 20; display: flex; justify-content: center; align-items: center; width: 4rem; height: 4rem; margin-right: var(--s-md); border: 0; border-radius: 50%; background-color: var(--accent); cursor: pointer; transition: background-color .2s, transform .5s var(--ease-out); }
.slider-icon:hover { background-color: var(--accent-600); transform: scale(1.06); }
.slider-icon.is-previous { right: 5rem; }
.slider-icon-image { position: relative; z-index: 9; width: 1.5rem; height: 1.5rem; object-fit: contain; }

/* ── ÉQUIPE ────────────────────────────────────────────────── */
.the-team { display: flex; justify-content: center; align-items: flex-start; gap: var(--s-md); width: 100%; }
.the-team.is-single { justify-content: flex-start; }
.the-team.is-single .the-team-block { flex: 0 1 34rem; max-width: 34rem; }
.the-team-block { position: relative; z-index: 9; display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; }
.the-team-block.is-row { flex-direction: row; }
.the-team-photo { position: relative; z-index: 3; display: flex; justify-content: center; align-items: flex-end; width: 100%; height: var(--img-lg); padding: var(--s-md); border-radius: var(--r); background-color: var(--accent); overflow: hidden; }
.the-team-photo .cover-image { transition: transform 1.2s var(--ease-out); }
.the-team-block:hover .the-team-photo .cover-image { transform: scale(1.05); }
.the-team-block.is-row .the-team-photo { width: var(--img-xs); height: var(--img-xs); padding: var(--s-xs); flex: none; }
.team-name-block { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; padding: var(--s-sm); color: var(--text-inverse); text-align: center; opacity: 0; transform: translateY(1rem); transition: opacity .4s, transform .6s var(--ease-out); }
.the-team-block:hover .team-name-block, .leadership-image .team-name-block { opacity: 1; transform: none; }
.the-team-block.is-row .team-name-block { display: none; }
.team-name-backgound { position: absolute; inset: 0; z-index: 5; border-radius: var(--r); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); background-color: rgba(33, 12, 4, .15); }
.team-about { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); padding: 0 var(--s-md) var(--s-md); }
.the-team-block.is-row .team-about { align-self: stretch; padding: var(--s-md); }
.team-name { display: none; }
.the-team-block.is-row .team-name { display: block; font-size: var(--h-sm); line-height: 130%; text-transform: uppercase; }
.team-contact { margin-top: auto; }
.team-contact-link { border-bottom: 1px dashed rgba(228, 196, 184, .5); font-family: var(--mono); color: var(--text-muted); font-size: 1rem; line-height: 150%; font-weight: 300; }
.team-contact-link:hover { color: var(--text-inverse); }

/* ── BLOG (listes) ─────────────────────────────────────────── */
.blog-cms-wrap { width: 100%; }
.blog-cms-listing { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-md); width: 100%; }
.blog-cms-item { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-2xl); padding: var(--s-xl); border-radius: var(--r); background-color: var(--light-strong); }
.blog-cms-item.with-backgound-base { background-color: var(--light-base); }
.blog-list-wrap { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: var(--s-lg); width: 100%; color: var(--text-primary); }
.blog-list-image { position: relative; z-index: 5; width: 100%; height: var(--img-md); border-radius: var(--r); overflow: hidden; }
.blog-list-category { position: relative; z-index: 9; display: flex; align-items: center; gap: var(--s-md); }
.blog-cms-action { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; margin-top: auto; padding-top: var(--s-md); }
.blog-labels { position: relative; z-index: 9; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-xs) var(--s-md); }
.blog-title-link { color: var(--accent-strong); }
.blog-title-link:hover { color: var(--accent); }
.blog-featured-label { position: absolute; left: var(--s-md); top: var(--s-md); z-index: 8; border-radius: var(--r); background-color: var(--accent-strong); }
.blog-row { display: flex; gap: var(--s-md); width: 100%; }
.blog-featured-col { position: sticky; top: 5vh; display: flex; flex: 0 1 var(--col-2); flex-direction: column; align-self: stretch; gap: var(--s-md); height: 90vh; border-radius: var(--r); overflow: hidden; }
.blog-featured-list { flex: 1; display: flex; }
.blog-featured-item { position: relative; display: flex; flex: 1; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: var(--s-md); height: 100%; padding: 20rem var(--s-md) var(--s-md); }
.blog-listing-col { display: flex; flex: 0 0 var(--col-2); flex-direction: column; gap: var(--s-md); }
.blog-sticky-listing { display: flex; flex-direction: column; gap: var(--s-md); }
.blog-sticky-item { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); padding: 20rem var(--s-md) var(--s-md); border-radius: var(--r); background-color: var(--accent-20); overflow: hidden; }
.blog-featured-card { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: var(--s-md); width: 100%; padding: var(--s-md); border: 1px solid transparent; border-radius: var(--r); background-color: var(--dark-40); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); color: var(--text-inverse); transition: background-color .2s; }
.blog-featured-card:hover { background-color: var(--dark-80); }
.blog-featured-title { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: var(--s-lg); width: 100%; overflow: hidden; }
.blog-featured-content { position: relative; z-index: 9; display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; }
.blog-featured-gradient { position: absolute; inset: auto 0 0; z-index: 7; height: 50%; background-image: linear-gradient(0deg, var(--dark-strong), transparent); opacity: .7; mix-blend-mode: multiply; }
.blog-category-icon { width: 2rem; height: 2rem; object-fit: contain; }
.blog-wrap { display: flex; align-items: flex-start; gap: var(--s-3xl); width: 100%; }
.blog-column { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); max-width: 64rem; padding: var(--pad-md); border-radius: var(--r); background-color: var(--light-base); }
.blog-column-with-label { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; max-width: 64rem; padding: var(--s-md) 0; }
.blog-detail { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-xs) var(--s-md); width: 100%; padding-bottom: var(--s-md); border-bottom: 1px solid var(--text-muted); }
.sticky-categories { position: sticky; top: var(--pad-md); display: flex; flex: none; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: calc((100% - 3 * var(--gap)) / 4); padding: var(--s-md) 0; text-align: left; }
.category-link-block { padding: var(--s-2xs) 0; border-radius: var(--r); color: var(--text-primary); overflow: hidden; transition: background-color .2s, padding .2s, color .2s; }
.category-link-block:hover { padding: var(--s-2xs); background-color: var(--accent); color: var(--text-inverse); }
.blog-dense { width: 100%; }
.blog-dense-list { display: flex; flex-direction: column; gap: var(--s-md); }
.blog-dense-item { display: grid; grid-template-columns: .5fr 1fr; align-items: start; gap: var(--s-md); padding: var(--s-md); border-radius: var(--r); background-color: var(--light-strong); overflow: hidden; }
.blog-dense-image { position: relative; z-index: 5; width: 100%; height: 100%; min-height: 12rem; border-radius: var(--r); overflow: hidden; }
.blog-dense-body { display: flex; flex-direction: column; gap: var(--s-md); height: 100%; }
.blog-dense-content { display: flex; flex-direction: column; gap: var(--s-2xs); width: 100%; }
.blog-dense-action { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; margin-top: auto; padding-top: var(--s-md); }

/* ── FOOTER ────────────────────────────────────────────────── */
.footer { position: relative; z-index: 98; display: flex; flex-direction: column; justify-content: flex-end; width: 100%; border-top: 1px solid var(--accent-strong); background-color: var(--dark-strong); color: var(--text-inverse); overflow: clip; }
.footer-backgound-media { position: absolute; inset: 0; z-index: 3; overflow: hidden; }
.footer-backgound-overlay { position: absolute; inset: 0; z-index: 6; background-color: var(--accent-80); background-image: linear-gradient(180deg, transparent, var(--dark-strong)); opacity: .9; mix-blend-mode: multiply; }
.footer-call-to-action-section { position: relative; z-index: 9; display: flex; flex: 1; width: 100%; margin: 0 auto; overflow: hidden; }
.footer-call-to-action-layout { position: relative; z-index: 9; display: flex; flex: 1; justify-content: center; align-items: flex-start; align-self: stretch; gap: var(--s-md); }
.footer-card { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: var(--pad-md); width: var(--col-2); padding: var(--s-md) var(--pad-md) 0 0; color: var(--accent-subtle); }
.footer-card.is-1st { align-items: flex-end; padding: var(--s-md) 0 0 var(--pad-md); }
.footer-card.is-single { width: 100%; padding: var(--s-md) var(--pad-md) 0; }
.footer-card.is-single .footer-card-link { max-width: none; }
.footer-card-link { position: relative; z-index: 9; display: flex; flex: 1; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: var(--s-md); width: 100%; max-width: 66rem; padding: var(--s-xl); border-radius: var(--r); background-color: var(--dark-20); color: var(--text-inverse); overflow: hidden; transition: background-color .3s; }
.footer-card-link:hover { background-color: var(--dark-40); }
.footer-card-link.is-2nd { background-color: var(--accent-50); }
.footer-card-link.is-2nd:hover { background-color: var(--accent); }
.footer-card-line { position: relative; z-index: 9; width: 100%; height: 1px; margin-bottom: auto; background-color: var(--subtle-30); }
.footer-card-content { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-md) var(--s-xl); padding-top: var(--pad-md); }
.footer-contact-link { border-bottom: 1px dashed var(--subtle-40); color: var(--text-muted); font-size: var(--h-md); line-height: 140%; font-weight: 300; }
.footer-contact-link:hover { color: var(--text-inverse); }
.footer-address-text { color: var(--text-muted); font-size: var(--h-sm); line-height: 140%; font-weight: 300; }
.footer-address-text a { color: inherit; border-bottom: 1px dashed var(--subtle-40); }
.label-text.in-footer { opacity: .9; }
.footer-main-section { position: relative; z-index: 9; display: flex; width: 100%; margin: 0 auto; padding-top: var(--pad-md); overflow: hidden; }
.footer-layout { position: relative; z-index: 9; display: flex; flex: 1; justify-content: space-between; align-items: flex-start; align-self: stretch; gap: var(--s-md); padding: var(--pad-md) 0; }
.footer-layout.is-subfooter { border-top: 1px solid var(--accent-50); }
.footer-brand { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: var(--s-md); width: var(--col-2); }
.footer-layout > .footer-brand:only-child { width: 100%; }
.footer-logo-link { position: relative; z-index: 9; display: flex; flex: none; align-items: center; gap: var(--s-md); color: var(--text-inverse); }
.footer-logo-link:hover { color: var(--text-muted); }
.footer-brand-slogan { position: relative; max-width: 12rem; margin-left: 3rem; }
.footer-brand-slogan-text { font-family: var(--mono); color: var(--text-muted); font-size: .8rem; line-height: 1.2; text-transform: uppercase; }
.footer-links { width: var(--col-2); }
.footer-grid { display: grid; grid-template-columns: 1fr 1fr 1.5fr; gap: var(--s-md); width: 100%; }
.footer-grid.is-2nd { place-items: end stretch; }
.footer-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; min-width: 20%; }
.footer-wrap.last { justify-content: space-between; align-items: flex-end; align-self: stretch; margin-left: auto; text-align: right; }
.footer-link { color: var(--accent-subtle); font-size: .85rem; text-transform: uppercase; }
.footer-link:hover { color: var(--light-base); }
.footer-link.is-current { color: var(--text-inverse); font-weight: 500; }
.footer-link.is-last { margin-left: auto; text-align: right; }
.footer-link.is-text { margin-bottom: var(--s-md); opacity: .7; color: var(--text-inverse); }
.footer-address .footer-link.is-text + .footer-link.is-text { margin-bottom: 0; }
.footer-links-flex { display: flex; flex: 1; flex-direction: column; justify-content: flex-end; align-items: flex-end; gap: var(--s-2xs); margin-left: auto; }
.footer-socials { margin-top: var(--s-md); }
.footer-socials-list { display: flex; justify-content: center; align-items: center; gap: var(--s-md); }
.footer-social-link { padding: .3rem 0; opacity: .7; transition: opacity .2s; }
.footer-social-link:hover { opacity: 1; }
.social-icon { width: 1.2rem; height: 1.2rem; object-fit: contain; }
.footer-layout-call-to-action { position: relative; z-index: 9; display: flex; align-items: center; gap: var(--s-md); padding: var(--s-xl) 0; border-top: 1px solid var(--accent-50); }
.footer-action { position: relative; z-index: 9; display: flex; justify-content: space-between; align-items: center; gap: 3vw; width: var(--col-2); margin-left: auto; overflow: hidden; }
.footer-action-title { display: flex; align-items: center; gap: var(--s-md); }
.footer-author { display: flex; align-items: flex-end; align-self: stretch; gap: 2rem; width: var(--col-2); }
.subfooter-small-link { position: relative; opacity: .7; color: var(--text-inverse); font-size: .7rem; text-transform: uppercase; }
.subfooter-small-link:hover { opacity: 1; color: var(--text-inverse); }

/* ── HERO À PROPOS (reveal) ────────────────────────────────── */
.hero-reveal { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; align-items: stretch; gap: var(--s-md); width: 100%; min-height: 300vh; padding-bottom: var(--pad-md); background-color: var(--dark-strong); color: var(--text-inverse); overflow: clip; }
.hero-reveal-wrap { position: relative; top: 4.9rem; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: var(--s-md); width: calc(100% - 2 * var(--pad-md)); min-height: calc(100svh - var(--nav-h) - var(--pad-md)); margin: 0 auto var(--pad-md); padding: var(--s-xl) var(--pad-md); text-align: left; }
.hero-reveal-heading { position: relative; z-index: 9; display: flex; flex-direction: column; gap: var(--s-md); width: 100%; max-width: 72rem; margin: 0 auto; padding-bottom: var(--s-2xl); container-type: inline-size; }
.heading.is-hero-reveal-title { white-space: nowrap; font-size: 19.5cqw; line-height: 100%; font-weight: 600; letter-spacing: .33cqw; text-transform: uppercase; }
.hero-desc-text { position: relative; z-index: 9; display: block; max-width: 45cqw; margin-left: auto; color: var(--text-muted); font-size: 1.5cqw; line-height: 140%; text-transform: uppercase; }
.hero-blur-backgound { position: absolute; inset: auto 0 0 -50%; z-index: 5; width: 150vw; height: 100vh; background-color: var(--light-05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); pointer-events: none; }
.hero-reveal-heading > :not(.hero-blur-backgound) { z-index: 9; }
.hero-reveal-action { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; gap: var(--s-md); margin-top: var(--s-md); color: #d29d88; }
.hero-reveal-2nd-section { position: sticky; top: var(--pad-md); z-index: 8; display: flex; flex-wrap: wrap; align-items: stretch; width: 100%; margin-top: var(--pad-md); container-type: inline-size; }
.hero-reveal-large-text { position: relative; z-index: 9; margin: 0; font-size: 11cqw; line-height: 100%; font-weight: 400; letter-spacing: -.5cqw; text-transform: uppercase; will-change: transform, opacity; }
.hero-reveal-flex { display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; }
.hero-reveal-image { position: relative; display: flex; align-self: stretch; width: 14%; margin: 2cqw 0; border-radius: var(--r); overflow: hidden; color: var(--accent-subtle); }
.hero-contain-image { position: absolute; inset: 0; z-index: 5; width: 100%; height: 100%; object-fit: cover; opacity: .85; }
.hero-reveal-backgound { position: absolute; inset: 0; z-index: 3; }
.hero-reveal-sticky { position: sticky; top: 0; width: 100%; height: 100vh; overflow: clip; }
.hero-reveal-sticky .cover-image { will-change: transform; }
.hero-reveal-overlay { position: absolute; inset: 0; z-index: 8; background-image: linear-gradient(0deg, rgba(33, 12, 4, .2), var(--dark-20)); mix-blend-mode: multiply; }
.hero-reveal-gradient { position: absolute; inset: 0; z-index: 8; background-image: linear-gradient(0deg, var(--dark-strong), rgba(59, 22, 6, .1) 60%); }
.hero-reveal-gradient-top { position: absolute; inset: 0 0 auto; z-index: 4; height: 10rem; background-image: linear-gradient(180deg, var(--dark-strong), rgba(59, 22, 6, .1)); mix-blend-mode: multiply; }

/* Marquee images */
.marquee-wrap { display: flex; align-items: center; overflow: hidden; }
.marquee-images { display: flex; flex: none; gap: 2vw; width: 100vw; padding: 0 1vw; animation: marquee 40s linear infinite; }
.marquee-wrap:hover .marquee-images { animation-play-state: paused; }
.marquee-image { position: relative; flex: 1; height: var(--img-md); border-radius: var(--r); overflow: hidden; }
@keyframes marquee { to { transform: translateX(-100%); } }

/* Cartes impact empilées */
.impact-cards { position: sticky; top: var(--pad-md); display: flex; flex-direction: column; align-items: center; gap: var(--s-md); }
.card-sticky { position: sticky; top: 5rem; z-index: 5; width: 100%; }
.card-sticky.is-2nd { top: 14.6rem; z-index: 6; }
.card-sticky.is-3rd { top: 24.2rem; z-index: 7; }
.card-sticky.is-last { z-index: 8; }
.card-impact { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; align-items: center; align-self: stretch; gap: var(--s-md); padding: var(--s-2xl); border: 1px solid var(--light-20); border-radius: var(--r); background-color: var(--light-base); overflow: hidden; }
.card-impact.is-dark { border-color: var(--accent-30); background-color: transparent; background-image: linear-gradient(180deg, rgba(33, 12, 4, .23), rgba(59, 22, 6, .1)); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); color: var(--text-inverse); }
.card-impact-title-wrap { display: flex; justify-content: space-between; align-items: flex-end; align-self: stretch; gap: var(--s-md); padding-bottom: .5rem; }
.card-impact-title { margin-bottom: -.5rem; font-size: var(--h-2xl); line-height: 100%; font-weight: 500; text-transform: uppercase; }
.card-impact.is-dark .card-impact-title { font-weight: 300; }
.card-label { opacity: .8; }
.card-impact-line { width: 100%; height: 1px; margin: var(--s-md) 0; background-color: var(--text-muted); transform-origin: left; }
.card-impact.is-dark .card-impact-line { background-color: var(--accent); }
.card-impact-content { display: flex; align-items: flex-end; gap: var(--s-md); width: 100%; }
.card-impact-image { width: 12rem; height: var(--img-2xs); border-radius: var(--r); object-fit: cover; }

/* Éditorial (historique) */
.about-flex { display: flex; gap: var(--s-md); width: 100%; }
.about-layout { display: flex; flex: 0 0 var(--col-2); flex-direction: column; gap: var(--s-md); }
.about-action-col { position: sticky; top: 5vh; display: flex; flex: 0 1 var(--col-2); flex-direction: column; align-self: stretch; gap: var(--s-xs); height: 90vh; padding: var(--s-md); border-radius: var(--r); background-color: var(--light-strong); }
.about-action-backgound { position: relative; display: flex; flex: 1; flex-direction: column; justify-content: flex-end; align-items: center; min-height: 10rem; border-radius: var(--r); overflow: hidden; }
.about-action-layout { position: relative; z-index: 9; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; padding: var(--s-lg); border-radius: var(--r); background-color: var(--light-base); overflow: hidden; }
.about-action-label { position: relative; z-index: 9; display: flex; justify-content: space-between; align-items: center; gap: var(--s-lg); overflow: hidden; }
.about-action-title { display: flex; flex: 1; align-items: center; gap: var(--s-xs); }
.about-block { position: relative; display: flex; align-items: flex-start; gap: var(--s-2xl); border-radius: var(--r); background-color: var(--light-strong); }
.about-block-image { position: relative; height: 90vh; border-radius: var(--r); overflow: hidden; }
.content-editorial { position: relative; z-index: 9; display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; padding: var(--s-md); border-radius: var(--r); background-color: var(--light-base); }
.editorial-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; padding: var(--s-lg); }
.editorial-labels { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; }
.content-editorial-small-title { position: relative; display: flex; align-items: center; gap: var(--s-sm); }
.editorial-line { width: 100%; height: 1px; background-color: var(--accent); }
.editorial-text { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-2xs); max-width: 48rem; }
.editorial-list-wrap { display: flex; flex-direction: column; align-items: flex-start; width: 100%; padding: var(--s-lg) var(--s-xl); border-radius: var(--r); background-color: var(--light-subtle); }
.editorial-list { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; margin: var(--s-md) auto var(--s-md) 0; }
.editorial-list-item { display: flex; align-items: center; gap: var(--s-xl); }

/* Appel à l'action « leadership » */
.leadership-call-to-action { position: relative; z-index: 9; width: calc(100% - 2 * var(--pad-md)); margin: 0 auto; padding: var(--pad-lg) 0; border-radius: var(--r); overflow: clip; }
.leadership-label, .leadership-content { display: flex; flex-direction: column; align-items: center; gap: var(--s-md); padding: var(--s-md) 0; text-align: center; }
.leadership-portraits { position: relative; z-index: 999; display: flex; justify-content: center; align-items: center; gap: 4vw; width: 100%; padding: var(--pad-md) 8vw; overflow: clip; }
.leadership-image { position: relative; z-index: 10; display: flex; flex-direction: column; justify-content: flex-end; align-self: stretch; width: var(--img-sm); height: var(--img-md); padding: var(--s-xs); border-radius: var(--r); overflow: hidden; will-change: transform; }
.leadership-image.is-2nd { height: var(--img-lg); }
.marquee-title-wrap { position: absolute; z-index: 7; display: flex; flex: none; align-items: center; width: 100%; max-width: 100vw; padding: 0 4vw; overflow: hidden; pointer-events: none; }
.marquee-title-track { display: flex; flex: none; animation: marquee 30s linear infinite; }
.marquee-title { flex: none; padding-right: 6vw; color: var(--accent); font-size: 6vw; line-height: 100%; font-weight: 600; letter-spacing: 6vw; text-align: center; text-transform: uppercase; }
.marquee-title.is-light { color: rgba(228, 196, 184, .5); }

/* ── HERO PRESTATIONS (statement) ──────────────────────────── */
.hero-statement { position: relative; z-index: 8; width: 100%; min-height: 200vh; background-color: var(--dark-strong); overflow: clip; }
.hero-statement-content { position: sticky; top: 0; z-index: 9; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: var(--s-md); width: 100%; min-height: 100vh; padding: var(--pad-lg) var(--pad-md) var(--pad-md); color: var(--text-inverse); overflow: clip; }
.hero-statement-title { display: flex; justify-content: center; align-items: flex-end; width: 100%; max-width: 100rem; margin: 0 auto; container-type: inline-size; }
.hero-statement-title .heading.is-hero-statement { display: inline-block; width: max-content; max-width: none; }
.heading.is-hero-statement { color: var(--text-inverse); font-size: 14.5cqw; line-height: 100%; font-weight: 800; letter-spacing: .276em; text-indent: .276em; text-transform: uppercase; white-space: nowrap; }
.statement-cards-wrap { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s-md); width: 100%; max-width: 100rem; margin: 0 auto; }
.statement-cards-col-1 { position: relative; z-index: 9; display: flex; flex-direction: column; width: 50%; overflow: hidden; }
.statement-cards-col-2 { position: relative; z-index: 9; display: flex; flex-direction: column; width: 50%; height: 12rem; overflow: hidden; }
.statement-cards { position: relative; z-index: 7; display: flex; flex-direction: column; gap: var(--s-md); width: 100%; animation: statement-scroll 14s linear infinite; }
@keyframes statement-scroll { to { transform: translateY(calc(-50% - var(--s-md) / 2)); } }
.statement-card { position: relative; z-index: 8; display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; height: 5.5rem; padding: var(--s-sm); border: 1px solid var(--accent-60); border-radius: var(--r); background-color: var(--accent-10); color: var(--accent-subtle); text-align: right; }
.statement-card-title { display: flex; align-items: center; gap: var(--s-md); text-align: left; }
.statement-card-icon { width: 3rem; height: 2.8rem; object-fit: contain; }
.fullwidth-card-text-2 { color: var(--text-inverse); font-size: var(--h-md); line-height: 100%; text-transform: uppercase; }
.statement-cards-gradient { position: absolute; inset: 0; z-index: 9; background-image: linear-gradient(180deg, var(--dark-strong), transparent 25%, transparent 64%, rgba(33, 12, 4, .95)); pointer-events: none; }
.hero-statement-backgound { position: absolute; inset: 0; z-index: 3; }
.hero-statement-sticky { position: sticky; top: 0; z-index: 3; width: 100%; height: 100vh; }
.hero-statement-sticky .cover-image { will-change: transform; }
.hero-statement-overalay { position: absolute; inset: 0; z-index: 9; background-color: var(--dark-strong); opacity: .5; }
.hero-statement-gradient { position: absolute; inset: 0; z-index: 9; background-image: linear-gradient(180deg, var(--dark-strong), transparent 20%, transparent 40%, rgba(33, 12, 4, .6)); }

/* Prestations en vedette */
.services-featured-wrap { width: 100%; max-width: 140rem; margin: 0 auto; padding: var(--s-md); }
.services-featured-list { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-md); }
.service-featured-item { position: relative; display: flex; justify-content: center; align-items: center; width: 100%; height: 70vh; min-height: 40rem; background-color: var(--dark-strong); border-radius: var(--r); overflow: hidden; }
.service-featured-block { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; align-self: stretch; gap: var(--s-sm); width: 100%; padding: 20rem 3rem 3rem; border-radius: var(--r); color: var(--accent-subtle); text-align: center; overflow: hidden; transition: color .3s; }
.service-featured-item:hover .service-featured-block { color: var(--text-inverse); }
.service-featured-backgound { position: absolute; inset: 0; z-index: 3; border-radius: var(--r); overflow: hidden; }
.service-featured-backgound .cover-image { transition: transform 1.6s var(--ease-out); }
.service-featured-item:hover .service-featured-backgound .cover-image { transform: scale(1.06); }
.service-featured-overlay { position: absolute; inset: auto 0 0; z-index: 5; height: 100%; background-image: linear-gradient(180deg, transparent, var(--dark-strong)); }
.service-featured-text { max-width: 20rem; margin: 0; color: #d1d0ce; font-size: var(--p-md); line-height: 1.6; }
.service-featured-small-text { position: absolute; top: var(--s-md); left: var(--s-md); z-index: 6; display: flex; justify-content: center; align-items: center; border-radius: var(--r); background-color: var(--accent-40); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: var(--light-base); font-size: .9rem; text-transform: uppercase; }

/* Tarifs */
.all-programs { position: relative; z-index: 9; display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s-md); width: 100%; text-align: center; }
.pricing-option { position: relative; z-index: 9; display: flex; flex: 1; flex-direction: column; align-items: flex-start; align-self: stretch; gap: var(--s-xs); padding: var(--s-md); border-radius: var(--r); text-align: left; transition: background-color .3s; }
.pricing-option:hover { background-color: var(--light-base); }
.pricing-option-border { display: flex; flex-wrap: wrap; gap: var(--s-sm); width: 100%; margin-top: auto; padding: var(--s-2xs); border: 1px solid #e1dad7; border-radius: var(--r); background-color: var(--light-strong); }
.pricing-option-border:first-child { margin-top: 0; }
.pricing-option-layout { width: 100%; padding: var(--s-md); border-radius: var(--r); background-color: var(--light-subtle); }
.pricing-option-image { position: relative; z-index: 5; width: 100%; height: var(--img-md); margin-bottom: var(--s-lg); border-radius: var(--r); overflow: hidden; }
.pricing-option-title { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; margin-bottom: var(--s-md); padding-bottom: var(--s-md); border-bottom: 1px solid var(--text-muted); }
.pricing-option-value-text { position: relative; z-index: 9; display: flex; flex: 1; justify-content: space-between; align-items: center; gap: var(--s-md); padding: var(--s-sm) var(--s-md); border: 1px solid #e1dad7; border-radius: var(--r); background-color: var(--light-base); color: var(--accent); }
.pricing-option-value-num { font-family: var(--mono); color: var(--accent-strong); font-size: 1.5rem; line-height: 120%; font-weight: 500; }
.pricing-action { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch; align-self: stretch; gap: var(--s-xs); }
.pricing-option-highlights { display: flex; flex-direction: column; gap: var(--s-md); width: 100%; padding: var(--s-md); border-radius: var(--r); background-color: var(--light-strong); }

/* ── HERO DÉTAIL PRESTATION (plein écran) ──────────────────── */
.hero-fullscreen { position: relative; z-index: 8; display: flex; flex-direction: column; width: 100%; background-color: var(--dark-strong); color: var(--text-inverse); overflow: clip; }
.hero-fullscreen-wrap { position: relative; z-index: 9; width: 100%; padding: 10rem var(--pad-md) var(--pad-md); }
.hero-content-backgound { position: absolute; inset: 0; z-index: 3; height: 100%; background-color: var(--dark-strong); overflow: hidden; }
.hero-content-backgound .cover-image { filter: blur(40px) saturate(1.2); opacity: .55; transform: scale(1.3); }
.hero-content-backgound::after { content: ""; position: absolute; inset: 0; z-index: 6; background-image: linear-gradient(180deg, rgba(33, 12, 4, .4), rgba(33, 12, 4, .1)); }
.hero-fullscreen-content { position: relative; z-index: 9; display: flex; flex-direction: column; gap: var(--s-md); width: 100%; }
.heading.in-fullscreen-hero, .heading.in-hero-transition { max-width: 72rem; font-size: var(--h-2xl); line-height: 100%; font-weight: 500; text-transform: uppercase; }
.hero-fullscreen-line { position: relative; z-index: 9; width: 100%; height: 1px; background-color: var(--subtle-40); }
.hero-fullscreen-action { position: relative; z-index: 9; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: var(--s-md); width: 100%; }
.hero-fullscreen-backgound { position: relative; z-index: 3; height: 120vh; }
.hero-sticky-backgound { position: sticky; top: 0; z-index: 3; height: 100vh; overflow: hidden; }
.hero-sticky-backgound .cover-image { will-change: transform; }
.breadcrumbs { display: flex; align-items: center; gap: var(--s-2xs); width: 100%; }
.breadcrumb-link-text { position: relative; z-index: 9; margin: 0; padding: .25rem .75rem; border-radius: var(--r); background-color: var(--light-10); font-family: var(--mono); color: var(--text-muted); font-size: var(--p-sm); line-height: 110%; text-transform: uppercase; transition: padding .3s var(--ease-expo), color .2s; }
.breadcrumb-link-text:hover { padding: .25rem 1.25rem; color: var(--text-inverse); }
.breadcrumb-link-text.is-current { background-color: var(--light-30); color: var(--text-inverse); }

/* Contenu en deux colonnes */
.content-wrap { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--s-md); width: 100%; }
.content-sticky-overview { position: sticky; top: var(--pad-md); display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: var(--col-2); padding: var(--s-md) 0; text-align: left; }
.content-sticky-image { position: sticky; top: var(--pad-md); display: flex; width: 100%; max-width: 30rem; height: var(--img-sm); padding: var(--s-md) 0; border-radius: var(--r); overflow: hidden; }
.content-col { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: var(--col-2); margin-left: auto; padding: var(--s-md) 0; }
.service-large-image { position: relative; width: 100%; height: var(--img-2xl); border-radius: var(--r); overflow: hidden; }
.spec-list { width: 100%; }
.spec-item { display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; padding: var(--s-md) 0; border-bottom: 1px solid var(--accent); }
.spec-item .list-item { text-align: right; }

/* Prestations denses (détail) */
.services-dense-wrap { position: relative; z-index: 9; width: 100%; max-width: 140rem; margin: 0 auto; padding: 0 var(--pad-md); }
.services-dense-list { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: var(--s-xl) var(--s-md); width: 100%; }
.services-dense-item { flex: 1; }
.services-dense-link { position: relative; z-index: 9; display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; color: var(--text-muted); transition: color .5s; }
.services-dense-link:hover { color: var(--text-inverse); }
.service-dense-image-block { position: relative; z-index: 3; width: 100%; height: var(--img-md); border-radius: var(--r); background-color: var(--accent); overflow: hidden; }
.services-dense-image { position: absolute; inset: 0; z-index: 5; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.services-dense-link:hover .services-dense-image { transform: scale(1.06); }
.service-dense-content { position: relative; display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; padding: var(--s-sm); border-radius: var(--r); overflow: hidden; }
.services-dense-title { position: relative; z-index: 9; font-family: var(--mono); font-size: var(--h-2xs); text-transform: uppercase; transition: transform .6s var(--ease-out); }
.services-title-backgound { position: absolute; inset: 0; z-index: 5; border-radius: var(--r); background-color: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .7s var(--ease-out); }
.services-dense-link:hover .services-title-backgound { transform: none; }
.services-dense-link:hover .services-dense-title { transform: translateX(.5rem); }
.services-dense-link:hover .small-button-icon { transform: rotate(-45deg); }

/* ── HERO PROGRAMMES (split) ───────────────────────────────── */
.hero-split { position: relative; z-index: 8; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; width: 100%; height: 100vh; background-color: var(--dark-strong); color: var(--text-inverse); overflow: clip; }
.hero-split-content { display: flex; flex-wrap: wrap; gap: var(--s-md); width: 100%; max-width: 140rem; margin: 0 auto; padding: 0 var(--pad-md); }
.hero-split-wrap { position: relative; z-index: 9; display: flex; flex: 0 0 var(--col-2); flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: var(--s-md); padding: 20rem 0 var(--pad-md); }
.hero-split-description { position: relative; z-index: 9; display: flex; align-items: center; gap: var(--s-md); width: 100%; margin-top: var(--s-lg); padding: var(--s-md); border-left: 1px solid var(--light-30); }
.hero-split-about { display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); max-width: 29rem; margin-right: var(--s-xl); opacity: .9; }
.hero-split-images { position: relative; z-index: 9; display: flex; flex: 1; flex-direction: column; align-items: center; height: 100vh; overflow: hidden; }
.hero-split-images-wrap { position: relative; z-index: 9; display: flex; flex-direction: column; gap: var(--s-md); width: 100%; border-radius: var(--r); will-change: transform; animation: split-scroll 30s linear infinite; }
@keyframes split-scroll { to { transform: translateY(calc(-50% - var(--s-md) / 2)); } }
.hero-split-image { position: relative; z-index: 5; width: 100%; height: 50vh; min-height: 33rem; border-radius: var(--r); object-fit: cover; }
.hero-split-backgound { position: absolute; inset: 0; z-index: 3; }
.hero-split-backgound-image { position: absolute; z-index: 5; width: 100%; height: 100%; object-fit: cover; }
.hero-split-backgound-overlay { position: absolute; inset: 0; z-index: 8; background-color: var(--dark-strong); opacity: .65; mix-blend-mode: multiply; }
.hero-split-top-gradient { position: absolute; inset: 0 0 auto; z-index: 50; height: 15rem; background-image: linear-gradient(180deg, var(--dark-strong), transparent); pointer-events: none; }

/* Programmes */
.sticky-links { position: sticky; top: var(--pad-md); display: flex; flex-direction: column; align-items: flex-start; align-self: flex-start; gap: var(--s-2xs); min-width: 15%; padding: .5rem 0; }
.sticky-link { color: var(--text-primary); opacity: .5; transition: opacity .8s; }
.sticky-link.is-current, .sticky-link:hover { opacity: 1; color: var(--text-primary); }
.programs-wrap { display: flex; flex: 1; flex-direction: column; gap: var(--s-3xl); }
.programs-listing-large { display: flex; flex-direction: column; gap: var(--s-2xl); width: 100%; }
.program-item-large { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; gap: var(--s-md); width: 100%; height: 80vh; padding: 20rem var(--s-md) var(--s-md); border-radius: var(--r); overflow: clip; }
.program-image-large { position: absolute; inset: 0; z-index: 5; flex: 1; width: 100%; border-radius: var(--r); overflow: hidden; }
.program-gradient { position: absolute; inset: 0; z-index: 6; background-image: linear-gradient(180deg, transparent 30%, var(--dark-strong)); mix-blend-mode: multiply; }
.program-title-wrap { position: relative; z-index: 9; display: flex; justify-content: flex-start; align-items: flex-end; gap: var(--s-md); }
.program-content-large { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; align-self: flex-end; gap: var(--s-md); padding: var(--s-lg) var(--s-xl); border-radius: var(--r); background-image: linear-gradient(90deg, var(--light-base), rgba(244, 241, 240, .5)); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: var(--text-primary); overflow: hidden; }
.program-content-large.with-max-width-30 { flex: 1; min-width: 23rem; max-width: 30rem; background-image: linear-gradient(270deg, var(--light-base), rgba(244, 241, 240, .5)); }
.program-value-large { position: relative; z-index: 9; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-lg); width: 100%; padding: var(--s-lg); border-radius: var(--r); background-color: var(--accent-50); -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px); color: var(--text-inverse); }
.pricing-card-value-wrap-large { display: flex; flex: 1; align-items: center; gap: var(--s-sm); }
.program-icon { width: 2.2rem; height: 2.2rem; object-fit: contain; }
.program-details { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--s-2xs); }
.program-button { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: var(--s-xs); margin-left: auto; }
.programs-listing { display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; gap: var(--s-md); width: 100%; }
.program-item { position: relative; z-index: 9; display: flex; flex-direction: column; align-self: stretch; gap: var(--s-md); width: 100%; border: 1px solid var(--accent-20); border-radius: var(--r); background-color: var(--accent-10); }
.program-card { position: relative; z-index: 9; display: flex; flex: 1; flex-direction: column; width: 100%; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); overflow: hidden; }
.program-content { position: relative; display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; padding: var(--s-lg); border-radius: var(--r); background-image: linear-gradient(180deg, transparent, var(--accent-20)); overflow: hidden; }
.program-image { position: relative; z-index: 9; width: 100%; height: 20rem; margin-bottom: var(--s-md); border-radius: var(--r); overflow: hidden; }
.program-image .cover-image { transition: transform 1.2s var(--ease-out); }
.program-item:hover .program-image .cover-image { transform: scale(1.05); }
.program-value { position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; padding: var(--s-lg); border-radius: var(--r); }

/* Logos */
.logos-component { display: flex; justify-content: flex-start; align-items: center; overflow: hidden; }
.logos-wrap { flex: none; width: 100%; max-width: 100vw; animation: marquee 30s linear infinite; }
.logos-list { display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); }
.logo-item { display: flex; flex: 1; justify-content: center; align-items: center; padding: 0 var(--s-md); }
.logo-word { font-family: var(--mono); font-size: 1.15rem; letter-spacing: .25em; text-transform: uppercase; color: var(--text-secondary); opacity: .75; white-space: nowrap; }

/* ── HERO PROJETS (transition) ─────────────────────────────── */
.hero-transition { position: relative; z-index: 9; width: 100%; min-height: 200svh; padding: 0 var(--pad-md); background-color: var(--dark-strong); color: var(--text-inverse); overflow: clip; }
.hero-transition-intro { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: var(--s-2xl); width: 100%; min-height: 100vh; padding: var(--pad-lg) 0 var(--pad-md); }
.hero-transition-title { display: flex; flex: 1; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: var(--s-md); width: 100%; }
.hero-transition-line { width: 100%; height: 1px; background-color: var(--light-40); }
.hero-transition-action { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-md); width: 100%; min-height: 4rem; text-align: left; }
.hero-transition-description { display: flex; align-items: flex-end; gap: var(--s-3xl); max-width: 40rem; }
.hero-transition-status { display: flex; }
.hero-transition-content { position: relative; z-index: 9; display: flex; flex-direction: column; align-items: center; gap: var(--s-2xl); width: 100%; min-height: 200vh; color: var(--text-inverse); }
.hero-transition-sticky { position: sticky; top: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: var(--s-2xl); width: 100%; max-width: 140rem; min-height: 100dvh; margin: 0 auto; padding: var(--pad-md) 0; }
.hero-transition-sticky .marquee-title-wrap { opacity: var(--title-op, 0); }
.hero-transition-backgounds { position: absolute; inset: 0; z-index: 3; }
.hero-transition-backgounds-sticky { position: sticky; top: 0; z-index: 3; display: flex; justify-content: center; align-items: center; width: 100%; height: 100dvh; margin: 0 auto; }
.hero-transition-backgounds-wrap { position: relative; z-index: 3; width: 100%; height: 100%; margin: 0 auto; border-radius: var(--r); overflow: hidden; will-change: transform, clip-path; }
.hero-transition-1st-backgound { position: absolute; inset: 0; z-index: 5; }
.hero-transition-2nd-backgound { position: absolute; inset: 0; z-index: 3; }
.hero-transition-overlay { position: absolute; inset: 0; z-index: 9; background-color: var(--dark-strong); opacity: .5; mix-blend-mode: multiply; pointer-events: none; }
.hero-transition-gradient { position: absolute; inset: 0; z-index: 8; background-image: linear-gradient(0deg, rgba(33, 12, 4, .2), transparent 50%, transparent 80%, var(--dark-strong)); pointer-events: none; }
.hero-transition-dark { position: absolute; inset: 0; z-index: 10; background-color: var(--dark-strong); pointer-events: none; }

/* Liste de projets pleine largeur */
.projects-fullwidth { position: relative; z-index: 10; width: 100%; }
.project-item-fullwidth { display: flex; justify-content: space-between; align-items: stretch; gap: var(--s-md); width: 100%; padding: var(--s-md) 0; border-bottom: 1px solid var(--dark-subtle); overflow: clip; transition: background-color .4s; }
.project-item-fullwidth:hover { background-color: var(--accent-10); }
.project-layout { display: flex; gap: var(--s-md); width: 100%; }
.project-column-1 { display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: var(--s-md); width: var(--col-2); }
.project-column-2 { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-md); width: var(--col-2); }
.project-label { position: relative; z-index: 5; }
.project-link { position: relative; z-index: 9; display: block; width: 100%; color: var(--text-inverse); }
.project-link:hover { color: var(--accent-subtle); }
.project-link-text { font-size: var(--h-sm); line-height: 110%; font-weight: 300; text-transform: uppercase; transition: opacity .4s, transform .7s var(--ease-out); }
.project-link-text-large { position: absolute; inset: auto auto 0 0; z-index: 8; display: block; opacity: 0; font-size: var(--h-lg); line-height: 100%; font-weight: 300; text-transform: uppercase; transform: translateY(100%); transition: opacity .4s, transform .7s var(--ease-out); }
.project-item-fullwidth:hover .project-link-text { opacity: 0; transform: translateY(-100%); }
.project-item-fullwidth:hover .project-link-text-large { opacity: 1; transform: none; }
.project-media { position: relative; display: grid; flex: none; grid-template-columns: 1fr 1fr; gap: var(--s-md); width: 19vw; height: 7vw; overflow: hidden; }
.project-image { position: relative; z-index: 5; width: 100%; height: 100%; margin-top: 1px; border-radius: var(--r); object-fit: cover; transition: transform .8s var(--ease-out); }
.project-item-fullwidth:hover .project-image { transform: translateY(-4%) scale(1.04); }
.project-item-fullwidth:hover .project-image.is-2nd { transform: translateY(4%) scale(1.04); }
.project-actions { display: flex; flex: 1; justify-content: space-between; align-items: flex-end; gap: var(--s-md); padding-left: var(--s-md); }
.project-details { display: flex; flex-wrap: wrap; flex: 1; justify-content: space-between; align-items: flex-end; gap: var(--s-md); margin-right: var(--s-md); }

/* Engagements */
.engagement-column { position: relative; z-index: 9; display: flex; flex: 1; flex-direction: column; align-self: flex-start; gap: var(--s-md); }
.engagement-block { position: relative; display: flex; align-items: flex-start; gap: var(--s-2xl); margin-bottom: var(--s-md); padding: calc(var(--s-2xl) + 1.8rem) var(--s-2xl) var(--s-2xl) calc(var(--s-2xl) + 1.8rem); border-radius: var(--r); background-color: var(--light-strong); }
.engagement-number { position: absolute; inset: 0 auto auto 0; display: flex; flex: none; justify-content: center; align-items: center; width: var(--s-3xl); height: var(--s-3xl); padding: .5rem; border-top-left-radius: var(--r); border-bottom-right-radius: var(--r); background-color: var(--light-base); }
.engagement-flex { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-xs); }
.engagement-action-column { position: sticky; top: 0; z-index: 9; display: flex; flex: 1; flex-direction: column; align-self: stretch; gap: var(--s-md); max-height: 100vh; margin-bottom: var(--s-md); padding: var(--s-md); border-radius: var(--r); background-color: var(--light-strong); }
.engagement-action-image { position: relative; display: flex; flex: 1; flex-direction: column; justify-content: flex-end; align-items: center; min-height: var(--img-md); border-radius: var(--r); overflow: hidden; }
.engagement-action { position: relative; z-index: 9; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; padding: var(--s-lg); border-radius: var(--r); background-color: var(--light-base); }
.engagement-action-label { display: flex; flex: 1; align-items: center; gap: var(--s-xs); }

/* Galerie de projet (contenu CASACOSI) */
.gallery-group { display: flex; flex-direction: column; gap: var(--s-lg); width: 100%; }
.gallery-group + .gallery-group { margin-top: var(--s-3xl); }
.gallery-heading { display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; padding-bottom: var(--s-md); border-bottom: 1px solid var(--accent-50); }
.gallery-grid { display: grid; grid-auto-flow: dense; grid-template-columns: repeat(3, 1fr); gap: var(--s-md); width: 100%; }
.gallery-item { position: relative; display: block; height: var(--img-md); margin: 0; border-radius: var(--r); overflow: hidden; cursor: zoom-in; background: var(--accent-20); }
.gallery-item.is-wide { grid-column: span 2; }
.gallery-item .cover-image { transition: transform 1.2s var(--ease-out); }
.gallery-item:hover .cover-image { transform: scale(1.05); }
.gallery-item figcaption { position: absolute; left: var(--s-sm); bottom: var(--s-sm); z-index: 9; }
.gallery-item figcaption .badge { position: static; display: inline-block; }
.lightbox { position: fixed; inset: 0; z-index: 2000; display: flex; justify-content: center; align-items: center; padding: var(--pad-md); background-color: rgba(33, 12, 4, .92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); opacity: 0; visibility: hidden; transition: opacity .4s, visibility 0s .4s; }
.lightbox.is-open { opacity: 1; visibility: visible; transition-delay: 0s; }
.lightbox img { max-width: 100%; max-height: 82vh; border-radius: var(--r); object-fit: contain; }
.lightbox-caption { position: absolute; left: 50%; bottom: var(--s-xl); transform: translateX(-50%); }
.lightbox .slider-icon { bottom: 50%; transform: translateY(50%); }
.lightbox .slider-icon.is-previous { right: auto; left: var(--s-md); }
.lightbox .slider-icon.is-next { right: var(--s-md); margin-right: 0; }
.lightbox-close { position: absolute; top: var(--s-md); right: var(--s-md); z-index: 30; }

/* ── HERO CONTACT (modern) ─────────────────────────────────── */
.hero-modern { position: relative; z-index: 8; display: flex; justify-content: space-between; align-items: flex-end; width: 100%; min-height: 100vh; padding: var(--pad-md); color: var(--text-inverse); }
.hero-modern-titles { position: absolute; top: 0; bottom: 0; left: 0; z-index: 7; display: flex; flex: none; align-items: center; gap: 4vw; width: max-content; animation: marquee-titles 30s linear infinite; }
@keyframes marquee-titles { to { transform: translateX(-33.333%); } }
.heading.is-view-large { flex: none; font-size: 10.4vw; font-weight: 600; letter-spacing: -.1333vw; text-transform: uppercase; white-space: nowrap; }
.heading.is-view-large.is-2nd { color: rgba(228, 196, 184, .3); }
.hero-modern-content { position: relative; z-index: 9; display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-md); width: 100%; padding-top: 20rem; }
.hero-modern-layout { position: relative; z-index: 9; display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; }
.hero-modern-call-to-action { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-sm); width: 30%; }
.hero-modern-status { display: flex; flex: 1; justify-content: center; align-items: center; }
.hero-modern-action { display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-end; width: 30%; }
.hero-modern-action-layout { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); max-width: 20rem; }
.hero-modern-background { position: absolute; inset: 0; z-index: 3; overflow: hidden; }
.hero-modern-overlay { position: absolute; inset: 0; z-index: 6; background-color: var(--dark-strong); opacity: .5; mix-blend-mode: multiply; }
.hero-modern-gradient { position: absolute; inset: 0; z-index: 6; background-image: linear-gradient(180deg, var(--dark-strong), transparent 15%, transparent 64%, var(--dark-strong)); mix-blend-mode: multiply; }
.hero-modern-blur { position: absolute; inset: auto 0 0; z-index: 5; width: 100%; height: 50%; border-radius: var(--r); -webkit-backdrop-filter: blur(50px); backdrop-filter: blur(50px); overflow: hidden; -webkit-mask-image: linear-gradient(180deg, transparent, #000 40%); mask-image: linear-gradient(180deg, transparent, #000 40%); }
.contact-link { position: relative; z-index: 9; display: flex; align-items: center; gap: var(--s-md); color: var(--accent-subtle); }
.contact-link:hover { color: var(--text-inverse); }
.contact-link .paragraph { transition: transform .5s var(--ease-out); }
.contact-link:hover .paragraph { transform: translateX(.35rem); }
.contact-icon { flex: none; width: 1.8rem; max-width: none; height: 1.8rem; object-fit: contain; }

/* FAQ */
.faq-grid { position: relative; z-index: 9; display: grid; grid-template-columns: 1fr 1fr; align-items: flex-start; gap: var(--s-md); width: 100%; }
.faq-contact { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); padding-top: var(--s-lg); }
.faq-team { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; margin-bottom: var(--s-md); }
.faq-action { display: flex; flex-direction: column; align-items: stretch; gap: var(--s-md); width: 100%; margin-bottom: var(--s-md); }
.faq-wrapper { position: relative; z-index: 10; width: 100%; }
.accordion { position: relative; z-index: 10; display: block; width: 100%; border-bottom: 1px solid var(--accent); cursor: pointer; overflow: hidden; transition: background-color .2s; }
.accordion:hover { background-color: var(--accent-10); }
.accordion-toggle { position: relative; z-index: 10; display: flex; justify-content: space-between; align-items: center; gap: var(--s-md); width: 100%; min-height: 5rem; padding: var(--s-md); border: 0; background: none; color: var(--text-inverse); text-align: left; cursor: pointer; }
.accordion-icon { position: relative; z-index: 10; flex: none; width: 1.3rem; height: 1.3rem; object-fit: contain; transition: transform .6s var(--ease-out); }
.accordion.is-open .accordion-icon { transform: rotate(135deg); }
.accordion-dropdown { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .6s var(--ease-out); }
.accordion.is-open .accordion-dropdown { grid-template-rows: 1fr; }
.accordion-dropdown > div { overflow: hidden; }
.accordion-spacing { padding: 0 var(--s-md) var(--s-md); }

/* ── HERO BLOG / 404 (bold) ────────────────────────────────── */
.hero-bold { position: relative; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; align-items: stretch; gap: var(--s-md); width: 100%; min-height: 100vh; padding-bottom: var(--pad-md); background-color: var(--dark-strong); color: var(--text-inverse); overflow: clip; }
.hero-bold-wrap { position: relative; top: 4.9rem; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: var(--s-md); width: calc(100% - 2 * var(--pad-md)); min-height: calc(100dvh - var(--nav-h) - var(--pad-md)); margin: 0 auto var(--pad-md); padding: var(--s-xl); text-align: left; }
.hero-bold-layout { position: relative; z-index: 9; display: flex; flex-direction: column; align-items: center; gap: var(--s-md); padding-bottom: var(--s-xl); }
.hero-bold-layout > :not(.hero-bold-backgound) { position: relative; z-index: 9; }
.heading.is-hero-bold-title { white-space: nowrap; font-size: 13cqw; line-height: 100%; font-weight: 600; text-align: center; text-transform: uppercase; }
.hero-bold-wrap { container-type: inline-size; }
.hero-bold-text { position: relative; z-index: 9; display: block; max-width: 40rem; margin-top: var(--s-md); color: var(--text-muted); font-size: 1.2rem; line-height: 140%; text-align: center; text-transform: uppercase; }
.hero-bold-backgound { position: absolute; inset: auto 0 0 -50vw; z-index: 5; width: 200vw; height: 100vh; border-bottom: 1px solid rgba(228, 196, 184, .2); background-color: var(--light-05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
.hero-bold-action { position: relative; z-index: 9; display: flex; justify-content: center; align-items: center; gap: var(--s-md); margin-top: var(--s-md); color: #d29d88; }
.hero-bold-backgound-wrap { position: absolute; inset: 0; z-index: 3; }
.hero-bold-sticky { position: sticky; top: 0; width: 100%; height: 100vh; overflow: clip; }
.hero-bold-overlay { position: absolute; inset: 0; z-index: 8; background-image: linear-gradient(0deg, rgba(33, 12, 4, .2), rgba(59, 22, 6, .1)); mix-blend-mode: multiply; }
.hero-bold-gradient { position: absolute; inset: 0; z-index: 8; background-image: linear-gradient(0deg, var(--dark-strong), rgba(59, 22, 6, .1) 60%); }
.hero-bold-gradient-top { position: absolute; inset: 0 0 auto; z-index: 4; height: 10rem; background-image: linear-gradient(180deg, var(--dark-strong), rgba(59, 22, 6, .1)); mix-blend-mode: multiply; }

/* ── HERO ARTICLE (minimal) ────────────────────────────────── */
.hero-minimal { position: relative; z-index: 9; display: flex; flex-direction: column; gap: var(--s-md); width: 100%; padding: 15rem 0 var(--pad-md); background-color: var(--dark-strong); color: var(--text-inverse); overflow: clip; }
.hero-minimal-backgound { position: absolute; inset: 0; z-index: 3; width: 100%; overflow: hidden; }
.hero-minimal-overlay { position: absolute; inset: 0; z-index: 8; background-color: var(--dark-strong); opacity: .7; mix-blend-mode: multiply; }
.hero-minimal-content { position: relative; z-index: 9; display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); width: 100%; }
.hero-minimal-title { max-width: 48rem; }
.hero-minimal-divider { width: 100%; height: 1px; background-color: var(--light-40); }
.hero-minimal-wrap { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-md); width: 100%; margin-top: var(--s-md); }
.hero-minimal-description { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-md); max-width: 30rem; }
.hero-minimal-button { display: flex; flex: none; justify-content: center; align-items: center; }

/* ── RESPONSIVE ────────────────────────────────────────────── */
@media (max-width: 991px) {
  .nav-layout { padding: 0 5rem 0 0; }
  .nav-slogan, .nav-links-wrap { display: none; }
  .nav-main { flex: 1; justify-content: flex-start; }
  .nav-action { width: 6vw; }
  .content-bold-title { font-size: 3rem; margin-bottom: 0; }
  .content-bold-col { width: 100%; min-width: auto; }
  .content-bold-col.is-2nd { padding-top: 0; }
  .content-bold-space { height: var(--s-lg); }
  .hero-sequence-intro { min-height: 100svh; padding-bottom: 3.25rem; }
  .hero-sequence-title-wrap { font-size: 5vw; }
  .hero-sequence-content { min-height: 250dvh; }
  .hero-sequence-sicky { min-height: 100dvh; }
  .hero-sequence-card { padding: var(--s-md); gap: var(--s-md); }
  .hero-sequence-number { font-size: 8vw; }
  .hero-sequence-card-image { flex: none; width: 20vw; height: 5rem; }
  .button-explore-icon { position: relative; opacity: 1; transform: none; display: block; }
  .call-to-action-layout { padding: 10rem 0; }
  .cta-images { font-size: .5em; }
  .services-standard-list, .services-featured-list, .blog-cms-listing, .faq-grid, .programs-listing { grid-template-columns: 1fr; }
  .service-standard-item { min-height: 23rem; }
  .service-featured-item { height: auto; min-height: 30rem; }
  .service-featured-small-text { display: none; }
  .featured-project-content { background-color: rgba(244, 241, 240, .5); padding-bottom: 6rem; }
  .featured-project-wrap { width: 100%; min-width: auto; padding: var(--s-md); }
  .featured-project-image, .backgound-addon { display: none; }
  .featured-project-block { width: 100%; }
  .featured-project-details { min-height: auto; }
  .slider-icon { bottom: 1.5rem; }
  .project-dense-link { padding: var(--s-lg) 0; }
  .project-dense-image-size { display: none; }
  .project-dense-text { flex: 1; width: auto; }
  .project-dense-details { min-width: 30%; }
  .why-us-wrap, .the-team { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-md); }
  .the-team-photo { height: var(--img-2xl); }
  .footer-layout, .footer-layout-call-to-action { flex-direction: column; }
  .footer-brand { flex-direction: row; align-items: center; width: 100%; margin-bottom: var(--s-md); }
  .footer-brand-slogan { max-width: none; margin-left: 0; }
  .footer-links, .footer-action { width: 100%; }
  .footer-wrap { flex: 1; gap: 0; min-width: auto; }
  .footer-link { padding: var(--s-2xs) 0; }
  .footer-link.is-text { margin-bottom: var(--s-2xs); font-size: .75rem; }
  .footer-call-to-action-layout { flex-wrap: wrap-reverse; padding-top: var(--s-md); }
  .footer-card, .footer-card.is-1st { width: 100%; padding: 0 var(--s-md); }
  .footer-card-link.is-1st { background-color: var(--dark-50); }
  .footer-card-link.is-2nd { background-color: var(--accent); }
  .heading.is-hero-reveal-title { font-size: 19cqw; letter-spacing: .5vw; }
  .hero-reveal { min-height: 300svh; }
  .hero-reveal-wrap { min-height: calc(100svh - var(--nav-h)); }
  .hero-desc-text { max-width: 27rem; font-size: 1rem; }
  .about-flex { flex-wrap: wrap-reverse; }
  .about-layout, .about-action-col { flex: 0 1 auto; width: 100%; }
  .about-action-col { position: relative; top: 0; height: auto; }
  .about-action-backgound { min-height: 20rem; }
  .about-block-image { width: 100%; height: var(--img-xl); order: -1; }
  .card-impact { padding: var(--s-lg); }
  .card-impact-title { font-size: 5vw; }
  .card-impact-image { width: 30vw; }
  .card-sticky { top: 4.5rem; } .card-sticky.is-2nd { top: 8.8rem; } .card-sticky.is-3rd { top: 13rem; }
  .leadership-image { width: var(--img-md); height: var(--img-lg); }
  .hero-statement-content { min-height: 100dvh; }
  .all-programs { flex-direction: column; }
  .pricing-option { width: 100%; }
  .pricing-option-image { height: var(--img-2xl); }
  .content-col, .content-sticky-overview { width: 100%; margin-left: 0; }
  .content-sticky-overview { position: relative; top: 0; }
  .content-sticky-image { position: relative; top: 0; max-width: none; height: var(--img-xl); }
  .services-dense-wrap { padding: var(--s-md) 0; }
  .services-dense-list { flex-wrap: nowrap; padding: 0 var(--pad-md); overflow: auto; }
  .services-dense-item { flex: none; width: 80vw; }
  .service-dense-image-block { height: var(--img-xl); }
  .hero-fullscreen-wrap { padding-top: 8rem; }
  .hero-split { height: auto; min-height: 100svh; padding-top: 5rem; }
  .hero-split-wrap { flex: 0 0 auto; width: 100%; padding-top: var(--pad-lg); }
  .hero-split-images { height: 60vw; flex: 1 1 100%; }
  .hero-split-image { height: 40vw; min-height: auto; }
  .hero-split-top-gradient { display: none; }
  .sticky-links { position: relative; top: 0; flex-direction: row; gap: var(--s-md); width: 100%; margin-bottom: var(--s-md); }
  .programs-wrap { width: 100%; flex: 0 1 auto; }
  .program-item-large { height: auto; min-height: auto; }
  .program-content-large.with-max-width-30 { min-width: 20rem; }
  .project-item-fullwidth { padding: var(--s-lg) 0; }
  .project-item-fullwidth:nth-child(odd) { background-color: var(--accent-10); }
  .project-layout { flex-direction: column; margin: var(--s-md) 0; }
  .project-column-1, .project-column-2 { width: 100%; }
  .project-link-text { font-size: var(--h-md); }
  .project-link-text-large { display: none; }
  .project-media { display: flex; width: 16vw; height: 9vw; }
  .project-image.is-2nd { display: none; }
  .project-details { flex-direction: column; justify-content: center; align-items: flex-start; align-self: stretch; }
  .hero-transition-action { flex-wrap: wrap; }
  .hero-transition-description { flex-wrap: wrap-reverse; gap: var(--s-md); max-width: 25rem; }
  .engagement-action-column { position: relative; width: 100%; max-height: none; flex: 0 1 auto; }
  .engagement-action-image { height: var(--img-2xl); min-height: auto; }
  .engagement-column { flex: 0 1 auto; }
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  .hero-modern-content { flex-wrap: wrap; }
  .hero-modern-layout { flex-wrap: wrap; gap: var(--s-xl); }
  .hero-modern-call-to-action, .hero-modern-action { width: auto; }
  .hero-modern-status { display: none; }
  .heading.is-view-large { font-size: 14vw; }
  .heading.is-hero-bold-title { font-size: 16vw; }
  .blog-row, .blog-wrap { flex-direction: column; }
  .blog-featured-col { position: relative; top: 0; width: 100%; height: auto; }
  .blog-listing-col { width: 100%; flex: 0 1 auto; }
  .blog-featured-card { background-color: var(--dark-80); }
  .sticky-categories { position: relative; top: 0; width: 100%; }
  .blog-column, .blog-column-with-label { width: 100%; }
  .menu-wrap { overflow: auto; }
  .text-field, .submit-button.in-newsletter { height: 4rem; }
  .newsletter-field-wrap:hover, .newsletter-field-wrap:focus-within { width: 100%; }
}
@media (max-width: 767px) {
  .nav-layout { justify-content: space-between; padding: 0 4.5rem 0 0; }
  .brand-name-text { font-size: 1.15rem; }
  .content-bold-title { font-size: 2.5rem; }
  .content-bold-wrap { flex-direction: column; }
  .newsletter-form { flex-direction: column; }
  .text-field { padding-top: var(--s-2xl); }
  .hero-sequence-intro { padding-bottom: 7vh; }
  .hero-sequence-title-wrap { font-size: 6vw; }
  .hero-sequence-card-image { height: 4rem; }
  .cta-images { font-size: .4em; }
  .featured-project-item { min-height: calc(100svh - var(--nav-h) - var(--pad-md)); }
  .featured-project-content { padding-bottom: 4rem; }
  .featured-project-details { flex-direction: column; gap: 0; }
  .featured-project-detail { width: 100%; }
  .slider-icon { width: 3.3rem; height: 3.3rem; bottom: 1rem; }
  .slider-icon.is-previous { right: 4.5rem; }
  .project-dense-text { flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--s-2xs); }
  .project-dense-min { width: 100%; }
  .realization-row { grid-template-columns: minmax(0, 1fr) auto; gap: var(--s-xs) var(--s-md); }
  .realization-row > :nth-child(2) { grid-column: 1 / -1; grid-row: 2; color: var(--text-secondary); }
  .realization-row > :nth-child(3) { grid-column: 1 / -1; grid-row: 3; color: var(--text-secondary); }
  .realization-row > :last-child { grid-column: 2; grid-row: 1; }
  .realization-header { display: none; }
  .service-standard-action { order: 9999; }
  .footer-grid { grid-template-columns: 1fr 1fr; row-gap: var(--s-xl); }
  .footer-grid.is-2nd { grid-template-columns: 1fr; gap: 0; }
  .footer-wrap.last { justify-content: space-between; align-items: flex-start; margin-left: 0; text-align: left; }
  .footer-link { line-height: 150%; }
  .footer-link.is-last { margin-left: 0; }
  .footer-links-flex { justify-content: flex-start; align-items: flex-start; width: 100%; margin-left: 0; text-align: left; }
  .footer-author { width: 100%; margin-bottom: 1rem; }
  .footer-main-section { padding-bottom: var(--pad-md); }
  .heading.is-hero-reveal-title { font-size: 16vw; text-align: center; }
  .hero-desc-text { max-width: none; text-align: center; }
  .hero-reveal-image { width: 20%; }
  .heading.is-hero-statement { font-size: 9vw; letter-spacing: .11em; text-indent: 0; text-align: left; }
  .hero-statement { min-height: 100svh; }
  .hero-statement-content { min-height: 100svh; padding-bottom: var(--pad-xl); }
  .hero-statement-title { justify-content: flex-start; }
  .statement-cards-wrap { flex-direction: column; }
  .statement-cards-col-1, .statement-cards-col-2 { width: 100%; }
  .statement-card { height: 4rem; padding: .5rem var(--s-sm); }
  .statement-card-icon { width: 2.5rem; height: 2.5rem; }
  .why-us-wrap { grid-template-columns: 1fr; }
  .card-impact-content { flex-direction: column; align-items: flex-start; }
  .card-impact-image { width: 50%; height: var(--img-sm); }
  .card-sticky.is-2nd { top: 7.6rem; } .card-sticky.is-3rd { top: 10.7rem; }
  .leadership-image.is-1st, .leadership-image.is-3rd { display: none; }
  .leadership-image { width: var(--img-lg); height: var(--img-xl); }
  .marquee-title { font-size: 14vw; }
  .program-item-large { padding-top: var(--s-md); background-color: var(--light-strong); }
  .program-image-large { position: relative; flex: 0 1 auto; height: 20rem; }
  .program-gradient { display: none; }
  .program-title-wrap { flex-direction: column; align-items: flex-start; gap: var(--s-2xs); }
  .program-content-large { width: 100%; background: var(--light-strong); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .program-content-large.with-max-width-30 { width: 100%; min-width: auto; max-width: none; }
  .program-value-large { gap: var(--s-md); background-color: var(--accent-strong); -webkit-backdrop-filter: none; backdrop-filter: none; justify-content: flex-start; }
  .program-button { width: 100%; justify-content: flex-start; margin-top: var(--s-md); }
  .program-icon { width: 2rem; height: 2rem; }
  .blog-featured-content { flex-direction: column; align-items: flex-start; }
  .blog-list-image { height: var(--img-lg); }
  .blog-dense-item { grid-template-columns: 1fr; }
  .blog-dense-image { height: var(--img-lg); }
  .menu-wrap { min-width: auto; max-width: calc(100vw - 2 * var(--pad-md)); padding: 10vw; }
  .accordion-toggle { min-height: auto; }
  .hero-modern-layout { justify-content: space-between; align-items: flex-start; }
  .hero-transition-description { justify-content: center; align-items: center; margin: 0 auto; text-align: center; }
  .hero-transition-status { justify-content: center; width: 100%; margin: var(--s-xl) 0; }
  .hero-transition-title { text-align: center; align-items: center; }
  .hero-sticky-backgound { height: 70vh; }
  .hero-fullscreen-backgound { height: 70vh; }
  .hero-minimal-wrap { flex-wrap: wrap; }
  .gallery-grid { grid-template-columns: 1fr; }
  .gallery-item.is-wide { grid-column: auto; }
}
@media (max-width: 479px) {
  :root { --nav-h: 3.3rem; }
  .nav { height: var(--nav-h); }
  .nav-button, .nav-blur-backgound { display: none; }
  .nav-main { flex: 0 1 auto; padding: 0; }
  .nav-action { width: 10vw; }
  .logo-link { padding-left: 0; padding-right: 0; }
  .logo-link:hover { background-color: transparent; }
  .content-bold-title { font-size: 2rem; }
  .content-bold-space { height: var(--s-sm); }
  .hero-sequence-title-wrap { justify-content: flex-start; gap: 0; font-size: clamp(2rem, 9vw, 3rem); text-align: left; }
  .hero-sequence-keywords { justify-content: flex-start; gap: 0 .3em; text-align: left; }
  .hero-sequence-title, .hero-sequence-title.is-2nd { text-align: left; }
  .hero-sequence-symbol { display: none; }
  .hero-sequence-action { justify-content: flex-start; }
  .hero-sequence-number { font-size: 10vw; }
  .hero-sequence-card-block { flex-direction: column; align-items: flex-start; }
  .hero-sequence-card-image { display: none; }
  .featured-project-item { padding-top: 10rem; }
  .slider-wrap { width: calc(100% - 2 * var(--pad-md)); }
  .project-dense-details { justify-content: flex-start; }
  .footer-grid { display: flex; flex-wrap: wrap; justify-content: flex-start; }
  .footer-wrap { flex: 0 1 auto; min-width: 40%; }
  .footer-wrap.last { width: 100%; }
  .footer-action { flex-direction: column; align-items: flex-start; gap: var(--s-md); }
  .footer-card { flex-direction: column; }
  .footer-card-link.is-1st, .footer-card-link.is-2nd { padding: var(--s-lg); }
  .footer-address-text { font-size: var(--h-xs); }
  .label-text.in-footer { font-size: clamp(.8125rem, .9vw, .875rem); }
  .heading.is-hero-statement { font-size: 12vw; }
  .heading.is-hero-reveal-title { font-size: 15vw; }
  .why-us-image { height: var(--img-lg); }
  .the-team { grid-template-columns: 1fr; }
  .the-team-block.is-row { flex-direction: column; }
  .the-team-block.is-row .the-team-photo { width: 100%; height: var(--img-lg); }
  .marquee-title { font-size: 30vw; }
  .menu-wrap { margin-top: 3rem; gap: 1.5rem; }
  .service-large-image { height: var(--img-lg); }
  .editorial-list-wrap { padding: var(--s-xs); }
  .editorial-wrap { padding: 0; }
  .engagement-block { padding: calc(var(--s-2xl) + 1rem) var(--s-lg) var(--s-lg) calc(var(--s-2xl) + 1.2rem); }
  .pricing-option-border { flex-wrap: wrap; }
  .card-impact-title-wrap { flex-direction: column-reverse; align-items: flex-start; }
  .card-impact-title { font-size: 8vw; }
  .card-impact-image { width: 100%; }
  .card-sticky.is-2nd { top: 9.7rem; } .card-sticky.is-3rd { top: 15rem; }
  .hero-split { padding-top: 4rem; }
  .hero-minimal { padding-top: 8rem; }
}

/* ── MOUVEMENT RÉDUIT ──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .js [data-reveal], .js .split-word > span { opacity: 1; transform: none; }
  .js .content-bold-line-color { transform: none; }
}

/* ── GARDE-FOUS SANS JAVASCRIPT ────────────────────────────── */
.hero-transition-dark { display: none; }
.js .hero-transition-dark { display: block; }
.hero-transition-sticky .marquee-title-wrap { opacity: 1; }
.js .hero-transition-sticky .marquee-title-wrap { opacity: var(--title-op, 0); }

/* ── LIBELLÉS (anciennement en police mono) ────────────────── */
.label-text, .button-text, .nav-link, .mega-menu-link-text, .brand-slogan-text, .menu-small-link,
.footer-brand-slogan-text, .badge-text, .pricing-label-text, .about-label-text, .breadcrumb-link-text,
.services-dense-title, .team-contact-link, .submit-button, .form-field-label, .tab-link {
  letter-spacing: var(--label-tracking);
}
.label-number, .pricing-option-value-num { font-weight: 300; }
.hero-sequence-number { font-weight: 400; }
.card-impact.is-dark .card-impact-title { font-weight: 100; }

/* ── NAVIGATION SUR ÉCRANS MOYENS ──────────────────────────── */
.nav-link, .button-explore .button-text { white-space: nowrap; }
@media (max-width: 1240px) {
  .nav-slogan { display: none; }
  .nav-layout { padding-left: 0; }
}

/* ── TITRES LONGS EN FRANÇAIS SUR MOBILE ───────────────────── */
.heading, .heading-bold, .content-bold-title { overflow-wrap: break-word; hyphens: auto; }
@media (max-width: 479px) {
  .heading.in-hero-transition, .heading.in-fullscreen-hero { font-size: 9vw; }
  .heading-bold.is-2xlarge { font-size: 10vw; }
}

/* ── BANDE DE NAVIGATION : même hauteur que le modèle (≈ 50 px) ── */
.nav .logo-link { padding-top: 5px; padding-bottom: 5px; }
.nav .brand-name-text { font-size: 1.2rem; }
.nav .brand-sub-text { margin-top: .2rem; font-size: .45rem; }

/* ── BLOC « ÉCHANGE CONFIDENTIEL » : fond contenu et assombri ── */
.call-to-action-backgound { overflow: hidden; }
.call-to-action-backgound::after { content: ""; position: absolute; inset: 0; z-index: 6; background-color: var(--dark-strong); opacity: .6; }
.call-to-action-wrap.is-light .call-to-action-backgound::after { display: none; }
.hero-gradient-bottom { height: 24rem; background-image: linear-gradient(0deg, var(--dark-strong) 15%, transparent); }