:root {
  --black: #080503;
  --brown: #1a0f08;
  --gold: #c9924e;
  --gold-light: #edc391;
  --cream: #f1ddc4;
  --carousel-gap: 18px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--black); }
body { margin: 0; background: var(--black); color: var(--cream); overflow-x: hidden; font-family: Georgia, 'Times New Roman', serif; }
main { width: 100%; overflow: clip; }

.media-section,
.offers,
.offer-media {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 0;
  background: var(--black);
}

.section-video {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  border: 0;
  object-fit: contain;
  background: var(--black);
}

.video-desktop,
.offer-desktop { display: none; }

.testimonials {
  position: relative;
  width: 100%;
  padding: clamp(54px, 10vw, 100px) clamp(22px, 5vw, 90px);
  background:
    radial-gradient(circle at 50% 5%, rgba(187, 126, 67, .28), transparent 42%),
    linear-gradient(180deg, #120b07 0%, #24140b 52%, #100906 100%);
  border: 0;
}

.testimonials::before,
.testimonials::after {
  content: '';
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(226, 175, 111, .7), transparent);
}
.testimonials::before { top: 0; }
.testimonials::after { bottom: 0; }

.testimonials h2 {
  max-width: 1100px;
  margin: 0 auto clamp(30px, 5vw, 58px);
  color: var(--gold-light);
  text-align: center;
  font-size: clamp(2rem, 6.5vw, 4.6rem);
  line-height: 1.02;
  letter-spacing: .02em;
  text-wrap: balance;
}

.carousel { position: relative; max-width: 1500px; margin: 0 auto; padding: 0 42px 42px; outline: none; }
.carousel-viewport { overflow: hidden; touch-action: pan-y; }
.carousel-track { display: flex; gap: var(--carousel-gap); transition: transform .55s cubic-bezier(.2,.8,.2,1); will-change: transform; }
.testimonial-card { flex: 0 0 100%; margin: 0; overflow: hidden; border: 1px solid rgba(227, 182, 124, .48); border-radius: 18px; background: #f8f4ee; box-shadow: 0 18px 45px rgba(0,0,0,.38); }
.testimonial-card img { display: block; width: 100%; height: clamp(430px, 122vw, 690px); object-fit: contain; background: #fff; }

.carousel-arrow {
  position: absolute;
  top: 46%;
  z-index: 2;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(237,195,145,.75);
  border-radius: 50%;
  background: rgba(12,7,4,.9);
  color: var(--gold-light);
  font-size: 1.55rem;
  cursor: pointer;
  transform: translateY(-50%);
}
.carousel-arrow:hover,
.carousel-arrow:focus-visible { background: var(--gold); color: #120a05; outline: 2px solid var(--cream); outline-offset: 2px; }
.carousel-prev { left: 0; }
.carousel-next { right: 0; }
.carousel-dots { display: flex; justify-content: center; gap: 10px; margin-top: 24px; }
.carousel-dot { width: 11px; height: 11px; padding: 0; border: 1px solid var(--gold-light); border-radius: 50%; background: transparent; cursor: pointer; }
.carousel-dot[aria-selected="true"] { background: var(--gold-light); }

.buy-button {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 13px 20px;
  border: 2px solid #f2d095;
  border-radius: 999px;
  background: linear-gradient(180deg, #d99d4c, #9a5a22);
  box-shadow: 0 8px 24px rgba(0,0,0,.46), inset 0 1px rgba(255,255,255,.35);
  color: #160c05;
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(.9rem, 3.9vw, 1.15rem);
  font-weight: 900;
  line-height: 1.05;
  text-align: center;
  text-decoration: none;
  letter-spacing: .02em;
}
.buy-button::after {
  content: '';
  position: absolute;
  z-index: 2;
  top: -45%;
  left: -45%;
  width: 24%;
  height: 190%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent);
  transform: skewX(-22deg) translateX(-260%);
  animation: button-reflection 3.4s ease-in-out infinite;
}
@keyframes button-reflection {
  0%, 52% { transform: skewX(-22deg) translateX(-260%); }
  78%, 100% { transform: skewX(-22deg) translateX(760%); }
}
.offer-mobile-panel + .offer-mobile-panel { margin-top: -1px; }
.buy-mobile { position: absolute; z-index: 3; left: 12%; width: 76%; }
.buy-mobile-1 { top: 54%; }
.buy-mobile-2 { top: 5%; }
.buy-mobile-3 { top: 54%; }

.whatsapp-float {
  position: fixed;
  z-index: 20;
  right: max(14px, env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 2px solid rgba(255,255,255,.92);
  border-radius: 50%;
  background: #25d366;
  color: #fff;
  box-shadow: 0 6px 18px rgba(0,0,0,.38);
  text-decoration: none;
  transition: opacity .2s ease, transform .2s ease, visibility .2s linear;
}
.whatsapp-float svg { width: 27px; height: 27px; display: block; }
.whatsapp-float.is-suppressed {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(12px);
}

@media (min-width: 768px) {
  .video-mobile,
  .offer-mobile { display: none; }
  .video-desktop,
  .offer-desktop { display: block; }

  .testimonial-card { flex-basis: calc((100% - (2 * var(--carousel-gap))) / 3); }
  .testimonial-card img { height: clamp(360px, 36vw, 560px); }
  .carousel { padding-inline: 64px; }
  .carousel-arrow { width: 52px; height: 52px; }

  .desktop-buy-buttons {
    position: absolute;
    z-index: 3;
    top: 51.5%;
    left: 8%;
    width: 84%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7%;
  }
  .desktop-buy-buttons .buy-button { min-height: 44px; padding: 8px 14px; font-size: clamp(.72rem, 1vw, 1rem); }
  .whatsapp-float { right: 24px; bottom: 24px; width: 54px; height: 54px; }
  .whatsapp-float svg { width: 30px; height: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .carousel-track { transition: none; }
  .buy-button::after { animation: none; }
  .whatsapp-float { transition: none; }
}
