
html, body {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overscroll-behavior-x: none;
  touch-action: pan-y;
}

img, video, canvas {
  pointer-events: none;
  -webkit-user-drag: none;
  user-drag: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

body {
  font-family: 'Cormorant Garamond', serif;
  background: #000;
}

button, a, [role="button"] {
  outline: none;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Cinzel', serif;
  font-weight: 300;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.font-display {
  font-family: 'Cinzel', serif;
}

.sold-text {
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 700 !important;
}

.font-serif {
  font-family: 'Cormorant Garamond', serif;
}

.font-playfair {
  font-family: 'Playfair Display', serif;
}

@layer utilities {
  .bg-gradient-radial {
    background-image: radial-gradient(var(--tw-gradient-stops));
  }

  .animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  }
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

@keyframes pulse-full {
  0%, 100% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}

.animate-pulse-full {
  animation: pulse-full 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes text-glow-pulse {
  0%, 100% {
    text-shadow: 0 0 20px rgba(255, 215, 0, 0.9), 0 0 40px rgba(255, 200, 50, 0.6), 0 0 60px rgba(255, 180, 0, 0.3);
    opacity: 1;
  }
  50% {
    text-shadow: 0 0 12px rgba(255, 215, 0, 0.6), 0 0 24px rgba(255, 200, 50, 0.35), 0 0 36px rgba(255, 180, 0, 0.15);
    opacity: 0.8;
  }
}

.animate-text-glow-pulse {
  animation: text-glow-pulse 3s ease-in-out infinite;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translate(-50%, 12px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.94); }
  to { opacity: 1; transform: scale(1); }
}

.animate-fade-in {
  animation: fadeIn 0.4s ease forwards;
}

@keyframes text-glow {
  0%, 100% {
    text-shadow:
      0 0 8px rgba(255, 215, 0, 0.8),
      0 0 16px rgba(255, 215, 0, 0.6),
      0 0 24px rgba(255, 215, 0, 0.4);
    filter: brightness(1.2) drop-shadow(0 0 10px rgba(255, 215, 0, 0.7));
  }
  50% {
    text-shadow:
      0 0 12px rgba(255, 215, 0, 1),
      0 0 24px rgba(255, 215, 0, 0.8),
      0 0 36px rgba(255, 215, 0, 0.6);
    filter: brightness(1.4) drop-shadow(0 0 15px rgba(255, 215, 0, 0.9));
  }
}

@keyframes magic-flash-fade {
  0% {
    opacity: 1;
    filter: brightness(1) drop-shadow(0 0 8px rgba(255, 215, 0, 0.4));
  }
  20% {
    opacity: 0.95;
    filter: brightness(1.3) drop-shadow(0 0 20px rgba(255, 215, 0, 0.8));
  }
  40% {
    opacity: 0.7;
    filter: brightness(1.6) drop-shadow(0 0 30px rgba(255, 215, 0, 1));
  }
  60% {
    opacity: 0.4;
    filter: brightness(1.8) drop-shadow(0 0 25px rgba(255, 215, 0, 0.6));
  }
  80% {
    opacity: 0.15;
    filter: brightness(2) drop-shadow(0 0 15px rgba(255, 215, 0, 0.3));
  }
  100% {
    opacity: 0;
    filter: brightness(2.2) drop-shadow(0 0 5px rgba(255, 215, 0, 0));
  }
}

@keyframes magic-flash-appear {
  0% {
    opacity: 0;
    filter: brightness(2.2) drop-shadow(0 0 5px rgba(255, 215, 0, 0));
  }
  20% {
    opacity: 0.15;
    filter: brightness(2) drop-shadow(0 0 15px rgba(255, 215, 0, 0.3));
  }
  40% {
    opacity: 0.4;
    filter: brightness(1.8) drop-shadow(0 0 25px rgba(255, 215, 0, 0.6));
  }
  60% {
    opacity: 0.7;
    filter: brightness(1.6) drop-shadow(0 0 30px rgba(255, 215, 0, 1));
  }
  80% {
    opacity: 0.95;
    filter: brightness(1.3) drop-shadow(0 0 20px rgba(255, 215, 0, 0.8));
  }
  100% {
    opacity: 1;
    filter: brightness(1) drop-shadow(0 0 8px rgba(255, 215, 0, 0.4));
  }
}

.nav-magic-fade-out {
  animation: magic-flash-fade 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.nav-magic-fade-in {
  animation: magic-flash-appear 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.animate-text-glow {
  animation: text-glow 2s ease-in-out infinite;
}


input[type="range"].slider {
  -webkit-appearance: none;
  appearance: none;
}

input[type="range"].slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #1f2937;
  cursor: pointer;
  transition: all 0.2s;
}

input[type="range"].slider::-webkit-slider-thumb:hover {
  background: #111827;
  transform: scale(1.2);
}

input[type="range"].slider::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #1f2937;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
}

input[type="range"].slider::-moz-range-thumb:hover {
  background: #111827;
  transform: scale(1.2);
}

@keyframes logo-glow-pulse-fade {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.15;
    transform: scale(1.1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes logo-glow-sword-pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
  100% {
    opacity: 1;
  }
}

.logo-glow-container .logo-glow-sword {
  transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}

.logo-glow-container:hover .logo-glow-sword {
  animation: logo-glow-pulse-fade 1.5s ease-in-out infinite;
}

.logo-glow-sword-always {
  animation: logo-glow-sword-pulse 2s ease-in-out infinite;
}

@keyframes logoDotPulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
    box-shadow:
      0 0 2px 2px rgba(255, 255, 255, 0.11),
      0 0 5px 5px rgba(57, 234, 31, 0.12),
      0 0 7px 6px rgba(45, 200, 24, 0.11),
      0 0 10px 7px rgba(35, 170, 18, 0.088),
      0 0 15px 9px rgba(25, 140, 13, 0.063),
      0 0 21px 10px rgba(15, 110, 8, 0.038);
    filter: brightness(1.05);
  }
  50% {
    opacity: 1;
    transform: scale(1.2);
    box-shadow:
      0 0 3px 3px rgba(255, 255, 255, 0.125),
      0 0 8px 7px rgba(57, 234, 31, 0.125),
      0 0 13px 10px rgba(50, 210, 27, 0.113),
      0 0 18px 13px rgba(42, 185, 22, 0.1),
      0 0 26px 16px rgba(33, 155, 17, 0.075),
      0 0 34px 20px rgba(22, 120, 11, 0.05);
    filter: brightness(1.2);
  }
}

@keyframes logoDotPulseHover {
  0%, 100% {
    opacity: 1;
    transform: scale(1.15);
    box-shadow:
      0 0 3px 3px rgba(255, 255, 255, 0.25),
      0 0 7px 6px rgba(57, 234, 31, 0.35),
      0 0 12px 9px rgba(57, 234, 31, 0.25),
      0 0 18px 13px rgba(45, 200, 24, 0.175),
      0 0 27px 18px rgba(35, 170, 18, 0.1),
      0 0 38px 23px rgba(25, 140, 13, 0.05);
    filter: brightness(1.25);
  }
  50% {
    opacity: 1;
    transform: scale(1.5);
    box-shadow:
      0 0 4px 4px rgba(255, 255, 255, 0.325),
      0 0 10px 9px rgba(57, 234, 31, 0.45),
      0 0 16px 13px rgba(57, 234, 31, 0.35),
      0 0 26px 19px rgba(45, 200, 24, 0.25),
      0 0 37px 25px rgba(35, 170, 18, 0.15),
      0 0 50px 33px rgba(25, 140, 13, 0.075);
    filter: brightness(1.6);
  }
}


.golden-button {
  position: relative;
  overflow: hidden;
}

.golden-button::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 215, 0, 0.3);
  transform: translate(-50%, -50%);
  transition: width 0.6s ease, height 0.6s ease;
}

