/* ============================================================
   STYLE.CSS — universe variables, header, footer, layout core
   Boulet Dépôt v3 — each page = own visual world via [data-universe]
   ============================================================ */

:root {
  /* default / homepage editorial tokens */
  --bg: #F5F2EC;
  --surface: #FFFFFF;
  --text: #0A0A0A;
  --text-soft: #4a4a44;
  --accent: #2C4A2B;       /* maison green */
  --line: rgba(10,10,10,0.12);
  --max: 1320px;
  --gutter: clamp(20px, 5vw, 72px);
  --header-h: 76px;
  --r: 4px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out-hard: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---------- UNIVERSE PALETTES (scoped) ---------- */
[data-universe="bolduc"] {
  --bg: #2A2A2A; --surface: #3a3a3a; --text: #FFFFFF; --text-soft: #cfcfcf;
  --accent: #E63027; --line: rgba(255,255,255,0.18); --cursor: #E63027;
}
@media (min-width: 981px) {
  [data-universe="bolduc"] {
    --max: min(97vw, 1800px);
    --gutter: clamp(12px, 1.5vw, 24px);
  }
}
[data-universe="kress"] {
  --bg: #4a1820; --surface: #5f2428; --text: #FFFFFF; --text-soft: #f5d4d4;
  --accent: #FF5555; --line: rgba(255,120,120,0.32); --cursor: #EF4444;
}
[data-universe="inlite"] {
  --bg: #0B1220; --surface: #1A2438; --text: #F5F2EC; --text-soft: #aebac9;
  --accent: #D4A574; --line: rgba(212,165,116,0.22); --cursor: #D4A574;
}
[data-universe="vegetaux"] {
  --bg: #F5F1E8; --surface: #ffffff; --text: #1B2818; --text-soft: #4d5a44;
  --accent: #2F5D34; --accent-2:#A5B97F; --line: rgba(27,40,24,0.12); --cursor: #2F5D34;
}
@media (min-width: 981px) {
  [data-universe="vegetaux"] {
    --max: min(96vw, 1600px);
    --gutter: clamp(16px, 2vw, 36px);
  }
}
[data-universe="horticole"] {
  --bg: #1C1A17; --surface: #28241F; --text: #F4EFE4; --text-soft: #b8ac96;
  --accent: #E07A1F; --accent-2:#C99464; --line: rgba(244,239,228,0.12); --cursor: #E07A1F;
}
[data-universe="gazon"] {
  --bg: #F2F7EC;
  --surface: #FFFFFF;
  --text: #122016;
  --text-soft: #4A5C43;
  --accent: #2F9E3A;
  --accent-2: #7BC24A;
  --line: rgba(18, 32, 22, 0.12);
  --cursor: #2F9E3A;
  --pb-deep: #0E2A16;
  --pb-field: #1F6B32;
  --pb-blade: #3DB84A;
  --pb-mist: #E8F6D8;
  --pb-sun: #F6FFD8;
  --font-display: 'Fraunces', serif;
  --font-body: 'Outfit', system-ui, sans-serif;
}
[data-universe="biolift"] {
  --bg: #1A2331; --surface: #232E40; --text: #FFFFFF; --text-soft: #a8b3c4;
  --accent: #E85F2C; --accent-2:#FFB36B; --line: rgba(255,255,255,0.12); --cursor: #E85F2C;
}

body { background: var(--bg); color: var(--text); transition: background .6s var(--ease), color .6s var(--ease); }

/* dark home (scroll-controlled) */
body.home-dark { background:#0A0A0A; color:#F5F2EC; }

.container { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
.wide { max-width: 1600px; }

/* ============================================================
   HEADER — adapts to universe colors
   ============================================================ */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  height: var(--header-h);
  display: flex; align-items: center;
  transition: background .4s var(--ease), backdrop-filter .4s, border-color .4s, color .4s;
  border-bottom: 1px solid transparent;
  overflow: visible;
}
.site-header.transparent { background: transparent; }
.site-header.transparent:not(.scrolled) .brand-name,
.site-header.transparent:not(.scrolled) .main-nav a,
.site-header.transparent:not(.scrolled) .tel-link { text-shadow: 0 1px 14px rgba(0,0,0,.35); }
body:not([data-universe]):not(.home-dark) .site-header.transparent:not(.scrolled) .brand-name,
body:not([data-universe]):not(.home-dark) .site-header.transparent:not(.scrolled) .main-nav a,
body:not([data-universe]):not(.home-dark) .site-header.transparent:not(.scrolled) .tel-link { text-shadow: none; }
/* light universes (gazon, vegetaux) have dark heroes -> force light header text while transparent */
[data-universe="gazon"] .site-header.transparent:not(.scrolled),
[data-universe="vegetaux"] .site-header.transparent:not(.scrolled) { color: #fff; }
[data-universe="gazon"] .site-header.transparent:not(.scrolled) .brand-name,
[data-universe="gazon"] .site-header.transparent:not(.scrolled) .brand-tag,
[data-universe="gazon"] .site-header.transparent:not(.scrolled) .main-nav a,
[data-universe="gazon"] .site-header.transparent:not(.scrolled) .tel-link,
[data-universe="vegetaux"] .site-header.transparent:not(.scrolled) .brand-name,
[data-universe="vegetaux"] .site-header.transparent:not(.scrolled) .brand-tag,
[data-universe="vegetaux"] .site-header.transparent:not(.scrolled) .main-nav a,
[data-universe="vegetaux"] .site-header.transparent:not(.scrolled) .tel-link { color: #fff; }
/* Gazon: logo blanc sur le hero, logo couleur une fois scrollé */
[data-universe="gazon"] .site-header.transparent:not(.scrolled) .brand-logo-light { display: none; }
[data-universe="gazon"] .site-header.transparent:not(.scrolled) .brand-logo-dark { display: block; }
[data-universe="gazon"] .site-header.scrolled .brand-logo-light,
[data-universe="gazon"] .site-header:not(.transparent) .brand-logo-light { display: block; }
[data-universe="gazon"] .site-header.scrolled .brand-logo-dark,
[data-universe="gazon"] .site-header:not(.transparent) .brand-logo-dark { display: none; }
body.is-home .site-header.transparent:not(.scrolled) { color: #fff; }
body.is-home .site-header.transparent:not(.scrolled) .brand-name,
body.is-home .site-header.transparent:not(.scrolled) .brand-tag,
body.is-home .site-header.transparent:not(.scrolled) .main-nav a,
body.is-home .site-header.transparent:not(.scrolled) .tel-link { color: #fff; }
body.is-home .site-header.transparent:not(.scrolled) .brand-logo-light { display: none; }
body.is-home .site-header.transparent:not(.scrolled) .brand-logo-dark { display: block; }
body.is-home .site-header.scrolled .brand-logo-light { display: block; }
body.is-home .site-header.scrolled .brand-logo-dark { display: none; }
.site-header.scrolled {
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter: blur(16px) saturate(1.2);
  border-bottom-color: var(--line);
}
/* on light universes default solid-ish; on dark universes use bg tint */
.header-inner {
  width: 100%; max-width: var(--max); margin-inline: auto;
  padding-inline: var(--gutter);
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
}

.brand { display: flex; align-items: center; gap: 12px; color: var(--text); z-index: 2; }
.brand-mark { width: 34px; height: 34px; color: var(--accent); flex-shrink: 0; }
.brand-text { display: flex; flex-direction: column; line-height: 1; }
.brand-name { font-weight: 900; font-size: 1.04rem; letter-spacing: -0.02em; color: var(--text); }
.brand-tag { font-size: .62rem; letter-spacing: .22em; text-transform: uppercase; color: var(--text-soft); margin-top: 3px; }

/* — Real Boulet Dépôt logo (image-based brand) — */
.brand { gap: 0 !important; flex-shrink: 0; }
.brand-logo {
  display: block;
  height: 44px;
  width: auto;
  max-width: none;
  flex-shrink: 0;
  object-fit: contain;
  aspect-ratio: 1200 / 312;
}
.brand-logo-dark { display: none; }
/* Dark universes: show white logo, hide green-dark one */
[data-universe="bolduc"] .brand-logo-light,
[data-universe="kress"]  .brand-logo-light,
[data-universe="inlite"] .brand-logo-light,
[data-universe="horticole"] .brand-logo-light,
[data-universe="biolift"] .brand-logo-light,
.home-dark .brand-logo-light { display: none; }
[data-universe="bolduc"] .brand-logo-dark,
[data-universe="kress"]  .brand-logo-dark,
[data-universe="inlite"] .brand-logo-dark,
[data-universe="horticole"] .brand-logo-dark,
[data-universe="biolift"] .brand-logo-dark,
.home-dark .brand-logo-dark { display: block; }
/* Hide the SVG brand-mark + text labels when the image logo is present */
.brand:has(.brand-logo) .brand-mark,
.brand:has(.brand-logo) .brand-text { display: none; }
@media (max-width: 720px) { .brand-logo { height: 38px; } }

.main-nav > ul { display: flex; align-items: center; gap: 30px; }
.main-nav a { font-size: .82rem; letter-spacing: .04em; color: var(--text); font-weight: 500; position: relative; padding: 4px 0; transition: opacity .2s; }
.main-nav > ul > li > a { white-space: nowrap; }
.main-nav a:hover { opacity: .6; }
.main-nav a.is-active::after { content:''; position:absolute; left:0; right:0; bottom:-3px; height:2px; background: var(--accent); }

.nav-dropdown { position: relative; }
.nav-dropdown > a { display: inline-flex; align-items: center; gap: 5px; }

/* ---------- universe-tinted dropdown ---------- */
/* per-universe palette tokens, applied via [data-uni] on each <a> */
.nav-uni[data-uni="bolduc"] { --u-bg:#F2EBE2; --u-text:#1A1A1A; --u-accent:#E63027; --u-sub:#6a6660; }
.nav-uni[data-uni="kress"]  { --u-bg:#FAE9E7; --u-text:#3A0F0F; --u-accent:#DC2626; --u-sub:#7d4a4a; }
.nav-uni[data-uni="inlite"] { --u-bg:#F3EDDF; --u-text:#1F2A3A; --u-accent:#C5934A; --u-sub:#6a6a64; }
.nav-uni[data-uni="gazon"]  { --u-bg:#F4F6EF; --u-text:#16240F; --u-accent:#3A6B2E; --u-sub:#4c5a40; }
.nav-uni[data-uni="vegetaux"]  { --u-bg:#F5F1E8; --u-text:#1B2818; --u-accent:#2F5D34; --u-sub:#4d5a44; }
.nav-uni[data-uni="horticole"] { --u-bg:#F6EFE2; --u-text:#2A1F12; --u-accent:#C66A18; --u-sub:#8a7c66; }
.nav-uni[data-uni="biolift"] { --u-bg:#E8E4D7; --u-text:#1A2331; --u-accent:#E85F2C; --u-sub:#5a6478; }

/* Universe hero photo bindings — cinematic preview per universe.
   style.css lives at site root, so url() is relative to root — always "assets/...". */
.nav-uni[data-uni="bolduc"]  .nav-uni-photo { background-image: url("assets/hero-bolduc-cinematic.png");  --u-photo-pos: 60% 50%; }
.nav-uni[data-uni="kress"]   .nav-uni-photo { background-image: url("assets/hero-kress-cinematic.png");   --u-photo-pos: 55% 45%; }
.nav-uni[data-uni="inlite"]  .nav-uni-photo { background-image: url("assets/hero-inlite-cinematic.png");  --u-photo-pos: 50% 60%; }
.nav-uni[data-uni="gazon"]   .nav-uni-photo { background-image: url("assets/gazon-sod-field.png");        --u-photo-pos: 50% 55%; }
.nav-uni[data-uni="vegetaux"]  .nav-uni-photo { background-image: url("assets/hero-vegetaux-cinematic.png");  --u-photo-pos: 50% 55%; }
.nav-uni[data-uni="horticole"] .nav-uni-photo { background-image: url("assets/hero-horticole-cinematic.png"); --u-photo-pos: 50% 50%; }
.nav-uni[data-uni="biolift"] .nav-uni-photo { background-image: url("assets/hero-biolift-cinematic.png"); --u-photo-pos: 60% 50%; }

.md-tile[data-uni="bolduc"]  .md-tile-photo { background-image: url("assets/hero-bolduc-cinematic.png");  --u-photo-pos: 60% 50%; }
.md-tile[data-uni="kress"]   .md-tile-photo { background-image: url("assets/hero-kress-cinematic.png");   --u-photo-pos: 55% 45%; }
.md-tile[data-uni="inlite"]  .md-tile-photo { background-image: url("assets/hero-inlite-cinematic.png");  --u-photo-pos: 50% 60%; }
.md-tile[data-uni="gazon"]   .md-tile-photo { background-image: url("assets/gazon-sod-field.png");        --u-photo-pos: 50% 55%; }
.md-tile[data-uni="vegetaux"]  .md-tile-photo { background-image: url("assets/hero-vegetaux-cinematic.png");  --u-photo-pos: 50% 55%; }
.md-tile[data-uni="horticole"] .md-tile-photo { background-image: url("assets/hero-horticole-cinematic.png"); --u-photo-pos: 50% 50%; }
.md-tile[data-uni="biolift"] .md-tile-photo { background-image: url("assets/hero-biolift-cinematic.png"); --u-photo-pos: 60% 50%; }

.nav-dropdown-menu.nav-universe-menu {
  position: absolute; top: calc(100% + 14px); left: -16px;
  background: #fff; color: #0A0A0A;
  border: 1px solid rgba(10,10,10,0.10); border-radius: 10px;
  padding: 8px; min-width: 360px;
  display: flex; flex-direction: column; gap: 3px;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
  box-shadow: 0 28px 70px rgba(0,0,0,.35);
  z-index: 50;
}
/* on dark headers (over-hero on pages with data-universe), keep the menu light for legibility */
[data-universe] .nav-dropdown-menu.nav-universe-menu { background:#fff; color:#0A0A0A; }

.nav-dropdown:hover .nav-dropdown-menu.nav-universe-menu,
.nav-dropdown:focus-within .nav-dropdown-menu.nav-universe-menu { opacity: 1; visibility: visible; transform: translateY(0); }

/* widen the dropdown panel to host the richer tiles */
.nav-dropdown-menu.nav-universe-menu { min-width: 420px !important; padding: 10px !important; }

.nav-uni {
  display: grid !important;
  grid-template-columns: 38px 1fr auto;
  align-items: center; column-gap: 14px;
  padding: 12px 14px !important;
  border-radius: 8px;
  position: relative; overflow: hidden; isolation: isolate;
  color: #0A0A0A; opacity: 1 !important;
  transition: background .28s var(--ease), color .28s var(--ease), transform .28s var(--ease);
}
/* Universe-signature pattern layer (paints over background on hover) */
.nav-uni-pattern {
  position: absolute; inset: 0; z-index: 0;
  opacity: 0; pointer-events: none;
  transition: opacity .35s var(--ease);
  background-color: var(--u-bg);
  background-image: var(--u-pattern, none);
  background-size: var(--u-pattern-size, auto);
  background-position: var(--u-pattern-pos, 0 0);
}
/* Universe hero photo layer — cinematic preview revealed on hover */
.nav-uni-photo {
  position: absolute; inset: 0; z-index: 0;
  opacity: 0; pointer-events: none;
  background-size: cover;
  background-position: var(--u-photo-pos, center);
  transition: opacity .42s var(--ease), transform .9s var(--ease);
  transform: scale(1.04);
  mask-image: linear-gradient(90deg, #000 0%, #000 32%, rgba(0,0,0,.55) 56%, rgba(0,0,0,.05) 100%);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 32%, rgba(0,0,0,.55) 56%, rgba(0,0,0,.05) 100%);
}
.nav-uni-photo::after {
  content:''; position:absolute; inset:0;
  background: linear-gradient(90deg, var(--u-bg) 0%, color-mix(in srgb, var(--u-bg) 70%, transparent) 28%, transparent 60%);
}
.nav-uni > .nav-uni-icon,
.nav-uni > .nav-uni-text,
.nav-uni > .nav-uni-tag { position: relative; z-index: 1; }

/* Signature icon — replaces the old swatch */
.nav-uni-icon {
  width: 38px; height: 38px;
  display: grid; place-items: center;
  border-radius: 8px;
  background: color-mix(in srgb, var(--u-accent) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--u-accent) 24%, transparent);
  color: var(--u-accent);
  transition: background .28s var(--ease), border-color .28s var(--ease), color .28s var(--ease), transform .28s var(--ease);
}
.nav-uni-icon svg { width: 20px; height: 20px; }

.nav-uni-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.nav-uni .dd-title { font-weight: 700; font-size: .94rem; letter-spacing: -.005em; }
.nav-uni .dd-sub { font-size: .72rem; color: #6a6a64; letter-spacing: .01em; transition: color .25s; }
.nav-uni-tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: .66rem; font-weight: 600; letter-spacing: .1em;
  padding: 4px 8px; border-radius: 3px;
  background: color-mix(in srgb, var(--u-accent) 12%, transparent);
  color: var(--u-accent);
  transition: background .25s, color .25s, border-color .25s;
  border: 1px solid color-mix(in srgb, var(--u-accent) 22%, transparent);
  white-space: nowrap;
}

/* Hover — universe takes over */
.nav-uni:hover { color: var(--u-text); transform: translateX(2px); }
.nav-uni:hover .nav-uni-pattern { opacity: .55; }
.nav-uni:hover .nav-uni-photo { opacity: 1; transform: scale(1); }
.nav-uni:hover .dd-sub { color: var(--u-sub); }
.nav-uni:hover .nav-uni-icon {
  background: color-mix(in srgb, var(--u-accent) 22%, transparent);
  border-color: color-mix(in srgb, var(--u-accent) 55%, transparent);
  color: var(--u-accent);
  transform: scale(1.04);
}
.nav-uni:hover .nav-uni-tag {
  background: var(--u-accent); color: #fff;
  border-color: var(--u-accent);
}
/* gazon is light-bg, icon needs a dark color */
.nav-uni[data-uni="gazon"]:hover .nav-uni-icon { color: var(--u-accent); background: rgba(58,107,46,.18); border-color: rgba(58,107,46,.55); }

/* ---------- Mega-menu catégories (style pepiniere.ca) ---------- */
.nav-mega {
  position: static;
}
.nav-mega > a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.nav-mega-panel {
  position: fixed;
  left: 0;
  right: 0;
  top: var(--header-h);
  z-index: 190;
  width: 100%;
  padding: 1.25rem clamp(1.25rem, 3vw, 2.5rem) 1.5rem;
  background: var(--mega-bg, #fff);
  color: var(--mega-text, #122016);
  border-bottom: 1px solid var(--mega-line, rgba(18, 32, 22, 0.1));
  box-shadow: 0 28px 60px rgba(0, 0, 0, 0.18);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity 0.22s var(--ease), transform 0.22s var(--ease), visibility 0.22s;
}
/* Palette par univers — même langage que le site */
.nav-mega-panel[data-uni="gazon"] {
  --mega-bg: #F2F7EC;
  --mega-text: #16240F;
  --mega-accent: #2F9E3A;
  --mega-line: rgba(22, 36, 15, 0.12);
  --mega-hub: #2F9E3A;
}
.nav-mega-panel[data-uni="vegetaux"] {
  --mega-bg: #F5F1E8;
  --mega-text: #1B2818;
  --mega-accent: #2F5D34;
  --mega-line: rgba(27, 40, 24, 0.12);
  --mega-hub: #2F5D34;
}
.nav-mega-panel[data-uni="bolduc"] {
  --mega-bg: #2A2A2A;
  --mega-text: #FFFFFF;
  --mega-accent: #E63027;
  --mega-line: rgba(255, 255, 255, 0.14);
  --mega-hub: #E63027;
}
.nav-mega-panel[data-uni="inlite"] {
  --mega-bg: #0B1220;
  --mega-text: #F5F2EC;
  --mega-accent: #D4A574;
  --mega-line: rgba(212, 165, 116, 0.22);
  --mega-hub: #D4A574;
}
.nav-mega-panel[data-uni="kress"] {
  --mega-bg: #4a1820;
  --mega-text: #FFFFFF;
  --mega-accent: #FF5555;
  --mega-line: rgba(255, 120, 120, 0.28);
  --mega-hub: #FF5555;
}
.nav-mega-panel[data-uni="horticole"] {
  --mega-bg: #1C1A17;
  --mega-text: #F4EFE4;
  --mega-accent: #E07A1F;
  --mega-line: rgba(244, 239, 228, 0.12);
  --mega-hub: #E07A1F;
}
.nav-mega:hover > .nav-mega-panel,
.nav-mega:focus-within > .nav-mega-panel,
.nav-mega.is-open > .nav-mega-panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
/* Pont mince sous le header seulement — ne doit PAS couvrir les autres liens du menu */
.nav-mega-bridge {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  top: var(--header-h);
  height: 14px;
  z-index: 185;
}
.nav-mega:hover > .nav-mega-bridge,
.nav-mega:focus-within > .nav-mega-bridge,
.nav-mega.is-open > .nav-mega-bridge {
  display: block;
}
.main-nav {
  position: relative;
  z-index: 196;
}
.nav-mega > a {
  position: relative;
  z-index: 197;
}
.nav-mega-head {
  max-width: var(--max, 1280px);
  margin: 0 auto 1rem;
  display: flex;
  justify-content: flex-end;
}
.nav-mega-hub {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mega-hub, var(--accent, #2F9E3A));
  text-decoration: none;
  opacity: 1 !important;
}
.nav-mega-hub:hover {
  opacity: 0.7 !important;
}
.nav-mega-grid {
  --mega-cols: 3;
  max-width: var(--max, 1280px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(var(--mega-cols), minmax(0, 1fr));
  gap: 0.85rem;
}
.nav-mega-tile {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  text-decoration: none;
  color: #fff !important;
  opacity: 1 !important;
  background: #1a1a1a;
}
.nav-mega-tile-photo {
  position: absolute;
  inset: 0;
  background-image: var(--mega-img);
  background-size: cover;
  background-position: center;
  transform: scale(1.04);
  transition: transform 0.7s var(--ease);
}
.nav-mega-tile:hover .nav-mega-tile-photo {
  transform: scale(1.1);
}
.nav-mega-tile-veil {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 35%, rgba(0, 0, 0, 0.72) 100%);
  z-index: 1;
}
.nav-mega-tile-text {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  padding: 0.9rem 1rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.nav-mega-tile-name {
  font-family: var(--font-display, 'Fraunces', Georgia, serif);
  font-size: clamp(1.05rem, 1.5vw, 1.35rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.nav-mega-tile-count {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.8;
}

@media (max-width: 1100px) {
  .nav-mega-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 900px) {
  /* Sur tablette/mobile le drawer reste la nav principale */
  .nav-mega-panel {
    display: none !important;
  }
}

/* legacy fallback if .nav-uni not used */
.dd-title { font-weight: 700; font-size: .9rem; }
.dd-sub { font-size: .72rem; color: var(--text-soft); letter-spacing: .02em; }

.header-actions { display: flex; align-items: center; gap: 16px; z-index: 2; }
.theme-toggle {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--line); color: var(--text);
  display: grid; place-items: center; position: relative;
  transition: background .2s, transform .3s;
}
.theme-toggle:hover { transform: rotate(25deg); }
.theme-toggle::before { content:'☾'; font-size: 1rem; }
html.dark .theme-toggle::before { content:'☀'; }

.btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .82rem; font-weight: 600; letter-spacing: .03em;
  padding: 12px 22px; border-radius: 2px;
  transition: transform .25s var(--ease), background .25s, color .25s, box-shadow .25s;
}
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 30px color-mix(in srgb, var(--accent) 40%, transparent); }
.btn-ghost { border: 1px solid var(--text); color: var(--text); }
.btn-ghost:hover { background: var(--text); color: var(--bg); }
.btn-lg { padding: 17px 34px; font-size: .92rem; }

.tel-link { font-weight: 700; font-size: .9rem; color: var(--text); display:inline-flex; align-items:center; gap:7px; white-space: nowrap; flex-shrink: 0; }
.tel-link svg { width: 16px; height: 16px; color: var(--accent); flex-shrink: 0; }

.menu-toggle { display: none; width: 42px; height: 42px; color: var(--text); place-items: center; }

/* ============================================================
   MOBILE DRAWER — universe tiles
   ============================================================ */
.mobile-drawer {
  position: fixed; inset: 0; z-index: 300;
  background:
    radial-gradient(ellipse 70% 50% at 20% 10%, rgba(184,150,91,.16), transparent 60%),
    radial-gradient(ellipse 60% 50% at 90% 90%, rgba(58,107,46,.14), transparent 60%),
    linear-gradient(165deg, #FAF7F0 0%, #F4EFE0 55%, #ECE6D2 100%);
  color: #1A2A1A;
  padding: 84px var(--gutter) 40px;
  transform: translateX(100%); transition: transform .4s var(--ease-out-hard);
  display: flex; flex-direction: column; gap: 10px; overflow-y: auto;
}
.mobile-drawer.open { transform: translateX(0); }
.mobile-drawer .md-close {
  position: absolute; top: 18px; right: var(--gutter);
  font-size: 2rem; line-height: 1; color: #1A2A1A;
  width: 42px; height: 42px; display: grid; place-items: center;
  border-radius: 50%; border: 1px solid rgba(26,42,26,.18);
  background: rgba(255,255,255,.5);
}
.md-eyebrow {
  font-family: 'JetBrains Mono', monospace;
  font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
  color: #6a6660; margin-bottom: 6px; padding-top: 4px;
}
.md-tiles { display: flex; flex-direction: column; gap: 10px; }

.md-tile {
  position: relative; display: grid;
  grid-template-areas:
    "icon  tag    arrow"
    "icon  name   name"
    "icon  sub    sub";
  grid-template-columns: 56px 1fr auto;
  grid-template-rows: auto auto auto;
  column-gap: 18px; row-gap: 4px;
  padding: 22px 22px 24px !important;
  min-height: 140px;
  border-radius: 14px;
  background: var(--u-bg);
  color: #FFFFFF;
  border: 1px solid rgba(255,255,255,.18);
  overflow: hidden; isolation: isolate;
  transition: transform .35s var(--ease-out-hard), border-color .25s, box-shadow .35s;
  font-size: 1rem !important; font-weight: 400 !important;
  letter-spacing: 0 !important;
  box-shadow: 0 14px 32px rgba(20,28,18,.20);
}
/* Signature pattern layer (full-tile, behind content) */
.md-tile-pattern {
  position: absolute; inset: 0; z-index: 0;
  pointer-events: none;
  background-image: var(--u-pattern, none);
  background-size: var(--u-pattern-size, auto);
  background-position: var(--u-pattern-pos, 0 0);
  opacity: var(--u-pattern-opacity, .55);
  mix-blend-mode: var(--u-pattern-blend, normal);
}
/* Cinematic universe photo — PLEINE TUILE, intacte comme une image magazine */
.md-tile-photo {
  position: absolute; inset: 0; z-index: 0;
  pointer-events: none;
  background-size: cover;
  background-position: var(--u-photo-pos, center);
  opacity: 1;
  transition: transform .9s var(--ease);
}
/* Scrim pour la lisibilité du texte sans masquer la photo */
.md-tile-photo::after {
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.15) 45%, rgba(0,0,0,.7) 100%),
    linear-gradient(95deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.18) 38%, transparent 70%);
}
.md-tile:active .md-tile-photo { transform: scale(1.04); }
.md-tile::before {
  content: ''; position: absolute; inset: 0; z-index: 0;
  background: radial-gradient(circle at top right, color-mix(in srgb, var(--u-accent) 22%, transparent) 0%, transparent 55%);
  pointer-events: none;
}
.md-tile > .md-tile-icon,
.md-tile > .md-tile-tag,
.md-tile > .md-tile-name,
.md-tile > .md-tile-sub,
.md-tile > .md-tile-arrow { position: relative; z-index: 1; }

/* Signature icon in left rail */
.md-tile-icon {
  grid-area: icon;
  width: 52px; height: 52px;
  display: grid; place-items: center;
  border-radius: 12px;
  background: rgba(255,255,255,.16);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.32);
  color: #FFFFFF;
  align-self: start;
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--u-accent) 30%, transparent);
  transition: transform .35s var(--ease), box-shadow .4s var(--ease);
}
.md-tile-icon svg { width: 26px; height: 26px; }
.md-tile:active .md-tile-icon { transform: scale(.96); }
.md-tile:hover .md-tile-icon { box-shadow: 0 0 0 6px color-mix(in srgb, var(--u-accent) 14%, transparent); }

.md-tile[data-uni="bolduc"]    { --u-bg:#2A2A2A; --u-text:#FFFFFF; --u-accent:#E63027; }
.md-tile[data-uni="kress"]     { --u-bg:#1A0808; --u-text:#FFFFFF; --u-accent:#DC2626; }
.md-tile[data-uni="inlite"]    { --u-bg:#0B1220; --u-text:#F5F2EC; --u-accent:#D4A574; }
.md-tile[data-uni="gazon"]     { --u-bg:#16240F; --u-text:#FFFFFF; --u-accent:#7AB857; }
.md-tile[data-uni="vegetaux"] { --u-bg:#1B2818; --u-text:#FFFFFF; --u-accent:#7AB857; }
.md-tile[data-uni="horticole"] { --u-bg:#1C1A17; --u-text:#F4EFE4; --u-accent:#E07A1F; }
.md-tile[data-uni="vrac"]      { --u-bg:#2A1F15; --u-text:#F3EBE0; --u-accent:#A8754D; }
.md-tile[data-uni="outils"]    { --u-bg:#1A1A1A; --u-text:#FFFFFF; --u-accent:#FFA500; }
  grid-area: tag;
  display: inline-block; width: max-content;
  font-family: 'JetBrains Mono', monospace;
  font-size: .68rem; font-weight: 500; letter-spacing: .12em;
  padding: 4px 10px; border-radius: 3px;
  background: var(--u-accent); color: #fff;
  margin-bottom: 10px;
}
.md-tile[data-uni="gazon"] .md-tile-tag { color: #fff; }
.md-tile-name {
  grid-area: name;
  font-size: 1.55rem !important; font-weight: 800 !important;
  letter-spacing: -.015em !important;
  line-height: 1.05;
  border-bottom: none !important;
  padding: 0 !important;
  color: #FFFFFF;
  text-shadow: 0 2px 14px rgba(0,0,0,.55);
}
.md-tile-sub {
  grid-area: sub;
  font-size: .82rem; font-weight: 400;
  color: rgba(255,255,255,.88);
  margin-top: 6px;
  border-bottom: none !important;
  padding: 0 !important;
  text-shadow: 0 1px 8px rgba(0,0,0,.55);
}
.md-tile-arrow {
  grid-area: arrow;
  width: 24px; height: 24px;
  color: var(--u-accent);
  align-self: start;
  transition: transform .3s var(--ease);
}
.md-tile:active { transform: scale(.985); }
.md-tile:hover .md-tile-arrow,
.md-tile:focus .md-tile-arrow { transform: translateX(4px); }

.md-link-plain {
  display: block;
  margin-top: 22px;
  font-size: 1.05rem; font-weight: 600;
  padding: 14px 0;
  color: #1A2A1A;
  border-bottom: 1px solid rgba(26,42,26,.14);
  letter-spacing: -.005em;
}
.mobile-drawer .md-tel {
  margin-top: 16px;
  font-size: 1.1rem; font-weight: 700;
  color: #1A2A1A;
  padding: 14px 0;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: .05em;
}

/* ============================================================
   FOOTER — universe-tinted
   ============================================================ */
.site-footer {
  background: color-mix(in srgb, var(--bg) 80%, #000 20%);
  color: var(--text); border-top: 1px solid var(--line);
  padding: 90px 0 40px; position: relative; z-index: 2;
}
[data-universe] .site-footer, body.home-dark .site-footer { background: #060606; color: #e8e8e8; border-top-color: rgba(255,255,255,.1); }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 48px; }
.footer-brand .brand-name { font-size: 1.4rem; }
.footer-about { color: var(--text-soft); font-size: .9rem; margin-top: 18px; max-width: 320px; line-height: 1.7; }
.footer-col h4 { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--text-soft); margin-bottom: 18px; }
.footer-col ul { display: flex; flex-direction: column; gap: 11px; }
.footer-col a { font-size: .9rem; color: var(--text-soft); transition: color .2s; }
.footer-col a:hover { color: var(--accent); }
.footer-contact p { font-size: .9rem; color: var(--text-soft); margin-bottom: 10px; line-height: 1.6; }
.footer-contact a { color: var(--text); font-weight: 600; }
.footer-bottom {
  margin-top: 64px; padding-top: 28px; border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px;
  font-size: .76rem; color: var(--text-soft);
}

/* ============================================================
   SHARED LAYOUT PRIMITIVES
   ============================================================ */
.section { padding: clamp(70px, 11vw, 160px) 0; position: relative; }
.eyebrow {
  font-size: .72rem; font-weight: 700; letter-spacing: .26em; text-transform: uppercase;
  color: var(--accent); display: inline-flex; align-items: center; gap: 12px; margin-bottom: 22px;
}
.eyebrow::before { content:''; width: 34px; height: 1px; background: var(--accent); }

.lead { font-size: clamp(1.05rem, 1.6vw, 1.3rem); color: var(--text-soft); line-height: 1.7; max-width: 56ch; font-weight: 300; }

/* type scale helpers */
.t-hero { font-size: clamp(3.2rem, 11vw, 12rem); font-weight: 900; line-height: .9; letter-spacing: -.04em; }
.t-xxl  { font-size: clamp(2.6rem, 8vw, 7rem); font-weight: 900; line-height: .94; letter-spacing: -.035em; }
.t-xl   { font-size: clamp(2rem, 5vw, 4rem); font-weight: 800; line-height: 1; letter-spacing: -.025em; }
.t-lg   { font-size: clamp(1.6rem, 3.4vw, 2.6rem); font-weight: 700; line-height: 1.08; letter-spacing: -.02em; }

/* reveal base */
.reveal { opacity: 0; transform: translateY(36px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in { opacity: 1; transform: none; }
.reveal-d1 { transition-delay: .08s; } .reveal-d2 { transition-delay: .16s; }
.reveal-d3 { transition-delay: .24s; } .reveal-d4 { transition-delay: .32s; }

/* split-text lines (set by JS) */
.split-line { display: block; overflow: hidden; }
.split-line > span { display: block; transform: translateY(110%); transition: transform .9s var(--ease-out-hard); }
.split-line.in > span { transform: translateY(0); }
.split-word { display: inline-block; overflow: hidden; vertical-align: top; }
.split-word > span { display: inline-block; transform: translateY(110%); transition: transform .8s var(--ease-out-hard); }
.split-word.in > span { transform: translateY(0); }

/* custom cursor */
.cursor-dot {
  position: fixed; top: 0; left: 0; width: 16px; height: 16px; border-radius: 50%;
  background: var(--cursor, #fff); pointer-events: none; z-index: 9000;
  transform: translate(-50%, -50%); mix-blend-mode: difference;
  transition: width .3s var(--ease), height .3s var(--ease), background .3s, opacity .3s;
  will-change: transform;
}
.cursor-ring {
  position: fixed; top: 0; left: 0; width: 46px; height: 46px; border-radius: 50%;
  border: 1.5px solid var(--cursor, #fff); pointer-events: none; z-index: 8999;
  transform: translate(-50%, -50%); opacity: .5;
  transition: width .35s var(--ease), height .35s var(--ease), opacity .3s, border-color .3s;
  will-change: transform;
}
body.cursor-hover .cursor-dot { width: 0; height: 0; }
body.cursor-hover .cursor-ring { width: 76px; height: 76px; opacity: 1; background: color-mix(in srgb, var(--cursor) 14%, transparent); }
@media (hover: none), (max-width: 900px) { .cursor-dot, .cursor-ring { display: none !important; } }

/* page transition overlay */
.page-wipe {
  position: fixed; inset: 0; z-index: 9500; background: #0A0A0A;
  transform: translateY(100%); pointer-events: none;
}
.page-wipe.enter { animation: wipeUp .6s var(--ease-out-hard) forwards; }
.page-wipe.exit  { transform: translateY(0); animation: wipeDown .7s var(--ease-out-hard) forwards; }
@keyframes wipeUp   { from { transform: translateY(0); } to { transform: translateY(-100%); } }
@keyframes wipeDown { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* marquee */
.marquee { overflow: hidden; white-space: nowrap; border-block: 1px solid var(--line); padding: 22px 0; }
.marquee-track { display: inline-flex; gap: 60px; animation: marquee 28s linear infinite; will-change: transform; }
.marquee.rev .marquee-track { animation-direction: reverse; }
.marquee-track span { font-size: clamp(1.4rem, 3vw, 2.6rem); font-weight: 900; letter-spacing: -.02em; text-transform: uppercase; color: var(--text); }
.marquee-track .sep { color: var(--accent); }
@keyframes marquee { to { transform: translateX(-50%); } }

/* — Marquee variantes pour la page d'accueil (brand-accent vert lime du logo) — */
:root { --brand-lime: #9DCC3A; --brand-deep: #0E3D2E; }
.marquee-brand { background: var(--brand-deep); border:0; padding: 28px 0; }
.marquee-brand .marquee-track span { color: #fff; font-family:'Fraunces',serif; font-style: italic; font-weight: 400; font-size: clamp(2rem, 5vw, 4.8rem); letter-spacing:-.02em; text-transform:none; }
.marquee-brand .marquee-track .sep { color: var(--brand-lime); margin: 0 8px; font-style: normal; }

.marquee-lime { background: var(--brand-lime); border:0; padding: 20px 0; }
.marquee-lime .marquee-track span { color: var(--brand-deep); font-family:'JetBrains Mono', monospace; font-size: clamp(.95rem, 1.3vw, 1.1rem); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.marquee-lime .marquee-track .sep { color: var(--brand-deep); opacity:.45; }

.marquee-cream { background: linear-gradient(180deg, #FAF7F0 0%, #F0EDE4 100%); border-top: 1px solid rgba(14,61,46,.1); border-bottom: 1px solid rgba(14,61,46,.1); padding: 30px 0; }
.marquee-cream .marquee-track span { color: var(--brand-deep); font-weight: 900; font-size: clamp(1.4rem, 3vw, 2.6rem); letter-spacing: -.02em; text-transform: uppercase; }
.marquee-cream .marquee-track span em { font-family:'Fraunces',serif; font-style: italic; color: var(--brand-lime); font-weight: 400; }
.marquee-cream .marquee-track .sep { color: var(--brand-lime); }

/* Reverse direction shortcut applied directly on .marquee-track */
.marquee-track.marquee-track-rev { animation-direction: reverse; }

/* Editorial gradient decorative blobs */
.editorial-blob { position:absolute; border-radius:50%; filter: blur(80px); opacity:.55; pointer-events:none; z-index:0; }
.editorial-blob-a { width: 520px; height: 520px; background: radial-gradient(circle, rgba(157,204,58,.45), transparent 70%); top: -180px; right: -120px; }
.editorial-blob-b { width: 440px; height: 440px; background: radial-gradient(circle, rgba(14,61,46,.22), transparent 70%); bottom: -160px; left: -100px; }
@media (max-width: 720px) { .editorial-blob { filter: blur(60px); opacity:.4; } .editorial-blob-a { width:320px; height:320px; } .editorial-blob-b { width:280px; height:280px; } }

@media (prefers-reduced-motion: reduce) { .marquee-track { animation: none !important; } }

/* type-as-image giant number */
.bignum {
  position: absolute; pointer-events: none; user-select: none; line-height: .8;
  font-weight: 900; letter-spacing: -.06em; z-index: 0;
  font-variant-numeric: tabular-nums;
}

/* breadcrumb */
.breadcrumb { padding-top: calc(var(--header-h) + 24px); }
.breadcrumb ol { display: flex; gap: 8px; font-size: .76rem; color: var(--text-soft); letter-spacing: .04em; }
.breadcrumb a:hover { color: var(--accent); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
}
@media (max-width: 900px) {
  .main-nav, .header-actions .btn, .header-actions .tel-link, .theme-toggle { display: none; }
  .menu-toggle { display: grid; }
  :root { --header-h: 64px; }
}
@media (max-width: 640px) {
  .footer-grid { grid-template-columns: 1fr; gap: 36px; }
  .footer-bottom { flex-direction: column; }
}

/* ============================================================
   IN-LITE LIGHTS ON/OFF TOGGLE
   ============================================================ */

/* Floating toggle button — style interrupteur cuivré */
.lights-toggle {
  position: fixed;
  top: calc(var(--header-h) + 18px);
  right: 22px;
  z-index: 90;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 8px 14px 8px 8px;
  background: rgba(11, 18, 32, .72);
  border: 1px solid rgba(212, 165, 116, .35);
  border-radius: 999px;
  cursor: pointer;
  color: #F5F2EC;
  font-family: 'Inter', sans-serif;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  transition: background .5s ease, border-color .5s ease, color .5s ease, box-shadow .5s ease;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .35), 0 0 0 1px rgba(212, 165, 116, .06);
}
.lights-toggle:hover { border-color: rgba(212, 165, 116, .65); }

.lt-track {
  position: relative;
  width: 46px;
  height: 26px;
  border-radius: 999px;
  background: linear-gradient(180deg, #050912 0%, #0E1828 100%);
  border: 1px solid rgba(212, 165, 116, .28);
  flex-shrink: 0;
  transition: background .5s ease, border-color .5s ease, box-shadow .5s ease;
  overflow: hidden;
}
.lt-thumb {
  position: absolute;
  top: 50%;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: linear-gradient(180deg, #E8C28D 0%, #B8884F 100%);
  transform: translate(0, -50%);
  transition: transform .42s cubic-bezier(.7, .2, .25, 1), background .5s ease, box-shadow .5s ease;
  box-shadow: 0 0 14px rgba(212, 165, 116, .85), 0 2px 6px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .35);
  display: grid;
  place-items: center;
  color: #0B1220;
}
.lt-icon { width: 12px; height: 12px; position: absolute; transition: opacity .3s ease; }
.lt-icon-on { opacity: 1; }
.lt-icon-off { opacity: 0; }
.lt-labels { display: inline-block; line-height: 18px; position: relative; height: 18px; width: 78px; overflow: hidden; vertical-align: middle; }
.lt-label { transition: transform .42s cubic-bezier(.7, .2, .25, 1), opacity .3s ease; display: block; position: absolute; top: 0; left: 0; white-space: nowrap; line-height: 18px; }
.lt-label-on { transform: translateY(0); opacity: 1; }
.lt-label-off { transform: translateY(18px); opacity: 0; }

/* OFF state */
.lights-toggle.is-off {
  background: rgba(232, 238, 245, .85);
  border-color: rgba(22, 33, 58, .25);
  color: #16213A;
  box-shadow: 0 8px 28px rgba(22, 33, 58, .15);
}
.lights-toggle.is-off .lt-track {
  background: linear-gradient(180deg, #D8DFE8 0%, #B5C0CE 100%);
  border-color: rgba(22, 33, 58, .22);
  box-shadow: inset 0 1px 3px rgba(22, 33, 58, .15);
}
.lights-toggle.is-off .lt-thumb {
  transform: translate(20px, -50%);
  background: linear-gradient(180deg, #FAFBFC 0%, #C9D3DE 100%);
  box-shadow: 0 0 0 rgba(212, 165, 116, 0), 0 2px 6px rgba(22, 33, 58, .25), inset 0 1px 0 rgba(255, 255, 255, .9);
  color: #6B7A8F;
}
.lights-toggle.is-off .lt-icon-on { opacity: 0; }
.lights-toggle.is-off .lt-icon-off { opacity: 1; }
.lights-toggle.is-off .lt-label-on { transform: translateY(-18px); opacity: 0; }
.lights-toggle.is-off .lt-label-off { transform: translateY(0); opacity: 1; }

/* Pulse glow on the thumb when lights are on */
.lights-toggle.is-on .lt-thumb { animation: ltPulse 2.4s ease-in-out infinite; }
@keyframes ltPulse {
  0%, 100% { box-shadow: 0 0 12px rgba(212, 165, 116, .7), 0 2px 6px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .35); }
  50% { box-shadow: 0 0 22px rgba(212, 165, 116, 1), 0 0 38px rgba(212, 165, 116, .35), 0 2px 6px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .35); }
}

/* ============================================================
   IN-LITE — DAY MODE (lights off)
   ============================================================ */
body[data-universe="inlite"] {
  transition: background-color .7s ease, color .7s ease;
}
body[data-universe="inlite"] .cine-hero,
body[data-universe="inlite"] .nocturnal,
body[data-universe="inlite"] .section,
body[data-universe="inlite"] .editorial-img img,
body[data-universe="inlite"] .scrim {
  transition: background .7s ease, color .7s ease, filter .7s ease, opacity .7s ease;
}

body[data-universe="inlite"].lights-off {
  --bg: #E8EEF5;
  --surface: #F4F7FB;
  --text: #16213A;
  --text-soft: #5A6B82;
  --accent: #8a6a44;
  --line: rgba(22, 33, 58, .14);
  --cursor: #8a6a44;
  background: #E8EEF5;
  color: #16213A;
}

/* Lighten the dark scrims when lights off */
body[data-universe="inlite"].lights-off .cine-hero .scrim {
  background: linear-gradient(180deg, rgba(232, 238, 245, .15) 0%, rgba(232, 238, 245, .05) 40%, rgba(232, 238, 245, .55) 100%) !important;
}
body[data-universe="inlite"].lights-off .nocturnal::before,
body[data-universe="inlite"].lights-off .nocturnal .bg::after {
  opacity: .15 !important;
}
/* pages.css paints a dark ::after overlay — it must lighten with the text */
body[data-universe="inlite"].lights-off .nocturnal::after {
  background: linear-gradient(90deg, rgba(232, 238, 245, .88), rgba(232, 238, 245, .35)) !important;
}
body[data-universe="inlite"].lights-off .nocturnal {
  background: transparent;
}
body[data-universe="inlite"].lights-off .nocturnal .container {
  color: #16213A;
}
body[data-universe="inlite"].lights-off .nocturnal .eyebrow {
  color: #8a6a44 !important;
}

/* Header transparent → readable in day mode */
body[data-universe="inlite"].lights-off .site-header.transparent {
  color: #16213A;
}
body[data-universe="inlite"].lights-off .site-header .brand,
body[data-universe="inlite"].lights-off .site-header .main-nav a,
body[data-universe="inlite"].lights-off .site-header .tel-link {
  color: #16213A;
}

/* Big "12V" filigree gets very muted in day */
body[data-universe="inlite"].lights-off .bignum {
  color: rgba(22, 33, 58, .06) !important;
}

/* Hero serif title in day */
body[data-universe="inlite"].lights-off .cine-title,
body[data-universe="inlite"].lights-off .nocturnal h2,
body[data-universe="inlite"].lights-off .nocturnal .lead {
  color: #16213A !important;
}
body[data-universe="inlite"].lights-off .nocturnal h2 { text-shadow: none; }
body[data-universe="inlite"].lights-off .cine-sub,
body[data-universe="inlite"].lights-off .cine-hero .cine-sub,
body[data-universe="inlite"].lights-off .cine-hero p {
  color: #1f2d4a;
  text-shadow: 0 1px 2px rgba(255, 255, 255, .35);
}
body[data-universe="inlite"].lights-off .cine-hero .eyebrow { color: #3a4d6c; }
body[data-universe="inlite"].lights-off .cine-hero .cine-meta b { color: #8a6a44; }
body[data-universe="inlite"].lights-off .cine-hero .cine-meta span { color: #3a4d6c; }

/* Series cards in day mode */
body[data-universe="inlite"].lights-off .series-card {
  background: #FFFFFF;
  border-color: rgba(22, 33, 58, .12);
  color: #16213A;
  box-shadow: 0 8px 28px rgba(22, 33, 58, .06);
}
body[data-universe="inlite"].lights-off .series-card:hover {
  box-shadow: 0 18px 40px rgba(22, 33, 58, .12);
}
body[data-universe="inlite"].lights-off .series-card .sc-name { color: #8a6a44; }
body[data-universe="inlite"].lights-off .series-card .sc-cat,
body[data-universe="inlite"].lights-off .series-card .sc-desc { color: #5A6B82; }

/* CTA band in day */
body[data-universe="inlite"].lights-off .cta-band {
  background: #FFFFFF;
  border-color: rgba(22, 33, 58, .12);
  color: #16213A;
}
body[data-universe="inlite"].lights-off .cta-band .btn-primary {
  background: #8a6a44;
  border-color: #8a6a44;
}
body[data-universe="inlite"].lights-off .cta-band .btn-ghost {
  border-color: rgba(22, 33, 58, .35);
  color: #16213A;
}

/* Marquee italics in day */
body[data-universe="inlite"].lights-off .marquee-track span { color: #16213A; }
body[data-universe="inlite"].lights-off .marquee-track .sep { color: #8a6a44; }
body[data-universe="inlite"].lights-off .marquee { border-color: rgba(22, 33, 58, .12); }

/* Day mode: swap to light logo (the dark logo blends into bright skies) */
body[data-universe="inlite"].lights-off .brand-logo-light { display: block !important; }
body[data-universe="inlite"].lights-off .brand-logo-dark { display: none !important; }

/* Day mode: ensure ALL editorial / section text is readable on light backgrounds */
body[data-universe="inlite"].lights-off .editorial h2,
body[data-universe="inlite"].lights-off .editorial .lead,
body[data-universe="inlite"].lights-off .editorial p,
body[data-universe="inlite"].lights-off .section h2,
body[data-universe="inlite"].lights-off .section h3,
body[data-universe="inlite"].lights-off .section p,
body[data-universe="inlite"].lights-off .section .lead,
body[data-universe="inlite"].lights-off .cine-meta b,
body[data-universe="inlite"].lights-off .cine-meta span {
  color: #16213A;
}
body[data-universe="inlite"].lights-off .eyebrow {
  color: #8a6a44;
}
body[data-universe="inlite"].lights-off .eyebrow::before {
  background: #8a6a44;
}
body[data-universe="inlite"].lights-off .cine-meta b { color: #8a6a44; }

/* Day mode hero In-Lite: stronger white scrim + dark text + halo for legibility over sky photo */
body[data-universe="inlite"].lights-off .cine-hero .scrim {
  background: linear-gradient(180deg, rgba(255,255,255,.45) 0%, rgba(255,255,255,.25) 35%, rgba(255,255,255,.55) 100%) !important;
}
body[data-universe="inlite"].lights-off .cine-hero .cine-title,
body[data-universe="inlite"].lights-off .cine-hero .cine-title .split-line span {
  color: #0f1a30 !important;
  text-shadow: 0 2px 20px rgba(255,255,255,.85), 0 1px 3px rgba(255,255,255,.9), 0 0 1px rgba(255,255,255,1);
}
body[data-universe="inlite"].lights-off .cine-hero .cine-sub {
  color: #142039 !important;
  font-weight: 500 !important;
  text-shadow: 0 1px 8px rgba(255,255,255,.95), 0 0 1px rgba(255,255,255,1);
}
body[data-universe="inlite"].lights-off .cine-hero .eyebrow {
  color: #4a2e10 !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 6px rgba(255,255,255,.95), 0 0 1px rgba(255,255,255,1);
}
body[data-universe="inlite"].lights-off .cine-hero .eyebrow::before {
  background: #4a2e10 !important;
}
body[data-universe="inlite"].lights-off .cine-hero .cine-meta b {
  color: #5a3a14 !important;
  text-shadow: 0 1px 6px rgba(255,255,255,.95);
}
body[data-universe="inlite"].lights-off .cine-hero .cine-meta span {
  color: #1a2540 !important;
  text-shadow: 0 1px 5px rgba(255,255,255,.9);
}

/* Scene section stays night-themed — restore light text the blanket day rules overrode */
body[data-universe="inlite"].lights-off .inlite-scene {
  background: #0B1220;
  color: #F5F2EC;
}
body[data-universe="inlite"].lights-off .inlite-scene .eyebrow {
  color: rgba(255, 180, 90, .85) !important;
}
body[data-universe="inlite"].lights-off .inlite-scene .eyebrow::before {
  background: rgba(255, 180, 90, .85) !important;
}
body[data-universe="inlite"].lights-off .inlite-scene h2,
body[data-universe="inlite"].lights-off .inlite-scene h2 span,
body[data-universe="inlite"].lights-off .inlite-scene .lead,
body[data-universe="inlite"].lights-off .inlite-scene p {
  color: #F5F2EC !important;
  text-shadow: none;
}
body[data-universe="inlite"].lights-off .inlite-scene h2 span {
  color: #FFB45A !important;
}
body[data-universe="inlite"].lights-off .inlite-scene .scene-status {
  color: rgba(245, 242, 236, .85);
}
body[data-universe="inlite"].lights-off .inlite-scene .scene-status b {
  color: #FFB45A;
}
body[data-universe="inlite"].lights-off .inlite-scene .scene-chips .chip {
  color: rgba(245, 242, 236, .55);
  border-color: rgba(245, 242, 236, .18);
  background: transparent;
}
body[data-universe="inlite"].lights-off .inlite-scene .scene-chips .chip:hover {
  color: #F5F2EC;
}
body[data-universe="inlite"].lights-off .inlite-scene .scene-chips .chip.is-active {
  background: #FFB45A;
  color: #0B1220;
  border-color: #FFB45A;
}

/* Catalogue hub keeps its dark panel — don't inherit day body text vars alone */
body[data-universe="inlite"].lights-off .pi-catalog {
  background: #0A0F1A;
  color: #F4E8D8;
}
body[data-universe="inlite"].lights-off .pi-catalog-lede {
  color: rgba(244, 232, 216, .75);
}

/* Mobile toggle adjust */
@media (max-width: 640px) {
  .lights-toggle { padding: 6px 10px 6px 6px; font-size: .66rem; gap: 8px; }
  .lt-track { width: 38px; height: 22px; }
  .lt-thumb { width: 16px; height: 16px; }
  .lights-toggle.is-off .lt-thumb { transform: translate(16px, -50%); }
  .lt-labels { display: none; }
}

/* Soft image swap transition */
img.img-swap { opacity: .35; filter: blur(2px); transition: opacity .22s ease, filter .22s ease; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .lights-toggle.is-on .lt-thumb { animation: none; }
  body[data-universe="inlite"],
  body[data-universe="inlite"] * { transition-duration: .01ms !important; }
}

/* ============================================================
   UNIVERSE SIGNATURE PATTERNS — nav-uni + md-tile
   Each universe gets a unique inline-SVG background that
   evokes its world. Bolduc=brick grid, Kress=diagonal speed
   stripes, In-Lite=glowing dot constellation, Gazon=grass
   blades, Vrac=stone grain, Outils=technical cross hatch.
   ============================================================ */

/* ---- BOLDUC: brick grid pattern (architectural pavers) ---- */
.nav-uni[data-uni="bolduc"],
.md-tile[data-uni="bolduc"] {
  --u-pattern: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40'><g fill='none' stroke='%23E63027' stroke-width='1' opacity='0.55'><rect x='0.5' y='0.5' width='39' height='19'/><rect x='40.5' y='0.5' width='39' height='19'/><rect x='-19.5' y='20.5' width='39' height='19'/><rect x='20.5' y='20.5' width='39' height='19'/><rect x='60.5' y='20.5' width='39' height='19'/></g></svg>");
  --u-pattern-size: 80px 40px;
  --u-pattern-opacity: 0.85;
}
.md-tile[data-uni="bolduc"] .md-tile-pattern { mask-image: linear-gradient(135deg, #000 0%, #000 35%, transparent 80%); -webkit-mask-image: linear-gradient(135deg, #000 0%, #000 35%, transparent 80%); }

/* ---- KRESS: diagonal speed scanlines + dot ---- */
.nav-uni[data-uni="kress"],
.md-tile[data-uni="kress"] {
  --u-pattern: repeating-linear-gradient(115deg, transparent 0 10px, rgba(220,38,38,0.18) 10px 11px, transparent 11px 22px), radial-gradient(circle at 88% 50%, rgba(220,38,38,0.32) 0%, transparent 35%);
  --u-pattern-size: auto, auto;
  --u-pattern-opacity: 1;
}

/* ---- IN-LITE: night sky with brass glints ---- */
.nav-uni[data-uni="inlite"],
.md-tile[data-uni="inlite"] {
  --u-pattern:
    radial-gradient(circle at 18% 28%, rgba(212,165,116,0.95) 0 1.3px, transparent 1.6px),
    radial-gradient(circle at 64% 22%, rgba(212,165,116,0.8) 0 1.1px, transparent 1.4px),
    radial-gradient(circle at 82% 64%, rgba(212,165,116,1) 0 1.6px, transparent 2px),
    radial-gradient(circle at 38% 78%, rgba(212,165,116,0.7) 0 1.2px, transparent 1.5px),
    radial-gradient(circle at 92% 88%, rgba(212,165,116,0.55) 0 1.3px, transparent 1.6px),
    radial-gradient(circle at 8% 70%, rgba(212,165,116,0.7) 0 1.2px, transparent 1.5px),
    radial-gradient(ellipse at 85% 60%, rgba(212,165,116,0.18) 0%, transparent 45%);
  --u-pattern-size: auto;
  --u-pattern-opacity: 1;
}

/* ---- GAZON: vertical blades of grass texture (on light bg) ---- */
.nav-uni[data-uni="gazon"],
.md-tile[data-uni="gazon"] {
  --u-pattern: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='30' viewBox='0 0 60 30'><g fill='none' stroke='%233A6B2E' stroke-width='1.1' stroke-linecap='round' opacity='0.7'><path d='M4 30 Q4 22 6 14'/><path d='M11 30 Q11 23 13 12'/><path d='M19 30 Q19 24 21 16'/><path d='M27 30 Q27 22 29 11'/><path d='M35 30 Q35 25 37 18'/><path d='M43 30 Q43 22 45 14'/><path d='M51 30 Q51 24 53 12'/><path d='M58 30 Q58 25 56 19'/></g></svg>");
  --u-pattern-size: 60px 30px;
  --u-pattern-opacity: 0.75;
}

/* ---- VRAC: stone grain (organic dots scattered) ---- */
.nav-uni[data-uni="vrac"],
.md-tile[data-uni="vrac"] {
  --u-pattern: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='90' viewBox='0 0 90 90'><g fill='%23A8754D' opacity='0.55'><circle cx='12' cy='14' r='1.6'/><circle cx='30' cy='8' r='1.1'/><circle cx='52' cy='18' r='2.2'/><circle cx='72' cy='12' r='1.4'/><circle cx='84' cy='30' r='1.8'/><circle cx='20' cy='34' r='1.3'/><circle cx='44' cy='42' r='2.6'/><circle cx='66' cy='38' r='1.5'/><circle cx='10' cy='58' r='2.1'/><circle cx='32' cy='62' r='1.5'/><circle cx='56' cy='68' r='2.0'/><circle cx='78' cy='60' r='1.4'/><circle cx='22' cy='82' r='1.7'/><circle cx='48' cy='84' r='1.3'/><circle cx='74' cy='80' r='2.0'/></g></svg>");
  --u-pattern-size: 90px 90px;
  --u-pattern-opacity: 1;
}

/* ---- OUTILS: technical cross hatch (workshop blueprint) ---- */
.nav-uni[data-uni="outils"],
.md-tile[data-uni="outils"] {
  --u-pattern: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'><g fill='none' stroke='%23FFA500' stroke-width='1' opacity='0.45'><path d='M20 12v16M12 20h16'/><circle cx='20' cy='20' r='1.3' fill='%23FFA500'/></g><g fill='none' stroke='%23FFA500' stroke-width='0.5' opacity='0.18'><path d='M0 0h40v40H0z'/></g></svg>");
  --u-pattern-size: 40px 40px;
  --u-pattern-opacity: 0.85;
}

/* ---- BIOLIFT: tension cables — diagonal stretched lines (exo harness) ---- */
.nav-uni[data-uni="biolift"],
.md-tile[data-uni="biolift"] {
  --u-pattern:
    repeating-linear-gradient(58deg, transparent 0 14px, rgba(232,95,44,0.28) 14px 15.5px, transparent 15.5px 30px),
    radial-gradient(circle at 88% 50%, rgba(232,95,44,0.30) 0%, transparent 38%);
  --u-pattern-size: auto, auto;
  --u-pattern-opacity: 1;
}

/* Mobile drawer tile: pattern enabled by default */
.md-tile[data-uni="bolduc"] .md-tile-pattern { background-position: 100% 0; opacity: 0.7; }
.md-tile[data-uni="kress"] .md-tile-pattern  { opacity: 0.9; }
.md-tile[data-uni="inlite"] .md-tile-pattern { opacity: 1; }
.md-tile[data-uni="gazon"] .md-tile-pattern  { background-repeat: repeat-x; background-position: 0 100%; background-size: 60px 36px; opacity: 0.55; }
.md-tile[data-uni="vrac"] .md-tile-pattern   { background-position: 100% 50%; background-size: 80px 80px; opacity: 0.7; mask-image: linear-gradient(90deg, transparent 0%, #000 55%); -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 55%); }
.md-tile[data-uni="outils"] .md-tile-pattern { background-size: 36px 36px; opacity: 0.55; mask-image: linear-gradient(180deg, #000 0%, transparent 80%); -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 80%); }
.md-tile[data-uni="biolift"] .md-tile-pattern { background-size: 80px 80px; opacity: 0.85; mask-image: linear-gradient(135deg, transparent 0%, #000 40%, #000 100%); -webkit-mask-image: linear-gradient(135deg, transparent 0%, #000 40%, #000 100%); }

.md-tile[data-uni="bolduc"] .md-tile-tag,
.md-tile[data-uni="outils"] .md-tile-tag,
.md-tile[data-uni="biolift"] .md-tile-tag { letter-spacing: .18em; }

@keyframes uniPatternShift { from { background-position: 0 0; } to { background-position: 80px 0; } }
.nav-uni[data-uni="kress"]:hover .nav-uni-pattern { animation: uniPatternShift 1.2s linear infinite; }
.nav-uni[data-uni="inlite"]:hover .nav-uni-pattern { animation: inliteTwinkle 2.5s ease-in-out infinite alternate; }
@keyframes inliteTwinkle { from { opacity: 1; filter: brightness(1); } to { opacity: 1; filter: brightness(1.35); } }

@media (prefers-reduced-motion: reduce) {
  .nav-uni:hover .nav-uni-pattern { animation: none !important; }
}

.nav-uni[data-uni="biolift"]:hover .nav-uni-pattern { animation: uniPatternShift 1.6s linear infinite; }
@media (prefers-reduced-motion: reduce) {
  .nav-uni[data-uni="biolift"]:hover .nav-uni-pattern { animation: none !important; }
}

/* ============ In-Lite Scène interactive ============ */
.inlite-scene { padding: clamp(80px, 10vw, 140px) 0; background: #0B1220; color: #F5F2EC; }
.inlite-scene .eyebrow { color: rgba(255,180,90,.85); }
.inlite-scene h2 { color: #F5F2EC; }
.inlite-scene .lead { color: rgba(245,242,236,.75); }

.scene-stage {
  position: relative; width: 100%;
  aspect-ratio: 1672/941;
  border-radius: 18px; overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.5);
  isolation: isolate;
  background:#050912;
}
.scene-stage .scene-bg {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit: cover; display:block;
  z-index: 0;
  user-select:none; -webkit-user-drag:none;
}

/* Couches lumière : flaques souples qui se chevauchent (allumage progressif). */
.scene-light {
  position:absolute; inset:0; pointer-events:none;
  z-index: 1;
  opacity: 1;
  transition:
    opacity .95s cubic-bezier(.22,1,.36,1),
    filter .95s cubic-bezier(.22,1,.36,1);
  overflow: hidden;
  -webkit-mask-image: var(--mask);
          mask-image: var(--mask);
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  mask-mode: alpha;
  -webkit-mask-source-type: alpha;
  will-change: opacity;
  filter: brightness(1.28) saturate(1.18) contrast(1.06);
  mix-blend-mode: normal;
}
.scene-light[data-fx="scope"] { --mask: url("assets/images/inlite-scene/masks/mask-scope.png"); }
.scene-light[data-fx="aim"]   { --mask: url("assets/images/inlite-scene/masks/mask-aim.png"); }
.scene-light[data-fx="evo"]   { --mask: url("assets/images/inlite-scene/masks/mask-evo.png"); }
.scene-light[data-fx="halo"]  { --mask: url("assets/images/inlite-scene/masks/mask-halo.png"); }
.scene-light img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; user-select:none; -webkit-user-drag:none; }
.scene-stage:not(.fx-scope) .scene-light[data-fx="scope"] { opacity: 0; filter: brightness(.92) saturate(.9); }
.scene-stage:not(.fx-aim)   .scene-light[data-fx="aim"]   { opacity: 0; filter: brightness(.92) saturate(.9); }
.scene-stage:not(.fx-evo)   .scene-light[data-fx="evo"]   { opacity: 0; filter: brightness(.92) saturate(.9); }
.scene-stage:not(.fx-halo)  .scene-light[data-fx="halo"]  { opacity: 0; filter: brightness(.92) saturate(.9); }

.scene-stage.is-solo .scene-pin:not([aria-pressed="true"]) .pin-dot { opacity: .35; }

/* Pins */
.scene-pin {
  position:absolute; transform: translate(-50%, -50%);
  width: 34px; height: 34px;
  background: transparent; border: 0; padding: 0;
  cursor: pointer; z-index: 5;
  display:flex; align-items:center; justify-content:center;
  -webkit-tap-highlight-color: transparent;
}
.scene-pin .pin-dot {
  position:relative; display:block;
  width: 14px; height: 14px; border-radius: 50%;
  background: rgba(255,255,255,.55);
  box-shadow: 0 0 0 4px rgba(255,255,255,.1), 0 0 12px rgba(255,180,90,0);
  transition: all .3s ease;
}
.scene-pin .pin-dot::before {
  content:''; position:absolute; inset:-10px; border-radius:50%;
  background: rgba(255,255,255,.1);
  animation: pinPulse 2.6s ease-out infinite;
}
@keyframes pinPulse {
  0%   { transform: scale(.6); opacity:.7; }
  100% { transform: scale(1.8); opacity:0; }
}
.scene-pin[aria-pressed="true"] .pin-dot {
  background: #FFB45A;
  box-shadow: 0 0 0 4px rgba(255,180,90,.25), 0 0 24px rgba(255,180,90,.7), 0 0 60px rgba(255,180,90,.4);
}
.scene-pin[aria-pressed="true"] .pin-dot::before { background: rgba(255,180,90,.18); }
.scene-pin:hover { z-index:6; }
.scene-pin:hover .pin-dot { transform: scale(1.2); }
.scene-pin:focus-visible { outline: none; }
.scene-pin:focus-visible .pin-dot { outline: 2px solid #FFB45A; outline-offset: 4px; }

.scene-pin .pin-label {
  position:absolute; left:50%; bottom: calc(100% + 14px);
  transform: translateX(-50%);
  background: rgba(11,18,32,.92); color:#F5F2EC;
  font: 700 11px/1 'Inter', sans-serif;
  letter-spacing:.1em; text-transform:uppercase;
  padding: 9px 14px; border-radius: 8px;
  white-space: nowrap;
  opacity: 0; pointer-events:none;
  transition: opacity .2s ease, transform .2s ease;
  display:flex; flex-direction:column; gap:5px; align-items:center;
  border: 1px solid rgba(255,180,90,.3);
  backdrop-filter: blur(6px);
}
.scene-pin .pin-label small {
  font-weight: 400; font-size: 10px;
  color: rgba(245,242,236,.75);
  text-transform:none; letter-spacing:.02em;
  font-family:'Fraunces',serif; font-style:italic;
}
.scene-pin:hover .pin-label,
.scene-pin:focus-visible .pin-label {
  opacity: 1; transform: translateX(-50%) translateY(-3px);
}

/* Legend / chips */
.scene-legend {
  display:flex; align-items:center; justify-content:space-between;
  gap: 20px; flex-wrap: wrap;
  margin-top: 28px; padding: 18px 22px;
  background: rgba(245,242,236,.04);
  border: 1px solid rgba(245,242,236,.1);
  border-radius: 14px;
}
.scene-status { font: 500 14px/1 'Inter', sans-serif; color: rgba(245,242,236,.85); display:inline-flex; align-items:center; gap:10px; }
.scene-status b { font-weight: 800; font-size: 20px; color: #FFB45A; }
.scene-status-dot {
  width: 8px; height: 8px; border-radius:50%;
  background: #FFB45A; box-shadow: 0 0 12px rgba(255,180,90,.7);
  display:inline-block;
}
.scene-hint {
  flex: 1 0 100%;
  margin: 0;
  font: 400 13px/1.45 'Inter', sans-serif;
  color: rgba(245,242,236,.55);
}
.scene-chips { display:flex; gap:8px; flex-wrap: wrap; }
.scene-chips .chip {
  font: 700 11px/1 'Inter', sans-serif; letter-spacing:.1em; text-transform:uppercase;
  padding: 10px 14px; border-radius: 999px; cursor:pointer;
  background: transparent; color: rgba(245,242,236,.55);
  border: 1px solid rgba(245,242,236,.18);
  transition: all .25s ease;
}
.scene-chips .chip:hover { background: rgba(245,242,236,.06); color:#F5F2EC; }
.scene-chips .chip.is-active {
  background: #FFB45A; color: #0B1220;
  border-color: #FFB45A;
  box-shadow: 0 0 20px rgba(255,180,90,.25);
}

/* Mobile */
@media (max-width: 720px) {
  .scene-pin { width: 30px; height: 30px; }
  .scene-pin .pin-dot { width: 11px; height: 11px; }
  .scene-pin .pin-label { font-size: 10px; padding: 7px 11px; }
  .scene-legend { padding: 14px; flex-direction: column; align-items: flex-start; }
  .scene-chips { width: 100%; }
}

/* ============================================================
   RECHERCHE GLOBALE — barre header
   ============================================================ */
.gs-wrap { position: relative; flex: 1 1 220px; max-width: 340px; min-width: 0; }
@media (min-width: 981px) {
  [data-universe="bolduc"] .gs-wrap { max-width: min(36vw, 480px); }
}
.gs-form {
  display: flex; align-items: center; gap: 8px;
  background: color-mix(in srgb, var(--surface, #fff) 88%, transparent);
  border: 1px solid var(--line, rgba(0,0,0,.12));
  border-radius: 999px; padding: 0 14px 0 12px; min-height: 40px;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.site-header.transparent:not(.scrolled) .gs-form {
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.22);
}
.gs-wrap.is-open .gs-form,
.gs-form:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}
.gs-icon { flex-shrink: 0; opacity: .55; }
.gs-input {
  flex: 1; min-width: 0; border: 0; background: transparent;
  font-family: 'Inter', sans-serif; font-size: .88rem; color: inherit;
  outline: none;
}
.gs-input::placeholder { color: color-mix(in srgb, currentColor 50%, transparent); }
.gs-clear {
  border: 0; background: transparent; color: inherit; opacity: .6;
  font-size: 1.2rem; line-height: 1; cursor: pointer; padding: 0 2px;
}
.gs-panel {
  position: absolute; top: calc(100% + 10px); left: 0; right: 0; z-index: 400;
  background: var(--surface, #fff); color: var(--text, #0a0a0a);
  border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0,0,0,.18);
  padding: 10px; max-height: min(70vh, 480px); overflow: auto;
}
.gs-section-label {
  display: block; font-family: 'JetBrains Mono', monospace;
  font-size: .66rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-soft); padding: 8px 8px 6px;
}
.gs-result {
  display: flex; gap: 12px; align-items: center; padding: 10px 8px;
  border-radius: 8px; text-decoration: none; color: inherit;
  transition: background .15s var(--ease);
}
.gs-result:hover, .gs-result:focus-visible { background: color-mix(in srgb, var(--accent) 8%, transparent); outline: none; }
.gs-result-img {
  width: 48px;
  height: 48px;
  object-fit: contain;
  object-position: center;
  border-radius: 6px;
  flex-shrink: 0;
  background: #f3efe6;
  padding: 3px;
  box-sizing: border-box;
}
.gs-result-img--ph,
.gs-result-img.is-broken {
  display: block;
  background:
    linear-gradient(135deg, #ebe4d6 25%, transparent 25%) -6px 0 / 12px 12px,
    linear-gradient(225deg, #ebe4d6 25%, transparent 25%) -6px 0 / 12px 12px,
    #f3efe6;
}
.gs-result-body { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gs-result-uni { font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.gs-result-title { font-size: .9rem; font-weight: 700; line-height: 1.25; }
.gs-result-meta { font-size: .76rem; color: var(--text-soft); }
.gs-history { list-style: none; margin: 0; padding: 0 4px 6px; display: flex; flex-wrap: wrap; gap: 8px; }
.gs-hist-item {
  border: 1px solid var(--line); background: transparent; border-radius: 999px;
  padding: 6px 12px; font-size: .78rem; cursor: pointer; color: var(--text-soft);
  transition: border-color .2s, color .2s;
}
.gs-hist-item:hover { border-color: var(--accent); color: var(--text); }
.gs-all {
  display: block; text-align: center; padding: 10px; margin-top: 4px;
  font-size: .82rem; font-weight: 600; color: var(--accent); text-decoration: none;
  border-top: 1px solid var(--line);
}
.gs-empty { padding: 12px 8px; font-size: .86rem; color: var(--text-soft); margin: 0; }

@media (max-width: 1100px) {
  .gs-wrap { max-width: 200px; }
}
@media (max-width: 900px) {
  .header-inner { flex-wrap: wrap; row-gap: 10px; }
  .gs-wrap { order: 4; flex: 1 1 100%; max-width: none; }
  .header-actions { margin-left: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .scene-pin .pin-dot::before { animation: none; }
  .scene-light, .scene-pin .pin-dot, .scene-pin .pin-label, .scene-chips .chip { transition: none; }
}