/* MAYIM — colourful layer. Load AFTER theme-dark.css */

:root {
  --c-gold:   #e8b84b;
  --c-blue:   #5bc8ff;
  --c-mag:    #e96bff;
  --c-green:  #7be495;
  --c-orange: #ff9d5c;
}

/* richer multi-colour ambient glow */
body::before {
  background:
    radial-gradient(55% 45% at 85% 0%,   color-mix(in srgb, var(--c-blue) 16%, transparent), transparent 60%),
    radial-gradient(45% 40% at 8% 8%,    color-mix(in srgb, var(--c-gold) 15%, transparent), transparent 60%),
    radial-gradient(40% 35% at 92% 70%,  color-mix(in srgb, var(--c-mag) 9%, transparent),  transparent 60%),
    radial-gradient(35% 30% at 10% 85%,  color-mix(in srgb, var(--c-green) 8%, transparent), transparent 60%) !important;
}

/* gradient display headings */
h1, .section-head h2, .cta-inner h2 {
  background: linear-gradient(92deg, #ffffff 0%, #ffe9b0 35%, var(--c-gold) 55%, var(--c-blue) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--c-gold); /* fallback */
}

/* colourful eyebrows */
.eyebrow {
  background: linear-gradient(90deg, color-mix(in srgb, var(--c-gold) 22%, transparent), color-mix(in srgb, var(--c-blue) 22%, transparent));
  border: 1px solid color-mix(in srgb, var(--c-gold) 45%, transparent);
  border-radius: 100px;
  padding: 6px 16px;
  display: inline-block;
}

/* cards: cycling colour pops on the top edge + hover glow */
.grid .card { border-top: 3px solid var(--c-gold); transition: box-shadow .3s, transform .3s; }
.grid .card:nth-child(5n+2) { border-top-color: var(--c-blue); }
.grid .card:nth-child(5n+3) { border-top-color: var(--c-mag); }
.grid .card:nth-child(5n+4) { border-top-color: var(--c-green); }
.grid .card:nth-child(5n+5) { border-top-color: var(--c-orange); }
.grid .card:hover { transform: translateY(-4px); box-shadow: 0 18px 50px -18px color-mix(in srgb, var(--c-blue) 45%, transparent); }
.card .ic { color: var(--c-gold); }
.grid .card:nth-child(5n+2) .ic { color: var(--c-blue); }
.grid .card:nth-child(5n+3) .ic { color: var(--c-mag); }
.grid .card:nth-child(5n+4) .ic { color: var(--c-green); }
.grid .card:nth-child(5n+5) .ic { color: var(--c-orange); }

/* value tiles: cycling colours */
.values .v:nth-child(4n+1) .n { color: var(--c-gold); }
.values .v:nth-child(4n+2) .n { color: var(--c-blue); }
.values .v:nth-child(4n+3) .n { color: var(--c-mag); }
.values .v:nth-child(4n+4) .n { color: var(--c-green); }

/* gradient primary buttons */
.btn-primary {
  background: linear-gradient(95deg, var(--c-gold), #f6d27a 55%, var(--c-orange));
  border: none;
  box-shadow: 0 10px 30px -10px color-mix(in srgb, var(--c-gold) 60%, transparent);
}
.btn-primary:hover { box-shadow: 0 14px 38px -10px color-mix(in srgb, var(--c-gold) 80%, transparent); }
.btn-ghost:hover { border-color: var(--c-blue); color: var(--c-blue); }

/* pricing accents */
.price-card .tier { color: var(--c-blue); }
.price-card.featured { box-shadow: 0 24px 70px -24px color-mix(in srgb, var(--c-gold) 55%, transparent); }

/* ===== full-bleed video hero ===== */
.video-hero {
  position: relative;
  min-height: 94vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
  padding: 120px 24px 90px;
}
.video-hero video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}
.video-hero .tint {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg, rgba(10,14,26,.55) 0%, rgba(10,14,26,.18) 45%, rgba(14,19,32,.88) 100%);
}
.video-hero .inner { position: relative; z-index: 2; max-width: 940px; }
.video-hero h1 { font-size: clamp(2.2rem, 5.5vw, 4.2rem); }
.video-hero .lead { color: #dfe7f5; }
.sound-btn {
  position: absolute; right: 22px; bottom: 22px; z-index: 3;
  background: rgba(10,14,26,.55); color: #fff;
  border: 1px solid rgba(255,255,255,.35); border-radius: 100px;
  padding: 9px 18px; font: inherit; font-size: .9rem; cursor: pointer;
  backdrop-filter: blur(6px);
}
.sound-btn:hover { border-color: var(--c-gold); color: var(--c-gold); }

/* 3D logo as site brand (black background blends into the dark theme) */
.brand img.logo-3d { mix-blend-mode: screen; height: 56px; max-width: 240px; }

/* ===== partner logo marquee ===== */
.partners { padding: 38px 0 14px; }
.partners-label {
  text-align: center; color: var(--muted);
  font-size: .85rem; letter-spacing: .16em; text-transform: uppercase;
  margin-bottom: 16px;
}
.marquee { overflow: hidden; position: relative; }
.marquee::before, .marquee::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 120px; z-index: 2; pointer-events: none;
}
.marquee::before { left: 0; background: linear-gradient(90deg, var(--bg), transparent); }
.marquee::after { right: 0; background: linear-gradient(270deg, var(--bg), transparent); }
.marquee-track {
  display: flex; width: max-content;
  animation: marquee 30s linear infinite;
}
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee-track img {
  height: 150px; width: auto; display: block;
  mix-blend-mode: screen; /* hides the black background over the dark theme */
}
@keyframes marquee { to { transform: translateX(-50%); } }
@media (max-width: 700px) { .marquee-track img { height: 96px; } }