.golden-button:hover::before {
  width: 300px;
  height: 300px;
}

.golden-button:hover {
  box-shadow: 0 0 20px rgba(255, 215, 0, 0.5),
              0 0 40px rgba(255, 215, 0, 0.3),
              0 10px 30px rgba(0, 0, 0, 0.3) !important;
  border-color: rgb(255, 230, 100) !important;
  filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.4));
  transform: translateY(-2px);
}

.golden-button:active {
  transform: translateY(0) scale(0.98);
}

.premium-logo-container {
  position: relative;
}

@keyframes logo-ray-pulse {
  0%, 100% {
    opacity: 0.5;
    transform: scaleY(1);
  }
  50% {
    opacity: 0.8;
    transform: scaleY(1.1);
  }
}

.logo-ray {
  transform-origin: top center;
  animation: logo-ray-pulse 3s ease-in-out infinite;
}

@keyframes logo-glow-breathe {
  0%, 100% {
    opacity: 0.75;
    transform: translate(-50%, -48%) scale(1);
  }
  50% {
    opacity: 1;
    transform: translate(-50%, -48%) scale(1.04);
  }
}

@keyframes logo-glow-breathe-core {
  0%, 100% {
    opacity: 0.8;
    transform: translate(-50%, -48%) scaleY(1);
  }
  50% {
    opacity: 1;
    transform: translate(-50%, -48%) scaleY(1.03);
  }
}

