.neon-border {
  box-shadow: 0 0 0 1px rgba(255, 165, 0, 0.06) inset,
    0 6px 30px rgba(0, 0, 0, 0.7), 0 0 18px rgba(255, 140, 0, 0.06);
}

/* Hanya untuk desktop */
@media (min-width: 1024px) {
  img[src*="AnimasiGif.gif"] {
    width: 28rem; /* lebih pas di desktop */
    height: 28rem;
  }
}

/* Sinar kuning halus untuk GIF Tygo */
img[src*="AnimasiGif.gif"] {
  filter: drop-shadow(
    0 0 10px rgba(250, 204, 21, 0.5)
  ); /* lebih luas tapi tetap lembut */
}

/* beda */
.gold-glow {
  box-shadow: 0 6px 30px rgba(251, 194, 7, 0.6), 0 0 26px rgba(243, 159, 3, 1),
    0 0 8px rgba(255, 180, 5, 1) inset;
}

/* image frame outline glow */
.image-frame {
  border-radius: 18px;
  border: 3px solid rgba(255, 200, 0, 1);
  padding: 8px;
  background: linear-gradient(
    180deg,
    rgba(255, 140, 0, 0.02),
    rgba(0, 0, 0, 0.25)
  );
  box-shadow: 0 8px 40px rgba(213, 127, 14, 0.8),
    0 0 30px rgba(255, 140, 0, 0.06);
}

/* rounded inner border like screenshot */
.image-inner {
  border-radius: 14px;
  overflow: hidden;
  border: 2px solid rgba(255, 160, 40, 0.14);
  position: relative;
  background: linear-gradient(180deg, #0b0b0b, #070707);
}

/* thin label at bottom of image */
.image-label {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  background: rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(255, 140, 0, 0.08);
  color: #e6cc9b;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  padding: 6px 10px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  /* ➜ TENGAHKAN HORIZONTAL */
  text-align: center;
  /* ➜ TENGAHKAN TEKS */
  gap: 8px;
}

/* small tiger at bottom-left (floating) */
.corner-mascot {
  position: absolute;
  left: -12px;
  bottom: -12px;
  width: 100px;
  transform: translate(-8px, 18px);
  filter: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.6));
}

/* buttons style */
.btn-ghost {
  border-radius: 9999px;
  padding: 10px 22px;
  border: 2px solid rgba(255, 160, 40, 0.12);
  background: linear-gradient(
    180deg,
    rgba(255, 160, 40, 0.02),
    rgba(0, 0, 0, 0.25)
  );
  color: var(--gold-2);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6), 0 0 30px rgba(255, 140, 0, 0.06);
}

.btn-ghost:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7), 0 0 36px rgba(255, 160, 40, 0.14);
}

/* title style with luckiest guy like look */
.blueprint-title {
  font-family: "Luckiest Guy", sans-serif;
  color: var(--gold-2);
  font-size: clamp(22px, 4vw, 44px);
  line-height: 1;
  text-shadow: 0 6px 30px rgba(0, 0, 0, 0.7), 0 0 18px rgba(255, 150, 0, 0.08);
}

.subtle {
  color: #bfb7a1;
  opacity: 0.95;
  font-size: 13px;
}

/* small rounded badge */
.badge {
  background: linear-gradient(90deg, #111, #222);
  border-radius: 9999px;
  padding: 6px 12px;
  border: 1px solid rgba(255, 160, 40, 0.08);
  color: #f2e3c2;
  font-weight: 700;
  font-size: 12px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.6);
}

/* right column card info */
.info-card {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.02),
    rgba(0, 0, 0, 0.35)
  );
  border-radius: 10px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 140, 0, 0.06);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7),
    0 0 20px rgba(255, 140, 0, 0.03) inset;
}

/* small icon box */
.pdf-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    180deg,
    rgba(255, 160, 40, 0.08),
    rgba(0, 0, 0, 0.25)
  );
  border: 1px solid rgba(255, 160, 40, 0.08);
  color: var(--gold-2);
  font-weight: 800;
}

/* file input disguised */
.file-input {
  position: absolute;
  right: 12px;
  bottom: 12px;
  opacity: 0;
  width: 36px;
  height: 36px;
  cursor: pointer;
}

@media (max-width: 900px) {
  .corner-mascot {
    display: none;
  }
}

