/* React Bits BorderGlow / MagicBento / TiltedCard adapted to AAG's surfaces.
   No dimensions, face transforms, typography, or theme backgrounds are replaced. */
.aag-flavor-relative { position: relative; }
.aag-flavor-light {
  --flavor-edge: 0;
  --flavor-angle: 45deg;
  --flavor-x: 50%;
  --flavor-y: 50%;
  --flavor-one: #d6bc83;
  --flavor-two: #dcc5eb;
  --flavor-three: #bcdadf;
  --flavor-glow: 223 200 151;
  position: absolute;
  inset: 0;
  display: block;
  border-radius: inherit;
  pointer-events: none !important;
  user-select: none;
  z-index: 8;
  opacity: 0;
  transition: opacity 500ms ease;
}
.aag-flavor-light.is-on { opacity: 1; transition-duration: 200ms; }
.aag-flavor-light.is-gold {
  --flavor-one: var(--gold, #b98d3f);
  --flavor-two: #ffe3a0;
  --flavor-three: #d9a94f;
  --flavor-glow: 230 186 96;
}
.aag-flavor-rim, .aag-flavor-edge {
  position: absolute;
  inset: 0;
  display: block;
  border-radius: inherit;
  pointer-events: none !important;
}
.aag-flavor-rim {
  background: radial-gradient(at 80% 55%, var(--flavor-one), transparent 50%),
    radial-gradient(at 69% 34%, var(--flavor-two), transparent 50%),
    radial-gradient(at 8% 6%, var(--flavor-three), transparent 50%),
    radial-gradient(at 41% 38%, var(--flavor-one), transparent 50%),
    radial-gradient(at 86% 85%, var(--flavor-two), transparent 50%),
    radial-gradient(at 82% 18%, var(--flavor-three), transparent 50%),
    linear-gradient(var(--flavor-one), var(--flavor-two));
  padding: 1.4px;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  opacity: calc(.22 + var(--flavor-edge) * .78);
}
.aag-flavor-edge {
  inset: -20px;
  -webkit-mask-image: conic-gradient(from var(--flavor-angle) at center, #000 2.5%, transparent 12%, transparent 88%, #000 97.5%);
  mask-image: conic-gradient(from var(--flavor-angle) at center, #000 2.5%, transparent 12%, transparent 88%, #000 97.5%);
  opacity: var(--flavor-edge);
}
.aag-flavor-edge::before {
  content: '';
  position: absolute;
  inset: 20px;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgb(var(--flavor-glow) / .9),
    inset 0 0 3px rgb(var(--flavor-glow) / .65),
    inset 0 0 6px rgb(var(--flavor-glow) / .45),
    inset 0 0 15px rgb(var(--flavor-glow) / .25),
    inset 0 0 25px 2px rgb(var(--flavor-glow) / .12),
    0 0 3px rgb(var(--flavor-glow) / .65),
    0 0 6px rgb(var(--flavor-glow) / .45),
    0 0 15px rgb(var(--flavor-glow) / .25),
    0 0 25px 2px rgb(var(--flavor-glow) / .12);
}
.aag-flavor-light.is-gold::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(220px circle at var(--flavor-x) var(--flavor-y), rgb(var(--flavor-glow) / .15), transparent 72%);
}
.aag-bento-particles {
  position: absolute;
  inset: 0;
  z-index: 7;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none !important;
}
.aag-bento-particles i {
  position: absolute;
  left: var(--particle-x);
  top: var(--particle-y);
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #ffe3a0;
  box-shadow: 0 0 6px rgb(230 186 96 / .65);
  animation: aag-bento-drift var(--particle-time) ease-in-out var(--particle-delay) infinite alternate;
}
@keyframes aag-bento-drift {
  from { transform: translate3d(0, 0, 0) scale(.65); opacity: .2; }
  to { transform: translate3d(var(--particle-dx), var(--particle-dy), 0) scale(1); opacity: .8; }
}
@media (prefers-reduced-motion: reduce) {
  .aag-flavor-light { transition: none; }
  .aag-flavor-tilt { rotate: none !important; }
  .aag-bento-particles { display: none; }
}
@media (hover: none), (pointer: coarse) {
  .aag-flavor-tilt { rotate: none !important; }
  .aag-bento-particles { display: none; }
}