@keyframes logo-tekst-gold-pulse {
  0%, 100% {
    filter:
      drop-shadow(0 0 3px rgba(255,200,50,0.9))
      drop-shadow(0 0 8px rgba(255,175,20,0.7))
      drop-shadow(0 0 18px rgba(220,140,0,0.45))
      brightness(1.1);
    opacity: 0.92;
  }
  50% {
    filter:
      drop-shadow(0 0 5px rgba(255,215,60,1))
      drop-shadow(0 0 14px rgba(255,185,30,0.85))
      drop-shadow(0 0 32px rgba(220,150,0,0.6))
      drop-shadow(0 0 50px rgba(180,110,0,0.3))
      brightness(1.22);
    opacity: 1;
  }
}

@keyframes logo3-neon-pulse {
  0%, 100% {
    filter:
      drop-shadow(0 0 3px rgba(57,234,31,0.45))
      drop-shadow(0 0 7px rgba(57,234,31,0.2))
      brightness(1.04);
    opacity: 0.85;
  }
  50% {
    filter:
      drop-shadow(0 0 4px rgba(57,234,31,0.55))
      drop-shadow(0 0 10px rgba(57,234,31,0.25))
      brightness(1.07);
    opacity: 1;
  }
}

@keyframes sword-magic-pulse {
  0% {
    filter:
      drop-shadow(0 0 4px rgba(80,255,50,0.98))
      drop-shadow(0 0 10px rgba(57,234,31,0.8))
      drop-shadow(0 0 20px rgba(57,234,31,0.4))
      brightness(1.18);
    opacity: 1;
  }
  40% {
    filter:
      drop-shadow(0 0 6px rgba(120,255,80,1))
      drop-shadow(0 0 14px rgba(57,234,31,0.9))
      drop-shadow(0 0 26px rgba(57,234,31,0.5))
      brightness(1.26);
    opacity: 1;
  }
  70% {
    filter:
      drop-shadow(0 0 3px rgba(57,234,31,0.9))
      drop-shadow(0 0 9px rgba(57,234,31,0.65))
      drop-shadow(0 0 18px rgba(57,234,31,0.32))
      brightness(1.12);
    opacity: 0.95;
  }
  100% {
    filter:
      drop-shadow(0 0 4px rgba(80,255,50,0.98))
      drop-shadow(0 0 10px rgba(57,234,31,0.8))
      drop-shadow(0 0 20px rgba(57,234,31,0.4))
      brightness(1.18);
    opacity: 1;
  }
}

@keyframes stone-emerald-pulse {
  0% {
    filter:
      drop-shadow(0 0 10px rgba(0,255,90,1))
      drop-shadow(0 0 26px rgba(0,230,80,1))
      drop-shadow(0 0 55px rgba(0,185,60,0.9))
      drop-shadow(0 0 110px rgba(0,145,45,0.65))
      drop-shadow(0 0 180px rgba(0,110,38,0.35))
      brightness(2.2) saturate(3.5);
    opacity: 1;
  }
  30% {
    filter:
      drop-shadow(0 0 22px rgba(40,255,120,1))
      drop-shadow(0 0 52px rgba(0,250,100,1))
      drop-shadow(0 0 100px rgba(0,210,75,0.95))
      drop-shadow(0 0 180px rgba(0,165,58,0.72))
      drop-shadow(0 0 280px rgba(0,120,44,0.38))
      brightness(3.0) saturate(4.5);
    opacity: 1;
  }
  60% {
    filter:
      drop-shadow(0 0 14px rgba(20,255,100,1))
      drop-shadow(0 0 36px rgba(0,235,85,1))
      drop-shadow(0 0 72px rgba(0,195,65,0.9))
      drop-shadow(0 0 135px rgba(0,150,50,0.62))
      brightness(2.5) saturate(3.8);
    opacity: 1;
  }
  85% {
    filter:
      drop-shadow(0 0 24px rgba(60,255,140,1))
      drop-shadow(0 0 58px rgba(0,255,105,1))
      drop-shadow(0 0 110px rgba(0,215,75,0.95))
      drop-shadow(0 0 200px rgba(0,168,58,0.72))
      drop-shadow(0 0 310px rgba(0,125,44,0.35))
      brightness(3.2) saturate(4.8);
    opacity: 1;
  }
  100% {
    filter:
      drop-shadow(0 0 10px rgba(0,255,90,1))
      drop-shadow(0 0 26px rgba(0,230,80,1))
      drop-shadow(0 0 55px rgba(0,185,60,0.9))
      drop-shadow(0 0 110px rgba(0,145,45,0.65))
      drop-shadow(0 0 180px rgba(0,110,38,0.35))
      brightness(2.2) saturate(3.5);
    opacity: 1;
  }
}