/* BUTTON NEXT & PREV — BULAT + GOLD PREMIUM */
.swiper-button-next,
.swiper-button-prev {
  width: 50px !important;
  height: 50px !important;
  border-radius: 50% !important;

  background: linear-gradient(
    135deg,
    rgba(20, 20, 20, 0.8),
    rgba(0, 0, 0, 0.9)
  );
  /* border: 2px solid #ffd700; GOLD */

  display: flex;
  justify-content: center;
  align-items: center;
  backdrop-filter: blur(3px);
  transition: 0.3s ease;
}

/* ICON GOLD TERANG - TEBAL */
.swiper-button-next::after,
.swiper-button-prev::after {
  content: none !important; /* menghapus panah default */
}

/* HOVER: LEBIH GLOWING + BESAR */
.swiper-button-next:hover,
.swiper-button-prev:hover {
  background: linear-gradient(135deg, rgba(30, 30, 30, 0.95), rgba(0, 0, 0, 1));
  box-shadow: 0 0 12px rgba(255, 230, 100, 0.8), 0 0 30px rgba(255, 215, 0, 0.9),
    0 0 45px rgba(255, 200, 0, 0.6);
}

/* Efek zoom untuk semua kontainer gambar */
.zoom-hover {
  transition: transform 0.3s ease; /* transisi smooth */
}

.zoom-hover:hover {
  transform: scale(1.05); /* zoom 105% saat hover */
}

.footer-link {
  @apply opacity-80 hover:opacity-100 transition-all duration-500 
         ease-[cubic-bezier(.25,.1,.25,1)]
         hover:text-white hover:drop-shadow-[0_0_4px_rgba(255,255,255,0.28)];
  font-family: "Luckiest Guy", sans-serif;
}

.divider {
  @apply opacity-60;
}

/* Sticky Tiger GIF agar selalu menempel tepat di atas ticker */
.stickyTiger {
  position: sticky;
  bottom: calc(100% + 0px); /* menempel tepat di atas ticker */
  left: 5%;
}

/* If you can't edit global CSS, convert these to Tailwind classes inline */
.icon {
  width: 22px; /* same as w-5 h-5 ~ 20-22px */
  height: 22px;
  min-width: 22px; /* prevent shrink on small screens */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1; /* normalize emoji baseline */
}

/* Optional tiny nudge for iOS emoji — remove if unnecessary */
@media (max-width: 768px) {
  .icon {
    transform: translateY(-1px);
  } /* small upward nudge for iPhone if emoji sit lower */
}

/* Ensure images inside .icon don't get extra whitespace */
.icon img,
.icon > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Collapse Default State */
.collapse-body {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.5s ease;
}

/* Saat Dibuka */
.collapse-body.open {
  max-height: 1500px;
  /* harus lebih besar dari tinggi konten */
  opacity: 1;
}

/* Arrow rotate animation */
.toggle-btn svg {
  transition: transform 0.4s ease;
}

.toggle-btn.open svg {
  transform: rotate(180deg);
}

picture img {
  will-change: transform;
}

/* jarak konten heaader paling bawah */
/* Tambah jarak bawah icon untuk mobile */
@media (max-width: 640px) {
  .hero-right .flex.justify-center.gap-4 {
    margin-bottom: 1.8rem !important; /* kamu bisa ubah angka ini */
  }
}

/* Extra kecil (≤480px) */
@media (max-width: 480px) {
  .hero-right .flex.justify-center.gap-4 {
    margin-bottom: 2.2rem !important;
  }
}

/* Super kecil (≤380px) */
@media (max-width: 380px) {
  .hero-right .flex.justify-center.gap-4 {
    margin-bottom: 2.6rem !important;
  }
}

/* button buy */
@keyframes pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
}

.pulse-img {
  animation: pulse 1.5s ease-in-out infinite;
}

button:hover .pulse-img {
  animation-play-state: paused; /* berhenti saat hover */
}

/* full tanpa melewati batas */
html,
body {
  overflow-x: hidden;
}

/*  */
@keyframes ultraUniqueFloat {
  0% {
    transform: translate(0, 0) rotate(0deg) scale(1);
  }
  15% {
    transform: translate(-5px, -10px) rotate(-1.5deg) scale(1.025);
  }
  35% {
    transform: translate(5px, -15px) rotate(1deg) scale(1.045);
  }
  55% {
    transform: translate(-7px, -5px) rotate(-2deg) scale(1.02);
  }
  75% {
    transform: translate(7px, -3px) rotate(1deg) scale(1.03);
  }
  100% {
    transform: translate(0, 0) rotate(0deg) scale(1);
  }
}

.unique-float {
  animation: ultraUniqueFloat 1.7s cubic-bezier(0.33, 0, 0.67, 1) infinite;
  transform-origin: center;
  will-change: transform;
}