/* The painting fills the opening scene. Only the artwork responds to the pointer. */
html[data-style=original] .executive-hero {
  --ink: #fff7ec;
  --muted: #dce4e2;
  --plum: #a5efea;
  --line: #ffffff42;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  max-width: none;
  min-height: clamp(650px, 82svh, 910px);
  margin: 0;
  padding: clamp(68px, 10vh, 132px) max(6%, calc((100% - 1120px) / 2));
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: #0b161c;
  color: var(--ink);
}
html[data-style=original] .executive-hero::before,
html[data-style=original] .executive-hero::after,
.hero-motion-art {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
html[data-style=original] .executive-hero::before {
  content: "";
  z-index: -3;
  background: url('/assets/nebula-motion-poster.webp') 50% 50% / cover no-repeat;
  opacity: .94;
  filter: brightness(1.28) saturate(1.1);
}
.hero-motion-art {
  z-index: -2;
  display: block;
  width: 100%;
  height: 100%;
  visibility: hidden;
  image-rendering: pixelated;
  opacity: .94;
  filter: brightness(1.28) saturate(1.1);
}
html[data-style=original] .executive-hero.has-motion-art::before { visibility: hidden; }
.has-motion-art .hero-motion-art { visibility: visible; }
html[data-style=original] .executive-hero::after {
  content: "";
  z-index: -1;
  background: linear-gradient(90deg, #061324f0 0%, #061324d6 40%, #061324ad 56%, #06132450 77%, #0613241a 100%);
}
html[data-style=original] .executive-hero h1 {
  font-size: clamp(37px, 5.8vw, 83px);
  max-width: 900px;
  text-shadow: 0 2px 24px #08111690;
}
html[data-style=original] .executive-hero .hero-person img {
  width: 92px;
  height: 92px;
  border-color: #13272d;
}
html[data-style=original] .executive-hero .executive-intro,
html[data-style=original] .executive-hero .executive-context {
  max-width: min(600px, 65%);
}
html[data-style=original] .executive-hero .primary-link {
  background: #a5efea;
  color: #102532;
}
html[data-style=original] .executive-hero .primary-link:hover { background: #cefaf3; }
html[data-style=original] .executive-hero a:focus-visible { outline-color: #fff7ec; }
html[data-style=original] body:has(.executive-hero) .header {
  --bg: #0b161c;
  --ink: #fff7ec;
  --muted: #dce4e2;
  --line: #ffffff42;
  --plum: #a5efea;
  background: #0b161c;
  color: var(--ink);
}
@media (max-width: 700px) {
  html[data-style=original] .executive-hero {
    min-height: 0;
    padding: 52px 6% 160px;
  }
  html[data-style=original] .executive-hero h1 { font-size: clamp(31px, 8.65vw, 58px); }
  html[data-style=original] .executive-hero .hero-person img { width: 74px; height: 74px; }
  html[data-style=original] .executive-hero .executive-intro,
  html[data-style=original] .executive-hero .executive-context { max-width: 100%; }
  html[data-style=original] .executive-hero::before { background-position: 50% 50%; }
  html[data-style=original] .executive-hero::after {
    background:
      linear-gradient(180deg, #061324e8 0%, #061324d9 52%, #06132485 73%, #06132424 89%, #0b161c 100%);
  }
}
/* Light treatment: higher-contrast monochrome pixels dissolve into warm white. */
html[data-style=original][data-theme=light] .executive-hero {
  --ink: #142b3b;
  --muted: #4c6067;
  --plum: #00626a;
  --line: #142b3b34;
  background: #faf9f7;
}
html[data-style=original][data-theme=light] .executive-hero::before,
html[data-style=original][data-theme=light] .executive-hero .hero-motion-art {
  opacity: .3;
  filter: grayscale(1) contrast(1.75) brightness(1.12);
}
html[data-style=original][data-theme=light] .executive-hero::after {
  background:
    linear-gradient(90deg, #faf9f7e0 0%, #faf9f780 45%, #faf9f700 83%),
    linear-gradient(180deg, #faf9f775 0%, #faf9f700 22%, #faf9f700 72%, #faf9f7 100%);
}
html[data-style=original][data-theme=light] .executive-hero h1 { text-shadow: none; }
html[data-style=original][data-theme=light] .executive-hero .hero-person img { border-color: #faf9f7; }
html[data-style=original][data-theme=light] .executive-hero .primary-link { background: #00626a; color: #fff; }
html[data-style=original][data-theme=light] .executive-hero .primary-link:hover { background: #174b60; }
html[data-style=original][data-theme=light] .executive-hero a:focus-visible { outline-color: #00626a; }
html[data-style=original][data-theme=light] body:has(.executive-hero) .header {
  --bg: #faf9f7;
  --ink: #142b3b;
  --muted: #4c6067;
  --line: #142b3b34;
  --plum: #00626a;
  background: var(--bg);
}
@media (max-width: 700px) {
  html[data-style=original][data-theme=light] .executive-hero::after {
    background:
      linear-gradient(180deg, #faf9f7b0 0%, #faf9f766 53%, #faf9f700 80%, #faf9f7 100%);
  }
}
.hero-motion-toggle {
  position: absolute;
  inset-inline-end: 6%;
  inset-block-end: 20px;
  z-index: 1;
  min-height: 44px;
  padding: .5rem .85rem;
  border: 1px solid #ffffff65;
  border-radius: 100px;
  background: #0b161c;
  color: #fff7ec;
  font: 600 .75rem/1.25 var(--font);
  cursor: pointer;
}
html[data-theme=light] .hero-motion-toggle {
  color: #142b3b;
  background: #faf9f7;
  border-color: #4c6067;
}
.hero-motion-toggle:focus-visible { outline: 2px solid var(--plum); outline-offset: 3px; }