@keyframes stone-elegant-leave {
  0% {
    filter:
      drop-shadow(0 0 10px rgba(20,255,100,1))
      drop-shadow(0 0 26px rgba(0,235,85,0.9))
      drop-shadow(0 0 55px rgba(0,195,65,0.7))
      drop-shadow(0 0 100px rgba(0,150,50,0.4))
      brightness(2.2) saturate(3.5);
    opacity: 1;
  }
  40% {
    filter:
      drop-shadow(0 0 5px rgba(20,255,100,0.5))
      drop-shadow(0 0 12px rgba(0,210,75,0.35))
      drop-shadow(0 0 22px rgba(0,170,55,0.2))
      brightness(1.4) saturate(1.8);
    opacity: 0.6;
  }
  100% {
    filter:
      brightness(1.0) saturate(1.0);
    opacity: 0;
  }
}

@keyframes stone-emerald-enter {
  0% {
    filter:
      drop-shadow(0 0 4px rgba(0,220,80,0.6))
      brightness(1.2) saturate(1.4);
    opacity: 0;
  }
  50% {
    filter:
      drop-shadow(0 0 26px rgba(40,255,120,1))
      drop-shadow(0 0 60px rgba(0,250,100,1))
      drop-shadow(0 0 120px rgba(0,210,75,0.95))
      drop-shadow(0 0 210px rgba(0,165,58,0.68))
      drop-shadow(0 0 320px rgba(0,125,44,0.35))
      brightness(3.2) saturate(4.8);
    opacity: 1;
  }
  100% {
    filter:
      drop-shadow(0 0 14px rgba(20,255,100,1))
      drop-shadow(0 0 36px rgba(0,235,85,1))
      drop-shadow(0 0 72px rgba(0,195,65,0.9))
      drop-shadow(0 0 135px rgba(0,150,50,0.62))
      drop-shadow(0 0 210px rgba(0,115,40,0.32))
      brightness(2.5) saturate(3.8);
    opacity: 1;
  }
}

@keyframes logo-cross-gold-pulse {
  0% {
    opacity: 0.8;
    filter: drop-shadow(0 0 5px rgba(255,230,80,0.95)) drop-shadow(0 0 12px rgba(255,195,40,0.8)) drop-shadow(0 0 26px rgba(220,150,0,0.5)) brightness(1.2);
  }
  40% {
    opacity: 1;
    filter: drop-shadow(0 0 7px rgba(255,248,120,1)) drop-shadow(0 0 18px rgba(255,210,55,0.95)) drop-shadow(0 0 38px rgba(230,160,0,0.65)) drop-shadow(0 0 60px rgba(190,110,0,0.35)) brightness(1.32);
  }
  75% {
    opacity: 0.88;
    filter: drop-shadow(0 0 5px rgba(255,225,70,0.9)) drop-shadow(0 0 13px rgba(255,190,38,0.75)) drop-shadow(0 0 28px rgba(215,145,0,0.48)) brightness(1.22);
  }
  100% {
    opacity: 0.8;
    filter: drop-shadow(0 0 5px rgba(255,230,80,0.95)) drop-shadow(0 0 12px rgba(255,195,40,0.8)) drop-shadow(0 0 26px rgba(220,150,0,0.5)) brightness(1.2);
  }
}

@keyframes cross-arm-gold-pulse {
  0% {
    opacity: 0.75;
    box-shadow:
      0 0 3px 1px rgba(255,248,200,0.5),
      0 0 8px 3px rgba(255,220,80,0.3);
  }
  30% {
    opacity: 1;
    box-shadow:
      0 0 5px 2px rgba(255,255,230,0.95),
      0 0 14px 6px rgba(255,235,120,0.8),
      0 0 32px 12px rgba(255,200,60,0.55),
      0 0 55px 20px rgba(255,165,20,0.3);
  }
  65% {
    opacity: 0.9;
    box-shadow:
      0 0 4px 1px rgba(255,250,210,0.7),
      0 0 10px 4px rgba(255,225,100,0.5),
      0 0 22px 8px rgba(255,195,50,0.32),
      0 0 42px 15px rgba(255,160,18,0.18);
  }
  100% {
    opacity: 0.75;
    box-shadow:
      0 0 3px 1px rgba(255,248,200,0.5),
      0 0 8px 3px rgba(255,220,80,0.3);
  }
}

@keyframes cross-orb-pulse {
  0%, 100% {
    transform: translate(-50%, 0) scale(1);
    opacity: 0.85;
    box-shadow: 0 0 10px 3px rgba(57,234,31,0.65);
  }
  50% {
    transform: translate(-50%, 0) scale(1.55);
    opacity: 1;
    box-shadow: 0 0 20px 8px rgba(57,234,31,0.9);
  }
}

