:root {
  --zd-ink: #09090d;
  --zd-ink-soft: #14141d;
  --zd-paper: #f7f5f2;
  --zd-white: #ffffff;
  --zd-blue: #39c8ff;
  --zd-violet: #a96bff;
  --zd-lime: #b7ff9a;
  --zd-muted: #aaa8b3;
  --zd-line: rgba(255, 255, 255, 0.18);
  --zd-glow: 0 0 48px rgba(169, 107, 255, 0.24);
  --zd-radius: 1.25rem;
  --zd-gutter: clamp(1.25rem, 4vw, 4.5rem);
  --zd-section: clamp(5rem, 10vw, 10rem);
  --zd-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.zd-site {
  background: var(--zd-ink);
  color: var(--zd-white);
  text-rendering: optimizeLegibility;
}

.zd-site ::selection {
  background: var(--zd-violet);
  color: var(--zd-white);
}

.zd-site :focus-visible {
  outline: 3px solid var(--zd-blue);
  outline-offset: 4px;
}

.zd-section {
  position: relative;
  overflow: clip;
  padding-block: var(--zd-section);
}

.zd-section--ink {
  background:
    radial-gradient(circle at 78% 12%, rgba(169, 107, 255, 0.15), transparent 32rem),
    radial-gradient(circle at 18% 82%, rgba(57, 200, 255, 0.1), transparent 28rem),
    var(--zd-ink);
}

.zd-kicker {
  color: var(--zd-blue);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.zd-display {
  max-width: 15ch;
  margin: 0;
  font-size: clamp(3rem, 8vw, 8.5rem);
  font-weight: 700;
  letter-spacing: -0.055em;
  line-height: 0.92;
  text-wrap: balance;
}

.zd-gradient-text {
  background: linear-gradient(110deg, var(--zd-white) 10%, var(--zd-blue) 52%, var(--zd-violet) 90%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.zd-lede {
  max-width: 44rem;
  color: rgba(255, 255, 255, 0.76);
  font-size: clamp(1.15rem, 2vw, 1.55rem);
  line-height: 1.55;
}

.zd-button,
.zd-site .et_pb_button.zd-button {
  display: inline-flex;
  align-items: center;
  min-height: 3.25rem;
  padding: 0.85rem 1.35rem;
  border: 1px solid var(--zd-blue);
  border-radius: 999px;
  background: transparent;
  color: var(--zd-white);
  font-weight: 700;
  letter-spacing: 0.02em;
  transition: background-color 220ms ease, color 220ms ease, transform 220ms var(--zd-ease), box-shadow 220ms ease;
}

.zd-button:hover,
.zd-site .et_pb_button.zd-button:hover {
  background: var(--zd-blue);
  color: var(--zd-ink);
  transform: translateY(-2px);
  box-shadow: 0 12px 34px rgba(57, 200, 255, 0.24);
}

.zd-card {
  height: 100%;
  border: 1px solid var(--zd-line);
  border-radius: var(--zd-radius);
  background: rgba(255, 255, 255, 0.035);
  box-shadow: var(--zd-glow);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.zd-media {
  overflow: hidden;
  border-radius: var(--zd-radius);
}

.zd-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 800ms var(--zd-ease);
}

.zd-media:hover img {
  transform: scale(1.035);
}

.zd-reveal {
  opacity: 0;
  transform: translate3d(0, 2.25rem, 0);
  transition: opacity 800ms var(--zd-ease), transform 800ms var(--zd-ease);
  transition-delay: var(--zd-delay, 0ms);
}

.zd-reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

[data-zd-parallax] {
  --zd-parallax-y: 0px;
  transform: translate3d(0, var(--zd-parallax-y), 0);
  will-change: transform;
}

.zd-rule {
  height: 1px;
  border: 0;
  background: linear-gradient(90deg, transparent, var(--zd-blue), var(--zd-violet), transparent);
}

@media (max-width: 767px) {
  :root {
    --zd-section: clamp(4rem, 18vw, 6rem);
  }

  .zd-display {
    font-size: clamp(2.75rem, 15vw, 5rem);
  }

  [data-zd-parallax] {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }

  .zd-site *,
  .zd-site *::before,
  .zd-site *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

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

  [data-zd-parallax] {
    transform: none;
  }
}