/* Unified brand scene: the original product artwork fades into one cool-white canvas. */
.ch-hero {
  background: #f8faff;
}
.ch-hero::before {
  inset: 0;
  width: auto;
  height: auto;
  border-radius: 0;
  background: radial-gradient(ellipse at 78% 43%, #dce8ff80, transparent 62%), linear-gradient(105deg, #fff 12%, #f5f8ff 65%, #edf3ff);
  transform: none;
  filter: none;
  opacity: 1;
  animation: none;
}
.ch-hero::after {
  inset: 0;
  width: auto;
  height: auto;
  background: linear-gradient(0deg, #fff, transparent 16%, transparent 86%, #ffffff80);
  transform: none;
  z-index: -1;
}
.ch-hero-art {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right center;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
  animation: none;
  background: transparent;
  mix-blend-mode: multiply;
  mask-image: linear-gradient(90deg, transparent 22%, #000 53%, #000 96%, transparent), linear-gradient(0deg, transparent, #000 16%, #000 87%, transparent);
  mask-composite: intersect;
  -webkit-mask-composite: source-in;
}
.ch-hero-copy { position: relative; z-index: 1; }
.s-dark .ch-hero { background: #101a2e; }
.s-dark .ch-hero::before { background: radial-gradient(ellipse at 80% 50%, #253c67, transparent 70%); opacity: 1; }
.s-dark .ch-hero::after { background: linear-gradient(0deg, #101a2e, transparent 20%); }
.s-dark .ch-hero-art { mix-blend-mode: luminosity; opacity: .65; mask-image: radial-gradient(ellipse 43% 48% at 77% 53%, #000 40%, transparent 100%); }
@media (max-width: 1100px) and (min-width: 761px) {
  .ch-hero-art { width: 110%; left: auto; right: -8%; object-position: right center; }
}
@media (max-width: 760px) {
  .ch-hero::before { background: radial-gradient(ellipse at 78% 75%, #e5edff, transparent 58%), linear-gradient(#fff, #f8faff); }
  .ch-hero::after { background: linear-gradient(0deg, #fff, transparent 12%); }
  .ch-hero-inner { padding-bottom: 295px; }
  .ch-hero-art {
    inset: auto -4% 15px auto;
    width: 108%;
    height: 280px;
    object-fit: cover;
    object-position: right center;
    mask-image: linear-gradient(90deg, transparent, #000 20%, #000 94%, transparent), linear-gradient(0deg, transparent, #000 14%, #000 76%, transparent);
  }
  .s-dark .ch-hero-art { mask-image: radial-gradient(ellipse 70% 65% at 65% 52%, #000 30%, transparent 100%); }
}
