.glow-card {
  position: relative; background: var(--color-parchment-200,#F5E6C8);
  border: 2px solid var(--color-border,#D4B896); border-radius: var(--radius-lg,8px);
  overflow: hidden;
  transition: border-color var(--duration-base,250ms), box-shadow var(--duration-base,250ms);
}
.glow-card::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: radial-gradient(400px circle at var(--mouse-x,50%) var(--mouse-y,50%), rgba(245,158,11,0.18) 0%, rgba(245,158,11,0.06) 40%, transparent 70%);
  opacity: 0; transition: opacity var(--duration-slow,400ms);
}
.glow-card:hover::before { opacity: 1; }
.glow-card:hover { border-color: rgba(245,158,11,0.6); box-shadow: var(--shadow-glow-gold); }
.glow-card > * { position: relative; z-index: 2; }

.shimmer-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  gap: 0.5rem; padding: 0.75rem 2rem;
  font-family: var(--font-display,serif); font-size: var(--text-sm,0.8125rem);
  font-weight: var(--weight-bold,700); letter-spacing: var(--tracking-widest,0.2em);
  text-transform: uppercase; color: var(--color-parchment-900,#3D2008);
  background: var(--gradient-gold); background-size: 200% 100%;
  border: none; border-radius: var(--radius-sm,2px); cursor: pointer; overflow: hidden;
  transition: background-position var(--duration-slower,700ms), transform var(--duration-fast,150ms) var(--ease-bounce), box-shadow var(--duration-base,250ms);
  box-shadow: var(--shadow-md);
}
.shimmer-btn::before {
  content: ""; position: absolute; top: 0; left: -100%; width: 60%; height: 100%;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%);
  transform: skewX(-20deg); transition: left var(--duration-slower,700ms) var(--ease-adventure);
  pointer-events: none;
}
.shimmer-btn:hover::before { left: 160%; }
.shimmer-btn:hover { background-position: 100% 0; box-shadow: var(--shadow-glow-gold); transform: translateY(-1px); }
.shimmer-btn:active { transform: scale(0.98); }
.shimmer-btn .ripple {
  position: absolute; border-radius: 50%; background: rgba(255,255,255,0.4);
  transform: scale(0); animation: ripple-expand 600ms ease-out forwards; pointer-events: none;
}
@keyframes ripple-expand { to { transform: scale(4); opacity: 0; } }

.shimmer-btn--outline {
  background: transparent; color: var(--color-gold-600,#D97706);
  border: 2px solid var(--color-gold-500,#F59E0B); box-shadow: none;
}
.shimmer-btn--outline:hover { background: rgba(245,158,11,0.08); box-shadow: var(--shadow-glow-gold); }

.sparkle-wrap { position: relative; display: inline-block; }
.sparkle { position: absolute; pointer-events: none; animation: sparkle-burst 700ms ease-out forwards; z-index: 10; }
@keyframes sparkle-burst {
  0% { transform: scale(0) rotate(0deg); opacity: 1; }
  50% { transform: scale(1) rotate(90deg); opacity: 1; }
  100% { transform: scale(0) rotate(180deg); opacity: 0; }
}

[data-reveal] { opacity: 0; transition: opacity var(--duration-slow,400ms) var(--ease-adventure), transform var(--duration-slow,400ms) var(--ease-adventure); }
[data-reveal="fade-up"] { transform: translateY(32px); }
[data-reveal="fade-down"] { transform: translateY(-32px); }
[data-reveal="fade-left"] { transform: translateX(32px); }
[data-reveal="fade-right"] { transform: translateX(-32px); }
[data-reveal="zoom"] { transform: scale(0.9); }
[data-reveal].revealed { opacity: 1; transform: none; }

[data-counter] { font-family: var(--font-display,serif); font-variant-numeric: tabular-nums; }

[data-typed]::after { content: "|"; animation: blink 1s step-end infinite; color: var(--color-gold-500,#F59E0B); margin-left: 2px; }
@keyframes blink { 50% { opacity: 0; } }

.gradient-text {
  background: linear-gradient(135deg, #FBBF24 0%, #D97706 30%, #5C3D1E 60%, #F59E0B 100%);
  background-size: 200% 200%; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; animation: gradient-shift 4s ease infinite;
}
@keyframes gradient-shift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }

.border-beam { position: relative; border-radius: var(--radius-lg,8px); overflow: hidden; }
.border-beam::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 2px;
  background: conic-gradient(from var(--beam-angle,0deg), transparent 0deg, #FBBF24 60deg, #D97706 120deg, transparent 180deg);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  animation: beam-rotate 3s linear infinite;
}
@property --beam-angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@keyframes beam-rotate { to { --beam-angle: 360deg; } }