body[data-site="lighting"] {
  --ink: #19365d;
  --muted: #435c78;
  --blue: #234fcb;
  --blue-deep: #163da8;
  --pale: #edf5ff;
  --line: #d6e4f5;
  --lighting-surface: #f3f8ff;
  --lighting-sky: #dcecff;
  color: var(--ink);
}

body[data-site="lighting"] .topline {
  background: #eaf2ff;
  color: #375782;
}

body[data-site="lighting"] .header {
  border-color: var(--line);
  box-shadow: 0 1px 0 #b7cef533;
}

body[data-site="lighting"] .vertical-brand span,
body[data-site="lighting"] .vertical-hero .hero-copy .eyebrow,
body[data-site="lighting"] .section-head .eyebrow {
  color: #365ead;
}

body[data-site="lighting"] .nav-item > a:hover,
body[data-site="lighting"] .nav-item > a[aria-current="page"],
body[data-site="lighting"] :is(.text-link, .vertical-card h3 a:hover) {
  color: var(--blue-deep);
}

body[data-site="lighting"] .nav-item > a::after,
body[data-site="lighting"] .vertical-hero .hero-copy .eyebrow i {
  background: var(--blue);
}

body[data-site="lighting"] :is(.button.red, .floating-contact a) {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
  box-shadow: 0 6px 16px #234fcb24;
}

body[data-site="lighting"] :is(.button.red, .floating-contact a):hover {
  background: var(--blue-deep);
  border-color: var(--blue-deep);
}

body[data-site="lighting"] .button.outline {
  background: #fff;
  border-color: #c7d9f5;
  color: var(--blue-deep);
}

body[data-site="lighting"] .button.outline:hover {
  background: #e4eeff;
  border-color: #acc5f1;
  color: var(--blue-deep);
}

body[data-site="lighting"] :is(a, button, summary):focus-visible {
  outline: 3px solid #275bce;
  outline-offset: 4px;
}

body[data-site="lighting"] .vertical-hero {
  --hero-wash: #edf5ff;
  background: var(--lighting-surface);
  border-bottom: 1px solid var(--line);
}

body[data-site="lighting"] .vertical-hero .hero-slide {
  background: radial-gradient(ellipse at 72% 14%, #d6e7ff 0%, #edf5ff 45%, #f7faff 90%);
}

body[data-site="lighting"] .vertical-hero .hero-copy .hero-title {
  color: #173661;
  font-weight: 720;
}

body[data-site="lighting"] .vertical-hero .hero-copy p {
  color: var(--muted);
}

body[data-site="lighting"] .vertical-hero .hero-tags > * {
  border-color: #cddff7;
  background: #ffffffcc;
  color: #375782;
}

body[data-site="lighting"] .vertical-pause {
  border-color: #c7d9f5;
  color: var(--blue-deep);
}

body[data-site="lighting"] .page-hero {
  background: linear-gradient(130deg, #e7f1ff, #f9fcff 76%);
  border-color: var(--line);
}

body[data-site="lighting"] .page-hero :is(h1, .eyebrow) {
  color: #234985;
}

body[data-site="lighting"] .value-strip {
  background: #f0f6ff;
  border-color: var(--line);
}

body[data-site="lighting"] .value-icon {
  color: var(--blue);
}

body[data-site="lighting"] .vertical-catalog .vertical-grid {
  gap: clamp(16px, 2.3vw, 30px);
}

body[data-site="lighting"] .vertical-catalog .vertical-card {
  border-color: var(--line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 8px 28px #3356860d;
}

body[data-site="lighting"] .vertical-catalog .vertical-card:focus-within {
  border-color: #7c9de4;
  box-shadow: 0 8px 28px #3356861c;
}

body[data-site="lighting"] .vertical-catalog .vertical-card-media {
  border-bottom: 1px solid var(--line);
  background: var(--lighting-sky);
}

body[data-site="lighting"] .vertical-catalog .vertical-card-media img {
  aspect-ratio: 1;
  object-position: center;
}

body[data-site="lighting"] .vertical-catalog .vertical-card-copy {
  padding: clamp(20px, 2.2vw, 30px);
}

body[data-site="lighting"] .vertical-catalog .vertical-card h3 {
  font-weight: 700;
  letter-spacing: -.02em;
}

body[data-site="lighting"] .vertical-catalog .vertical-card-note {
  color: #4b6584;
  font-size: 12px;
}

body[data-site="lighting"] .vertical-product .vertical-photo,
body[data-site="lighting"] .vertical-product .vertical-checklist {
  border-color: var(--line);
  background: var(--lighting-surface);
}

body[data-site="lighting"] .vertical-product .vertical-photo img {
  object-position: center;
}

body[data-site="lighting"] :is(.home-case-studies, .project-prompt) {
  background: #eaf3ff;
  border-color: var(--line);
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  body[data-site="lighting"] .vertical-catalog .vertical-card {
    transition: box-shadow .2s ease, transform .2s ease;
  }

  body[data-site="lighting"] .vertical-catalog .vertical-card:hover {
    box-shadow: 0 14px 34px #3356861a;
    transform: translateY(-3px);
  }
}

@media (min-width: 1000px) {
  body[data-site="lighting"] .vertical-hero {
    --lighting-gutter: max(32px, calc((100% - 1200px) / 2));
  }

  body[data-site="lighting"] .vertical-hero .hero-slide .hero-art,
  body[data-site="lighting"] .vertical-hero .hero-slide:first-child .hero-art {
    position: absolute;
    inset: 35px var(--lighting-gutter) 35px 46%;
    border: 1px solid #c8dcf7;
    border-radius: 24px;
    box-shadow: 0 16px 38px #2b518a22;
    overflow: hidden;
  }

  body[data-site="lighting"] .vertical-hero .hero-slide .hero-art::after,
  body[data-site="lighting"] .vertical-hero .hero-slide:first-child .hero-art::after {
    background: linear-gradient(0deg, #16386357 0%, transparent 18%);
  }

  body[data-site="lighting"] .vertical-hero .hero-slide .hero-art picture {
    display: block;
    width: 100%;
    height: 100%;
  }

  body[data-site="lighting"] .vertical-hero .hero-slides .hero-slide .hero-art img {
    object-position: 78% center;
  }

  body[data-site="lighting"] .vertical-hero .hero-slides .hero-slide .hero-copy {
    width: 41%;
    max-width: 490px;
  }

  body[data-site="lighting"] .vertical-hero .hero-slides .hero-slide .hero-copy .hero-title {
    font-size: clamp(38px, 4vw, 60px);
    line-height: 1.08;
    max-width: 15ch;
  }

  body[data-site="lighting"][data-language="zh"] .vertical-hero .hero-slides .hero-slide .hero-copy .hero-title {
    font-size: clamp(38px, 3.65vw, 57px);
    line-height: 1.19;
  }

  body[data-site="lighting"] .vertical-hero .equipment-footage-note {
    inset: auto auto 12px 15px;
    padding: 3px 9px;
    border-radius: 99px;
    background: #ffffffed;
    color: #2c4a70;
    text-shadow: none;
  }

  body[data-site="lighting"] .vertical-pause {
    right: calc(var(--lighting-gutter) + 14px);
    bottom: 49px;
  }
}