@keyframes sword-ignite {
  0% {
    filter:
      drop-shadow(0 0 2px rgba(57,234,31,0.2))
      brightness(1.0);
    opacity: 0.3;
  }
  15% {
    filter:
      drop-shadow(0 0 4px rgba(57,234,31,0.7))
      drop-shadow(0 0 9px rgba(57,234,31,0.45))
      brightness(1.12);
    opacity: 0.75;
  }
  35% {
    filter:
      drop-shadow(0 0 8px rgba(120,255,80,1))
      drop-shadow(0 0 18px rgba(57,234,31,0.9))
      drop-shadow(0 0 30px rgba(57,234,31,0.5))
      brightness(1.5);
    opacity: 1;
  }
  55% {
    filter:
      drop-shadow(0 0 6px rgba(100,255,60,0.98))
      drop-shadow(0 0 14px rgba(57,234,31,0.82))
      drop-shadow(0 0 24px rgba(57,234,31,0.42))
      brightness(1.3);
    opacity: 1;
  }
  100% {
    filter:
      drop-shadow(0 0 4px rgba(80,255,50,0.98))
      drop-shadow(0 0 10px rgba(57,234,31,0.8))
      drop-shadow(0 0 20px rgba(57,234,31,0.4))
      brightness(1.18);
    opacity: 1;
  }
}

@keyframes sword-ignite-flicker {
  0%   { opacity: 0.28; transform: scaleY(1);    }
  8%   { opacity: 0.55; transform: scaleY(1.01);  }
  18%  { opacity: 0.82; transform: scaleY(0.99);  }
  28%  { opacity: 1;    transform: scaleY(1.015); }
  40%  { opacity: 0.93; transform: scaleY(0.998); }
  55%  { opacity: 1;    transform: scaleY(1.01);  }
  70%  { opacity: 0.97; transform: scaleY(1);     }
  85%  { opacity: 1;    transform: scaleY(1.005); }
  100% { opacity: 1;    transform: scaleY(1);     }
}

@keyframes sword-ignite-aura {
  0% {
    opacity: 0;
    background: radial-gradient(ellipse 30% 40% at 45% 75%, rgba(57,234,31,0.08) 0%, transparent 70%);
  }
  25% {
    opacity: 0.7;
    background: radial-gradient(ellipse 50% 60% at 45% 68%, rgba(57,234,31,0.22) 0%, rgba(30,200,10,0.1) 55%, transparent 80%);
  }
  55% {
    opacity: 1;
    background: radial-gradient(ellipse 70% 85% at 45% 60%, rgba(57,234,31,0.28) 0%, rgba(30,200,10,0.12) 50%, rgba(10,150,5,0.05) 75%, transparent 90%);
  }
  100% {
    opacity: 0.9;
    background: radial-gradient(ellipse 65% 80% at 45% 62%, rgba(57,234,31,0.22) 0%, rgba(30,200,10,0.09) 52%, transparent 80%);
  }
}

@keyframes cross-orb-pulse-side {
  0%, 100% {
    transform: translate(0, -50%) scale(1);
    opacity: 0.85;
    box-shadow: 0 0 10px 3px rgba(57,234,31,0.65);
  }
  50% {
    transform: translate(0, -50%) scale(1.55);
    opacity: 1;
    box-shadow: 0 0 20px 8px rgba(57,234,31,0.9);
  }
}

@keyframes cross-shaft-breathe {
  0%, 100% {
    opacity: 0.85;
  }
  50% {
    opacity: 1;
  }
}

@keyframes cross-center-pulse {
  0%, 100% {
    opacity: 0.8;
    transform: translate(-50%, -50%) scale(1);
  }
  50% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.4);
  }
}


@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

@keyframes shimmer {
  0% {
    background-position: -1000px 0;
  }
  100% {
    background-position: 1000px 0;
  }
}

.animate-fadeInUp {
  animation: fadeInUp 0.8s ease-out forwards;
}

.animate-fadeIn {
  animation: fadeIn 0.6s ease-out forwards;
}

.animate-scaleIn {
  animation: scaleIn 0.6s ease-out forwards;
}

.animate-slideInLeft {
  animation: slideInLeft 0.7s ease-out forwards;
}

.animate-slideInRight {
  animation: slideInRight 0.7s ease-out forwards;
}

@keyframes slideInDown {
  from {
    transform: translate(-50%, -200%);
    opacity: 0;
  }
  to {
    transform: translate(-50%, 0);
    opacity: 1;
  }
}

.delay-100 {
  animation-delay: 0.1s;
  opacity: 0;
}

.delay-200 {
  animation-delay: 0.2s;
  opacity: 0;
}

.delay-300 {
  animation-delay: 0.3s;
  opacity: 0;
}

.delay-400 {
  animation-delay: 0.4s;
  opacity: 0;
}

.delay-500 {
  animation-delay: 0.5s;
  opacity: 0;
}

.delay-600 {
  animation-delay: 0.6s;
  opacity: 0;
}

.hover-lift {
  transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1),
              box-shadow 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}

