/*
 * Jidian website adaptations of React Bits by David Haz (c) 2026.
 * Upstream: https://github.com/DavidHDev/react-bits
 * Commit: 496968c4117e21278f13917201b7d615bc5e7450
 * MIT + Commons Clause. Full license: ./third-party-notices.txt
 * Provenance and original files: ../vendor/react-bits/README.md (source tree only).
 */

/* SpotlightCard: isolated decoration never intercepts links or keyboard focus. */
.rb-spotlight {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.rb-spotlight-light {
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(circle 260px at var(--rb-x, 50%) var(--rb-y, 50%), var(--rb-falloff, rgb(72, 158, 111) 0%, transparent 100%));
  transition: opacity 180ms ease;
}
.rb-spotlight:is(:hover, :focus-within) > .rb-spotlight-light { opacity: .18; }

/* GradientText and ShinyText keep readable solid text without CSS support/JS. */
.rb-gradient-text,
.rb-shiny-text {
  color: #086044;
}
@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  .rb-gradient-text,
  .rb-shiny-text {
    background-repeat: no-repeat;
    background-size: 100% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
  }
  .rb-gradient-text { background-image: var(--rb-gradient, linear-gradient(90deg, #006044, #3b7757, #085b44)); }
  .rb-shiny-text { background-image: var(--rb-shine, linear-gradient(#086044, #086044)); }
}

/* FadeContent is progressive enhancement. There is deliberately no hidden state. */
[data-rb-fade] { opacity: 1; }

/* Aurora: the layered CSS composition remains when JS/WebGL is unavailable. */
.rb-aurora {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse 34% 76% at 94% 30%, rgba(33, 133, 93, .23), transparent 78%),
    radial-gradient(ellipse 54% 48% at 80% 74%, rgba(159, 220, 185, .58), transparent 74%),
    radial-gradient(ellipse 38% 76% at 57% 6%, rgba(209, 236, 197, .58), transparent 76%),
    linear-gradient(112deg, #fbfcf8 15%, #f6faf4 50%, #eaf4e9 100%);
}
.rb-aurora::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(251, 252, 248, .96) 0%, rgba(251, 252, 248, .8) 28%, transparent 62%),
    linear-gradient(0deg, #f9fbf7 0%, transparent 20%);
}
.rb-aurora-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  opacity: 0;
  -webkit-mask-image: linear-gradient(100deg, transparent 10%, rgba(0, 0, 0, .15) 35%, #000 80%);
  mask-image: linear-gradient(100deg, transparent 10%, rgba(0, 0, 0, .15) 35%, #000 80%);
}
.rb-aurora[data-rb-ready] > .rb-aurora-canvas { opacity: .86; }
@media (max-width: 720px) {
  .rb-aurora {
    background:
      radial-gradient(ellipse 85% 40% at 90% 67%, rgba(53, 147, 100, .22), transparent 78%),
      radial-gradient(ellipse 92% 38% at 70% 88%, rgba(168, 224, 187, .6), transparent 72%),
      linear-gradient(160deg, #fbfcf8 12%, #f4f9f0 65%, #ecf6ed);
  }
  .rb-aurora::after {
    background: linear-gradient(180deg, rgba(251, 252, 248, .85) 0%, rgba(251, 252, 248, .64) 26%, transparent 55%, #f9fbf7 100%);
  }
  .rb-aurora-canvas {
    -webkit-mask-image: linear-gradient(180deg, transparent 18%, #000 54%, #000 88%, transparent);
    mask-image: linear-gradient(180deg, transparent 18%, #000 54%, #000 88%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .rb-aurora-canvas { display: none; }
  .rb-spotlight-light { display: none; transition: none; }
  .rb-gradient-text,
  .rb-shiny-text { background-image: none; color: #086044; -webkit-text-fill-color: currentColor; }
  [data-rb-fade] { opacity: 1 !important; filter: none !important; }
}
@media (forced-colors: active) {
  .rb-aurora { background: Canvas; }
  .rb-aurora-canvas, .rb-aurora::after { display: none; }
  .rb-spotlight-light { display: none; }
  .rb-gradient-text,
  .rb-shiny-text { background-image: none; color: CanvasText; -webkit-text-fill-color: currentColor; }
}