/* ===== Zero One — Enhanced Animations ===== */

@keyframes kenBurns {
  0% { transform: scale(1); }
  100% { transform: scale(1.08); }
}

@keyframes shimmerSlide {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

@keyframes glowPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,.2); }
  50% { box-shadow: 0 0 24px 4px rgba(255,255,255,.15); }
}

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

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

@keyframes borderRotate {
  0% { --angle: 0deg; }
  100% { --angle: 360deg; }
}

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

@keyframes ripple {
  0% { transform: scale(1); opacity: .4; }
  100% { transform: scale(1.6); opacity: 0; }
}

@keyframes titleUnderline {
  from { width: 0; }
  to { width: 48px; }
}

@keyframes whatsappPulse {
  0% { box-shadow: 0 0 0 0 rgba(37,211,102,.5); }
  70% { box-shadow: 0 0 0 16px rgba(37,211,102,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}

@keyframes heroTextIn {
  from { opacity: 0; transform: translateY(30px); filter: blur(4px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

@keyframes cardShine {
  0% { left: -100%; }
  100% { left: 200%; }
}

/* Stagger delays */
.stagger-1 { animation-delay: .08s; }
.stagger-2 { animation-delay: .16s; }
.stagger-3 { animation-delay: .24s; }
.stagger-4 { animation-delay: .32s; }
.stagger-5 { animation-delay: .4s; }
.stagger-6 { animation-delay: .48s; }

.reveal-stagger {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1);
}

.reveal-stagger.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Logo accent */
.logo-accent {
  font-weight: 600;
  opacity: .85;
  letter-spacing: 1px;
}

.logo-z {
  transition: transform .4s cubic-bezier(.34,1.56,.64,1);
}

.logo-zero:hover .logo-z {
  transform: rotate(-8deg) scale(1.08);
}

/* Hero enhancements */
.hero-slide-bg {
  animation: kenBurns 12s ease-in-out infinite alternate;
}

.hero-slide-content > * {
  animation: heroTextIn .8s cubic-bezier(.22,1,.36,1) both;
}

.hero-slide-content .hero-slide-badge { animation-delay: .1s; }
.hero-slide-content h2 { animation-delay: .2s; }
.hero-slide-content .hero-slide-sub { animation-delay: .35s; }
.hero-slide-content .hero-slide-products { animation-delay: .5s; }
.hero-slide-content .btn-live { animation-delay: .65s; }

.btn-live {
  position: relative;
  overflow: hidden;
}

.btn-live::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent);
  transform: translateX(-100%);
  transition: transform .6s;
}

.btn-live:hover::after { transform: translateX(100%); }

.hero-arrow {
  transition: all .35s cubic-bezier(.34,1.56,.64,1);
}

.hero-arrow:hover {
  transform: translateY(-50%) scale(1.12);
  background: rgba(255,255,255,.22);
}

/* Beautiful containers — glass card base */
.glass-container {
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 28px;
  box-shadow:
    0 4px 24px rgba(0,0,0,.06),
    0 1px 2px rgba(0,0,0,.04),
    inset 0 1px 0 rgba(255,255,255,.8);
}

/* Product cards — premium container */
.zero-product-card {
  position: relative;
}

.zero-product-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 20px;
  padding: 1px;
  background: linear-gradient(135deg, var(--zg-1), var(--zg-2), var(--zg-3));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity .4s;
  pointer-events: none;
  z-index: 5;
}

.zero-product-card:hover {
  transform: translateY(-8px);
  box-shadow:
    0 24px 56px -16px rgba(124, 58, 237, 0.28),
    0 4px 12px rgba(0, 0, 0, 0.06);
}

.zero-product-card:hover::before { opacity: 0; }

.zero-product-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px -8px rgba(0, 0, 0, 0.1);
}

.zero-product-image::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
  transition: left .7s;
  z-index: 4;
  pointer-events: none;
}

.zero-product-card:hover .zero-product-image::after { left: 150%; }

.btn-zero {
  position: relative;
  overflow: hidden;
  transition: all .35s cubic-bezier(.22,1,.36,1);
}

.btn-zero:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.2);
}

/* Category slider — gentle hover */
.category-slide {
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.category-slide-circle {
  transition: box-shadow 0.35s ease, transform 0.35s ease;
}

/* Lifestyle section — bento boxes */
.lifestyle-section {
  background: linear-gradient(180deg, #f8f8f8 0%, #f0f0f0 100%);
  padding: 64px 0;
}

.lifestyle-banner {
  border-radius: 32px;
  min-height: 520px;
  box-shadow:
    0 8px 32px rgba(0,0,0,.12),
    0 2px 8px rgba(0,0,0,.06);
  transition: transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s;
  overflow: hidden;
}

.lifestyle-banner:hover {
  transform: scale(1.01);
  box-shadow: 0 16px 48px rgba(0,0,0,.16);
}

.lifestyle-banner img {
  transition: transform 8s ease;
}

.lifestyle-banner:hover img { transform: scale(1.06); }

.lifestyle-banner-overlay {
  transition: background .4s;
}

.lifestyle-banner:hover .lifestyle-banner-overlay {
  background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.75) 100%);
}

.lifestyle-banner-overlay h3 {
  transition: transform .4s;
}