.hover-lift:hover {
  transform: translateY(-8px) scale(1.01);
  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.6),
              0 0 40px rgba(255, 215, 0, 0.08) !important;
}

.golden-shimmer {
  position: relative;
  overflow: hidden;
}

.golden-shimmer::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 230, 100, 0.3),
    transparent
  );
  animation: shimmer 3s infinite;
}

.smooth-shadow {
  transition: box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.image-zoom {
  transition: transform 1.2s cubic-bezier(0.19, 1, 0.22, 1),
              filter 0.8s ease;
}

.image-zoom:hover {
  transform: scale(1.03);
  filter: brightness(1.02) contrast(1.05);
}

.text-glow-hover {
  transition: text-shadow 0.3s ease, filter 0.3s ease;
}

.text-glow-hover:hover {
  text-shadow: 0 0 12px rgba(255, 215, 0, 0.6),
               0 0 24px rgba(255, 215, 0, 0.4) !important;
  filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.6)) !important;
}

@keyframes float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
}

.animate-float {
  animation: float 3s ease-in-out infinite;
}

.cursor-fancy {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpolygon points='4,2 4,20 9,15 13,22 15,21 11,14 18,14' fill='%23FFD700' stroke='%23C8960C' stroke-width='0.8' stroke-linejoin='round'/%3E%3C/svg%3E") 4 2, pointer;
  transition: all 0.2s ease;
}

.cursor-fancy:active {
  transform: scale(0.98);
}

@keyframes cursorGoldPulse {
  0%, 100% {
    opacity: 0.7;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.25);
  }
}

@keyframes gold-hover-glow-pulse {
  0%, 100% {
    filter: brightness(1.08)
      drop-shadow(0 0 4px rgba(255, 215, 0, 0.5))
      drop-shadow(0 0 10px rgba(255, 200, 50, 0.3))
      drop-shadow(0 0 20px rgba(212, 175, 55, 0.15));
  }
  50% {
    filter: brightness(1.2)
      drop-shadow(0 0 8px rgba(255, 235, 60, 0.85))
      drop-shadow(0 0 18px rgba(255, 210, 40, 0.55))
      drop-shadow(0 0 35px rgba(212, 175, 55, 0.3))
      drop-shadow(0 0 55px rgba(180, 140, 0, 0.15));
  }
}

.gold-hover-glow {
  animation: gold-hover-glow-pulse 1.5s ease-in-out infinite !important;
  transition: none !important;
}

@keyframes cursorArrowPulse {
  0%, 100% {
    filter: drop-shadow(0 0 3px rgba(212,175,55,0.7)) drop-shadow(0 0 6px rgba(212,175,55,0.4));
    transform: scale(1);
  }
  50% {
    filter: drop-shadow(0 0 7px rgba(255,215,0,1)) drop-shadow(0 0 14px rgba(212,175,55,0.7)) drop-shadow(0 0 22px rgba(212,175,55,0.4));
    transform: scale(1.08);
  }
}

@keyframes gradient-shift {
  0%, 100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

.animate-gradient {
  background-size: 200% 200%;
  animation: gradient-shift 4s ease infinite;
}

.backdrop-blur-custom {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.glass-effect {
  background: rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 215, 0, 0.1);
  transition: all 0.3s ease;
}

.glass-effect:hover {
  background: rgba(0, 0, 0, 0.3);
  border-color: rgba(255, 215, 0, 0.3);
  box-shadow: 0 8px 32px rgba(255, 215, 0, 0.15);
}

input[type="range"].slider-vertical {
  writing-mode: vertical-lr;
  direction: rtl;
}

input[type="range"].slider-vertical::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgb(255, 165, 0);
  cursor: pointer;
  transition: all 0.2s;
  box-shadow: 0 0 6px rgba(255, 165, 0, 0.8);
}

input[type="range"].slider-vertical::-webkit-slider-thumb:hover {
  background: rgb(255, 165, 0);
  transform: scale(1.2);
  box-shadow: 0 0 8px rgba(255, 165, 0, 0.8);
}

input[type="range"].slider-vertical::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgb(255, 165, 0);
  cursor: pointer;
  border: none;
  transition: all 0.2s;
  box-shadow: 0 0 6px rgba(255, 165, 0, 0.8);
}

input[type="range"].slider-vertical::-moz-range-thumb:hover {
  background: rgb(255, 165, 0);
  transform: scale(1.2);
  box-shadow: 0 0 8px rgba(255, 165, 0, 0.8);
}

@keyframes flash-overlay {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  40% {
    opacity: 1;
    transform: scale(1.05);
  }
  100% {
    opacity: 0;
    transform: scale(1.1);
  }
}

.animate-flash-overlay {
  animation: flash-overlay 0.5s ease-out;
}

