/* TheRealMart — premium storefront extras (loaded after tailwind.css) */

::selection {
  background: #1B3C2C;
  color: #F6F2EA;
}

html {
  scroll-behavior: smooth;
}

/* Elegant thin scrollbar for horizontal product rails */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Reveal-on-scroll (paired with .reveal-visible via IntersectionObserver) */
.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
.reveal.reveal-visible {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* Underline sweep for nav links */
.link-sweep {
  position: relative;
}
.link-sweep::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.link-sweep:hover::after,
.link-sweep.active::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* Primary button sheen */
.btn-sheen {
  position: relative;
  overflow: hidden;
}
.btn-sheen::before {
  content: "";
  position: absolute;
  top: 0;
  left: -80%;
  width: 45%;
  height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.18), transparent);
  transform: skewX(-20deg);
  transition: left 0.6s ease;
}
.btn-sheen:hover::before { left: 130%; }

/* Testimonial marquee */
@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.review-track {
  display: flex;
  width: max-content;
  animation: marquee 45s linear infinite;
  will-change: transform;
}
.review-track:hover { animation-play-state: paused; }

/* Subtle top progress feel for cards */
.card-lift {
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.card-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px -18px rgba(27, 60, 44, 0.28);
}

/* Hero image slow zoom */
@keyframes slowZoom {
  from { transform: scale(1); }
  to   { transform: scale(1.07); }
}
.hero-zoom {
  animation: slowZoom 14s ease-in-out infinite alternate;
}
@media (prefers-reduced-motion: reduce) {
  .hero-zoom { animation: none; }
}

/* Hairline ornament divider */
.ornament {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
}
.ornament::before,
.ornament::after {
  content: "";
  width: 2.25rem;
  height: 1px;
  background: #C29D58;
  opacity: 0.7;
}

/* Form focus ring — consistent premium focus state */
input:focus, select:focus, textarea:focus {
  outline: none;
}

/* Product image hover */
.img-zoom { transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1); }
.group:hover .img-zoom { transform: scale(1.05); }

/* Add-to-cart success pulse */
@keyframes addedPop {
  0%   { transform: scale(1); }
  35%  { transform: scale(1.04); }
  100% { transform: scale(1); }
}
.btn-added { animation: addedPop 0.45s cubic-bezier(0.22, 1, 0.36, 1); }
@media (prefers-reduced-motion: reduce) {
  .btn-added { animation: none; }
}

/* Gentle float for ambient blobs / decorative elements */
@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-18px); }
}
.animate-float { animation: floatY 7s ease-in-out infinite; }
.animate-float-slow { animation: floatY 11s ease-in-out infinite; }
.animate-float-delay { animation: floatY 9s ease-in-out 1.6s infinite; }

/* Animated gradient text */
@keyframes gradientShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
.text-gradient {
  background: linear-gradient(90deg, #2c5e44, #8a6a2f, #2c5e44, #b08d4a);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: gradientShift 6s ease-in-out infinite;
}

/* Shop page backdrop — warm cream wash with a faint botanical dot texture */
.shop-texture {
  background:
    radial-gradient(circle, rgba(44, 94, 68, 0.05) 1px, transparent 1.5px),
    linear-gradient(180deg, #f3efe6 0%, #faf7f0 30%, #f3efe6 100%);
  background-size: 26px 26px, 100% 100%;
}

/* Horizontal product rails: right-edge fade hints that more content exists */
.rail-mask {
  -webkit-mask-image: linear-gradient(to right, #000 86%, rgba(0,0,0,0.15) 100%);
  mask-image: linear-gradient(to right, #000 86%, rgba(0,0,0,0.15) 100%);
}
@media (min-width: 768px) {
  .rail-mask {
    -webkit-mask-image: linear-gradient(to right, #000 94%, rgba(0,0,0,0.1) 100%);
    mask-image: linear-gradient(to right, #000 94%, rgba(0,0,0,0.1) 100%);
  }
}

/* Swipe hint chip — gentle nudge animation */
@keyframes swipeNudge {
  0%, 100% { transform: translateX(0); }
  50%      { transform: translateX(-6px); }
}
.swipe-hint {
  animation: swipeNudge 1.6s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .swipe-hint { animation: none; }
}