.lifestyle-banner:hover .lifestyle-banner-overlay h3 {
  transform: translateY(-4px);
}

.btn-read-more {
  backdrop-filter: blur(8px);
  transition: all .35s cubic-bezier(.22,1,.36,1);
}

.btn-read-more:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(255,255,255,.2);
}

/* Lifestyle cards — premium bento */
.lifestyle-card {
  border-radius: 28px;
  min-height: 248px;
  border: 1px solid rgba(0,0,0,.05);
  box-shadow:
    0 4px 20px rgba(0,0,0,.05),
    0 1px 3px rgba(0,0,0,.03);
  overflow: hidden;
  transition:
    transform .45s cubic-bezier(.22,1,.36,1),
    box-shadow .45s cubic-bezier(.22,1,.36,1);
}

.lifestyle-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  transition: left .6s;
  z-index: 2;
  pointer-events: none;
}

.lifestyle-card:hover::before { left: 150%; }

.lifestyle-card:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow:
    0 16px 48px rgba(0,0,0,.1),
    0 4px 12px rgba(0,0,0,.06);
}

.lifestyle-card-arrow {
  background: linear-gradient(135deg, #1e3a5f, #2d4a6f);
  transition: all .35s cubic-bezier(.34,1.56,.64,1);
  box-shadow: 0 4px 12px rgba(30,58,95,.3);
}

.lifestyle-card:hover .lifestyle-card-arrow {
  transform: translateX(6px) scale(1.1);
  box-shadow: 0 6px 20px rgba(30,58,95,.4);
}

.lifestyle-card img {
  transition: transform .5s cubic-bezier(.22,1,.36,1);
}

.lifestyle-card:hover img {
  transform: scale(1.12) translateY(-4px);
}

/* Featured launch cards */
.featured-launch-card {
  border-radius: 28px;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
  transition: all .45s cubic-bezier(.22,1,.36,1);
  overflow: hidden;
}

.featured-launch-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 60px rgba(0,0,0,.12);
}

.featured-launch-image {
  position: relative;
  overflow: hidden;
}

.featured-launch-image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.08) 0%, transparent 70%);
  opacity: 0;
  transition: opacity .4s;
}

.featured-launch-card:hover .featured-launch-image::after { opacity: 1; }

.featured-launch-image img {
  transition: transform .6s cubic-bezier(.22,1,.36,1);
}

.featured-launch-card:hover .featured-launch-image img {
  transform: scale(1.1);
}

.featured-launch-tags span {
  transition: all .3s;
}

.featured-launch-card:hover .featured-launch-tags span {
  background: var(--black);
  color: var(--white);
}

/* Section titles animated */
.section-zero-title {
  position: relative;
  display: inline-block;
}

.section-zero-title::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  height: 3px;
  width: 0;
  background: var(--black);
  border-radius: 2px;
  transition: width .6s cubic-bezier(.22,1,.36,1);
}

.reveal.visible .section-zero-title::after,
.section-zero-header:hover .section-zero-title::after {
  width: 48px;
}

/* Trust carousel animated */
.trust-carousel-item {
  transition: transform .4s;
}

.trust-carousel-item:hover {
  transform: translateY(-4px);
}

.trust-carousel-item h4 {
  transition: color .3s;
}

.trust-carousel-item:hover h4 { color: var(--black); }

/* Promise cards — glass containers */
.promise-card {
  border-radius: 24px;
  border: 1px solid rgba(0,0,0,.06);
  background: linear-gradient(135deg, #fff 0%, #fafafa 100%);
  box-shadow: 0 4px 20px rgba(0,0,0,.04);
  transition: all .4s cubic-bezier(.22,1,.36,1);
  position: relative;
  overflow: hidden;
}

.promise-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--black), #444, var(--black));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .5s cubic-bezier(.22,1,.36,1);
}

.promise-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(0,0,0,.08);
  border-color: rgba(0,0,0,.1);
}

.promise-card:hover::before { transform: scaleX(1); }

/* Tabs animation */
.tab-zero {
  position: relative;
}

.tab-zero::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 50%;
  width: 0;
  height: 2px;
  background: var(--black);
  transition: all .35s cubic-bezier(.22,1,.36,1);
  transform: translateX(-50%);
}

.tab-zero.active::after { width: 100%; }

/* WhatsApp pulse ring */
.whatsapp-float {
  animation: whatsappPulse 2.5s infinite;
}

.whatsapp-float::before {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid rgba(37,211,102,.4);
  animation: ripple 2s infinite;
}

/* Nav link underline slide */
.nav-zero a {
  position: relative;
}

.nav-zero a::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--white);
  transition: width .35s cubic-bezier(.22,1,.36,1);
}

.nav-zero a:hover::after,
.nav-zero a.active::after { width: 100%; }

/* Section backgrounds */
.section-zero:nth-child(even) {
  background: linear-gradient(180deg, #fafafa 0%, #fff 100%);
}

/* Sale badge pulse */
.zero-sale-badge {
  animation: glowPulse 2s ease-in-out infinite;
}

/* Cart drawer slide enhancement */
.cart-drawer {
  transition: right .4s cubic-bezier(.22,1,.36,1);
}

.cart-drawer-overlay {
  transition: opacity .4s, visibility .4s;
  backdrop-filter: blur(4px);
}

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