.gallery-item {
  opacity: 1;
  filter: grayscale(0%);
  transition: opacity 1.5s cubic-bezier(0.4, 0, 0.2, 1),
              filter 1.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.gallery-grid:has(.gallery-item:hover) .gallery-item:not(:hover) .magic-hover-image {
  opacity: 0.5 !important;
  filter: grayscale(30%) !important;
}

.gallery-grid:has(.gallery-item:hover) .gallery-item:not(:hover) .magic-hover-text {
  opacity: 0.6 !important;
}

/* Volume slider container glow animation */
@keyframes volume-glow-pulse {
  0%, 100% {
    box-shadow:
      0 0 15px rgba(255, 215, 0, 0.4),
      0 0 30px rgba(255, 215, 0, 0.2),
      inset 0 0 15px rgba(255, 215, 0, 0.1);
  }
  50% {
    box-shadow:
      0 0 25px rgba(255, 215, 0, 0.6),
      0 0 50px rgba(255, 215, 0, 0.3),
      inset 0 0 25px rgba(255, 215, 0, 0.2);
  }
}

.volume-slider-container {
  animation: volume-glow-pulse 2s ease-in-out infinite;
}

/* Enhanced thumb with pulsing glow on hover and active states */
@keyframes thumb-glow-pulse {
  0%, 100% {
    box-shadow:
      0 0 8px rgba(255, 165, 0, 0.9),
      0 0 16px rgba(255, 140, 0, 0.6),
      0 0 24px rgba(255, 115, 0, 0.4);
  }
  50% {
    box-shadow:
      0 0 12px rgba(255, 165, 0, 1),
      0 0 24px rgba(255, 140, 0, 0.8),
      0 0 36px rgba(255, 115, 0, 0.6);
  }
}

input[type="range"].volume-slider-thumb::-webkit-slider-thumb:hover,
input[type="range"].volume-slider-thumb::-webkit-slider-thumb:active {
  animation: thumb-glow-pulse 1s ease-in-out infinite;
  transform: scale(1.3);
  background: rgb(255, 165, 0) !important;
}

input[type="range"].volume-slider-thumb::-moz-range-thumb:hover,
input[type="range"].volume-slider-thumb::-moz-range-thumb:active {
  animation: thumb-glow-pulse 1s ease-in-out infinite;
  transform: scale(1.3);
  background: rgb(255, 165, 0) !important;
}

/* Volume track styling */
input[type="range"].volume-slider-thumb {
  position: relative;
  background: transparent;
}

input[type="range"].volume-slider-thumb::-webkit-slider-runnable-track {
  background: rgba(55, 65, 81, 0.2);
  border-radius: 4px;
  height: 4px;
}

input[type="range"].volume-slider-thumb::-moz-range-track {
  background: rgba(55, 65, 81, 0.2);
  border-radius: 4px;
  height: 4px;
}


/* Accessibility: respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

@keyframes gold-idle-pulse {
  0%, 100% { opacity: 0.7; transform: translate(-50%, -50%) scale(1) rotate(0deg); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.15) rotate(18deg); }
}

@keyframes intro-logo-breathe {
  0%, 100% { opacity: 0.82; filter: drop-shadow(0 0 4px rgba(255,210,60,0.25)); }
  50% { opacity: 1; filter: drop-shadow(0 0 12px rgba(255,210,60,0.55)) drop-shadow(0 0 28px rgba(200,140,0,0.3)); }
}

@keyframes coming-soon-bg {
  0% { background-position: center 45%; transform: scale(1.04); }
  100% { background-position: center 55%; transform: scale(1.0); }
}


/* Glow trail effect - DISABLED */
.magic-glow-trail {
  display: none !important;
}

@keyframes glowFadeOut {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}

.magic-glow-fade {
  display: none !important;
}

/* Enhanced hover effects for elements */
.magic-hover-text {
  position: relative;
  transition: text-shadow 0.2s ease, filter 0.2s ease;
}

.magic-hover-button {
  position: relative;
  transition: box-shadow 0.2s ease, border-color 0.2s ease, filter 0.2s ease;
}

.magic-hover-image {
  position: relative;
  transition: box-shadow 0.2s ease, filter 0.2s ease;
}

/* Golden color for text and heading glows */
.magic-hover-text.glow-active {
  text-shadow:
    0 0 8px rgba(255, 235, 100, 0.9),
    0 0 18px rgba(255, 215, 0, 0.65),
    0 0 35px rgba(255, 200, 50, 0.4),
    0 0 55px rgba(212, 175, 55, 0.2) !important;
  filter: brightness(1.12) !important;
}

/* Enhanced glow for buttons */
.magic-hover-button.glow-active {
  box-shadow:
    0 0 20px rgba(255, 215, 0, 0.3),
    0 0 40px rgba(255, 215, 0, 0.2),
    0 0 60px rgba(255, 215, 0, 0.1),
    inset 0 0 20px rgba(255, 215, 0, 0.075) !important;
  border-color: rgba(255, 230, 100, 0.7) !important;
  filter: brightness(1.1) drop-shadow(0 0 15px rgba(255, 215, 0, 0.3)) !important;
}

.magic-hover-image.glow-active {
  filter: brightness(1.04) contrast(1.025) saturate(1.05) !important;
}

.magic-hover-image.glow-active-sold {
  filter: brightness(1.04) contrast(1.025) saturate(1.05) !important;
}

.magic-hover-text.glow-active-sold {
  color: rgb(180, 20, 20) !important;
  text-shadow:
    0 0 8px rgba(255, 80, 80, 0.9),
    0 0 18px rgba(220, 20, 20, 0.65),
    0 0 35px rgba(180, 0, 0, 0.4),
    0 0 55px rgba(139, 0, 0, 0.2) !important;
  filter: brightness(1.1) !important;
}

@keyframes pulse-glow {
  0%, 100% {
    filter: drop-shadow(0 0 30px rgba(220, 20, 20, 0.4)) drop-shadow(0 0 60px rgba(200, 0, 0, 0.3));
  }
  50% {
    filter: drop-shadow(0 0 50px rgba(255, 30, 30, 0.5)) drop-shadow(0 0 100px rgba(220, 0, 0, 0.4)) drop-shadow(0 0 150px rgba(180, 0, 0, 0.3));
  }
}

.animate-pulse-glow {
  animation: pulse-glow 2s ease-in-out infinite;
}


@keyframes legend-dot-gold-pulse {
  0%, 100% {
    box-shadow:
      0 0 4px 2px rgba(255, 210, 60, 0.25),
      0 0 10px 4px rgba(255, 190, 0, 0.15),
      0 0 18px 6px rgba(220, 160, 0, 0.08);
    filter: brightness(1.05);
  }
  50% {
    box-shadow:
      0 0 8px 3px rgba(255, 210, 60, 0.55),
      0 0 18px 7px rgba(255, 190, 0, 0.35),
      0 0 32px 10px rgba(220, 160, 0, 0.18);
    filter: brightness(1.25);
  }
}

@keyframes legend-dot-red-pulse {
  0%, 100% {
    box-shadow:
      0 0 4px 2px rgba(220, 20, 20, 0.4),
      0 0 10px 4px rgba(180, 0, 0, 0.25),
      0 0 18px 6px rgba(139, 0, 0, 0.12);
    filter: brightness(1.05);
  }
  50% {
    box-shadow:
      0 0 8px 3px rgba(220, 20, 20, 0.75),
      0 0 18px 7px rgba(180, 0, 0, 0.5),
      0 0 32px 10px rgba(139, 0, 0, 0.28);
    filter: brightness(1.3);
  }
}

.legend-dot-gold {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgb(255, 230, 100);
  animation: legend-dot-gold-pulse 1.62s ease-in-out infinite;
  flex-shrink: 0;
}

.legend-dot-red {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgb(220, 20, 20);
  animation: legend-dot-red-pulse 1.62s ease-in-out infinite;
  flex-shrink: 0;
}


@keyframes sold-sign-rise {
  from {
    transform: translate(-50%, 100%);
    opacity: 0;
  }
  to {
    transform: translate(-50%, -30%);
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    transform: translate(-50%, -60px);
    opacity: 0;
  }
  to {
    transform: translate(-50%, 0);
    opacity: 1;
  }
}

.animate-slideUp {
  animation: slideUp 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.sold-badge {
  animation: slideUp 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  transition: opacity 0.3s ease;
}

*:hover > .sold-badge,
.group:hover .sold-badge {
  opacity: 0 !important;
  animation-play-state: paused;
}

@keyframes lb-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.lb-img-enter {
  opacity: 1;
}

/* Scroll reveal animations */
.reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-32px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-left.revealed {
  opacity: 1;
  transform: translateX(0);
}

.reveal-right {
  opacity: 0;
  transform: translateX(32px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-right.revealed {
  opacity: 1;
  transform: translateX(0);
}

.reveal-scale {
  opacity: 0;
  transform: scale(0.94);
  transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1), transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-scale.revealed {
  opacity: 1;
  transform: scale(1);
}

/* Focus visible for keyboard navigation */
:focus-visible {
  outline: 2px solid rgba(255, 215, 0, 0.6);
  outline-offset: 3px;
}

.gallery-grid {
  max-width: 90rem;
  margin: 0 auto;
}

/* Refined text glow for luxury aesthetic */
.text-glow-luxury {
  text-shadow: 0 0 1px rgba(255, 230, 100, 0.15);
  transition: text-shadow 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.text-glow-luxury:hover {
  text-shadow: 0 0 2px rgba(255, 230, 100, 0.25);
}


