:root {
  color-scheme: dark;
}

body {
  background:
    linear-gradient(180deg,
      #0a0a0f 0%,
      #1a1a2e 12%,
      #0a0a0f 25%,
      #1a1a2e 37%,
      #0a0a0f 50%,
      #1a1a2e 62%,
      #0a0a0f 75%,
      #1a1a2e 87%,
      #0a0a0f 100%
    );
}

.hero-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(10, 10, 15, .06), rgba(10, 10, 15, .84) 66%, transparent 100%),
    linear-gradient(90deg, rgba(10, 10, 15, .82), rgba(10, 10, 15, .18) 58%, rgba(10, 10, 15, .78));
}

.reveal {
  opacity: 0;
  transform: translateY(54px);
  transition:
    opacity .72s ease,
    transform .72s cubic-bezier(.2, .72, .22, 1);
  transition-delay: var(--delay, 0ms);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

.text-gold {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='200'%3E%3Cdefs%3E%3CradialGradient id='g' cx='50%25' cy='50%25' r='80%25'%3E%3Cstop offset='0%25' stop-color='%23B29D7B'/%3E%3Cstop offset='18%25' stop-color='%23D4C1A1'/%3E%3Cstop offset='35%25' stop-color='%23E8DCC2'/%3E%3Cstop offset='50%25' stop-color='%23F2EBDD'/%3E%3Cstop offset='65%25' stop-color='%23FAF7F1'/%3E%3Cstop offset='78%25' stop-color='%23FFFFFF'/%3E%3Cstop offset='100%25' stop-color='%23E8DCC2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect width='600' height='200' fill='url(%23g)'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.case-kicker::after {
  content: "";
  display: block;
  width: 42px;
  height: 2px;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  background: linear-gradient(90deg, transparent, #6ea8ff, transparent);
}

.case-kicker-gold::after {
  content: "";
  display: block;
  width: 42px;
  height: 2px;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  background: linear-gradient(90deg, transparent, #D9C8A7, transparent);
}

.mobile-menu {
  transform-origin: top;
  transform: scaleY(0.94);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}

.mobile-menu.is-open {
  transform: scaleY(1);
  opacity: 1;
  pointer-events: auto;
}

@media (max-width: 767px) {
  .slider-photo {
    height: auto !important;
    min-height: 420px;
  }
}

.partners-marquee {
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.partners-track { animation: marquee-left 35s linear infinite; }
.partners-track-reverse { animation: marquee-right 35s linear infinite; }

@keyframes marquee-left {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@keyframes marquee-right {
  0% { transform: translateX(-50%); }
  100% { transform: translateX(0); }
}


/* Scroll-driven intro animation */
.scroll-intro {
  display: none;
}

@media (min-width: 1024px) {
  .scroll-anim-section {
    height: 250vh;
    --sp: 0;
  }

  .scroll-anim-sticky {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    align-items: center;
    overflow: hidden;
  }

  .scroll-intro {
    display: flex;
    position: absolute;
    top: 100px;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
    z-index: 10;
  }

  .scroll-intro-title {
    font-family: 'Days One', sans-serif;
    font-size: 64px;
    font-weight: 400;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='200'%3E%3Cdefs%3E%3CradialGradient id='g' cx='50%25' cy='50%25' r='80%25'%3E%3Cstop offset='0%25' stop-color='%23B29D7B'/%3E%3Cstop offset='18%25' stop-color='%23D4C1A1'/%3E%3Cstop offset='35%25' stop-color='%23E8DCC2'/%3E%3Cstop offset='50%25' stop-color='%23F2EBDD'/%3E%3Cstop offset='65%25' stop-color='%23FAF7F1'/%3E%3Cstop offset='78%25' stop-color='%23FFFFFF'/%3E%3Cstop offset='100%25' stop-color='%23E8DCC2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect width='600' height='200' fill='url(%23g)'/%3E%3C/svg%3E");
    background-size: cover;
    background-position: center;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    opacity: clamp(0, 2.5 - 2.5 * var(--sp), 1);
    white-space: nowrap;
  }

  .scroll-intro-desc {
    font-size: 24px;
    color: #fff;
    margin-top: 20px;
    opacity: clamp(0, 2.5 - 2.5 * var(--sp), 1);
  }

  .slider-sidebar {
    opacity: clamp(0, (var(--sp) - 0.4) * 2.5, 1);
    transform: translateX(calc(-30px + 30px * clamp(0, (var(--sp) - 0.4) * 2.5, 1)));
    max-width: calc(200px * clamp(0, (var(--sp) - 0.3) * 2, 1));
    overflow: hidden;
  }

  .scroll-anim-section [data-slider] {
    margin-top: calc(280px * (1 - var(--sp)));
  }

  .scroll-anim-section .slider-photo {
    height: calc(80vh - (80vh - 655px) * var(--sp));
  }

  .slider-nav-btn {
    opacity: clamp(0, (var(--sp) - 0.5) * 3.33, 1) !important;
  }

  .slider-badge {
    opacity: clamp(0, (var(--sp) - 0.5) * 3.33, 1) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reveal,
  .mobile-menu {
    transition: none;
  }

  .partners-track,
  .partners-track-reverse {
    animation: none !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }

  .scroll-anim-section {
    height: auto !important;
  }

  .scroll-anim-sticky {
    position: relative !important;
    height: auto !important;
  }

  .scroll-intro {
    display: none !important;
  }

  .slider-sidebar,
  .slider-nav-btn,
  .slider-badge {
    opacity: 1 !important;
    transform: none !important;
    max-width: none !important;
  }

  .scroll-anim-section .slider-photo {
    height: 655px !important;
  }
}
