/* BidVault — global hover & scroll effects */

html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .bv-reveal,
  .bv-reveal.bv-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Scroll progress */
#bv-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  height: 3px;
  width: 0;
  background: linear-gradient(90deg, #d4af37, #ecc53a, #f2ca50);
  pointer-events: none;
  transition: width 0.08s linear;
}

/* Header on scroll */
header.bv-header-scrolled {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
}

header.bv-header-scrolled > div:nth-child(2) {
  backdrop-filter: blur(10px);
}

/* Scroll reveal */
.bv-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition:
    opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.bv-reveal.bv-visible {
  opacity: 1;
  transform: translateY(0);
}

.bv-reveal-left {
  transform: translateX(-28px);
}

.bv-reveal-left.bv-visible {
  transform: translateX(0);
}

.bv-reveal-scale {
  transform: scale(0.96);
}

.bv-reveal-scale.bv-visible {
  transform: scale(1);
}

/* Stagger children */
.bv-stagger > .bv-reveal-child {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.bv-stagger.bv-visible > .bv-reveal-child {
  opacity: 1;
  transform: translateY(0);
}

/* Hero parallax target */
#hero-bg.bv-parallax {
  will-change: transform;
}

/* ——— Hover: header ——— */
header a[aria-label="BidVault home"] img {
  transition: transform 0.35s ease, filter 0.35s ease;
}

header a[aria-label="BidVault home"]:hover img {
  transform: scale(1.04);
  filter: brightness(1.08);
}

header .grid.h-9.w-9.place-items-center,
header a.grid.h-9.w-9.place-items-center {
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    background-color 0.25s ease,
    box-shadow 0.25s ease;
}

header .grid.h-9.w-9.place-items-center:hover,
header a.grid.h-9.w-9.place-items-center:hover {
  transform: translateY(-2px) scale(1.06);
  border-color: rgba(236, 197, 58, 0.85);
  box-shadow: 0 0 0 1px rgba(236, 197, 58, 0.25), 0 8px 20px rgba(0, 0, 0, 0.35);
}

nav.bg-gradient-to-r a,
nav[class*="from-[#F2CA50]"] a {
  position: relative;
  transition: opacity 0.25s ease, transform 0.25s ease;
}

nav.bg-gradient-to-r a:hover,
nav[class*="from-[#F2CA50]"] a:hover {
  opacity: 0.75;
  transform: translateY(-1px);
}

/* ——— Hover: cards & articles ——— */
main article.rounded-\[28px\],
main article.rounded-\[14px\],
main article.rounded-\[12px\],
.bv-card-hover {
  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s ease,
    border-color 0.35s ease;
}

main #live-auction-section article.rounded-\[28px\] {
  transition: none;
}

main article.rounded-\[28px\]:hover,
main article.rounded-\[14px\]:hover,
main article.rounded-\[12px\]:not(form):hover,
.bv-card-hover:hover {
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38);
}

main #live-auction-section article.rounded-\[28px\]:hover {
  box-shadow: none;
}

/* Image zoom in groups */
.group .relative.overflow-hidden img,
.group .relative.h-\[240px\] img,
section .relative.min-h-\[248px\] > img {
  transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.group:hover .relative.overflow-hidden img,
.group:hover .relative.h-\[240px\] img,
section .relative.min-h-\[248px\]:hover > img {
  transform: scale(1.08);
}

/* Feature / info tiles */
main .bg-gradient-to-b.from-\[\#0F131A\] {
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease;
}

main .bg-gradient-to-b.from-\[\#0F131A\]:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 36px rgba(0, 0, 0, 0.42);
}

/* How it works steps */
main .grid.h-\[106px\].w-\[106px\] {
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}

main .relative.text-center:hover .grid.h-\[106px\].w-\[106px\] {
  transform: scale(1.06);
  border-color: rgba(236, 197, 58, 0.45);
  box-shadow: 0 0 24px rgba(236, 197, 58, 0.12);
}

/* Buttons & CTAs */
a.bg-gold,
button.bg-gold,
a[class*="bg-gold"],
button[class*="bg-gold"],
a.rounded-\[15px\],
button.rounded-\[15px\] {
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background-color 0.25s ease,
    border-color 0.25s ease;
}

a.bg-gold:hover,
button.bg-gold:hover,
a[class*="hover:bg-gold"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(236, 197, 58, 0.28);
}

a.border-white:hover,
button.border-white:hover,
a[class*="border-white"]:hover {
  transform: translateY(-1px);
}

/* Carousel controls */
#auctionPrev,
#auctionNext,
#relatedPrev,
#relatedNext,
button[id$="Prev"],
button[id$="Next"] {
  transition: transform 0.25s ease, opacity 0.25s ease, background-color 0.25s ease;
}

#auctionPrev:hover,
#auctionNext:hover,
#relatedPrev:hover,
#relatedNext:hover,
button[id$="Prev"]:hover,
button[id$="Next"]:hover {
  transform: scale(1.12);
  opacity: 1;
}

/* Dashboard sidebar */
aside nav a {
  transition:
    color 0.25s ease,
    background-color 0.25s ease,
    transform 0.25s ease,
    padding-left 0.25s ease;
}

aside nav a:not(.rounded-full):hover {
  transform: translateX(4px);
}

/* Footer */
footer nav a,
footer a.transition {
  transition: color 0.25s ease, transform 0.25s ease, opacity 0.25s ease;
}

footer nav a:hover,
footer a.transition:hover {
  color: #ecc53a;
  transform: translateX(3px);
}

footer .opacity-60 {
  transition: opacity 0.25s ease, transform 0.25s ease;
}

footer .opacity-60:hover {
  transform: translateY(-2px);
}

/* Form inputs focus glow */
input:focus,
select:focus,
textarea:focus {
  box-shadow: 0 0 0 2px rgba(236, 197, 58, 0.18);
}

/* Horizontal scroll rows — momentum feel */
[id$="Cards"],
.overflow-x-auto {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}
