/* ========================================================
   GEBYOK PRADA BALI - Balinese Ornament Styles
   Used in WordPress Elementor via Custom CSS Classes
   ======================================================== */

/* ===== FRANGIPANI FLOATING ===== */
.gpb-frangipani {
  position: absolute;
  pointer-events: none;
  z-index: 1;
  opacity: .07;
  animation: gpb-float 8s ease-in-out infinite;
}
.gpb-frangipani.f1 { top: 10%; left: 3%; width: 120px; animation-delay: 0s; }
.gpb-frangipani.f2 { top: 60%; right: 2%; width: 90px; animation-delay: 2s; }
.gpb-frangipani.f3 { bottom: 8%; left: 8%; width: 80px; animation-delay: 4s; }
.gpb-frangipani.f4 { top: 25%; right: 6%; width: 100px; animation-delay: 1s; }

@keyframes gpb-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-18px); }
}

/* ===== CORNER ORNAMENTS ===== */
.gpb-corner {
  position: absolute;
  width: 140px;
  height: 140px;
  pointer-events: none;
  opacity: .08;
  z-index: 0;
}
.gpb-corner.tl { top: 0; left: 0; }
.gpb-corner.tr { top: 0; right: 0; transform: scaleX(-1); }
.gpb-corner.bl { bottom: 0; left: 0; transform: scaleY(-1); }
.gpb-corner.br { bottom: 0; right: 0; transform: scale(-1, -1); }

/* ===== SECTION ORNAMENT BORDER ===== */
.gpb-ornament-border {
  position: relative;
  overflow: hidden;
}
.gpb-ornament-border::before,
.gpb-ornament-border::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  max-width: 1000px;
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(212,175,55,.05) 10%,
    rgba(212,175,55,.3) 30%,
    #D4AF37 50%,
    rgba(212,175,55,.3) 70%,
    rgba(212,175,55,.05) 90%,
    transparent 100%
  );
  pointer-events: none;
  z-index: 1;
}
.gpb-ornament-border::before { top: 0; }
.gpb-ornament-border::after { bottom: 0; }

/* ===== MANDALA WATERMARK ===== */
.gpb-mandala-bg {
  position: absolute;
  pointer-events: none;
  z-index: 0;
  opacity: .03;
  width: 500px;
  height: 500px;
}
.gpb-mandala-bg.left {
  top: 50%; left: -100px;
  transform: translateY(-50%);
}
.gpb-mandala-bg.right {
  top: 50%; right: -100px;
  transform: translateY(-50%) scaleX(-1);
}

/* ===== ORNATE GOLD DIVIDER ===== */
.gpb-divider-ornate {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 20px auto 0;
  width: fit-content;
}
.gpb-divider-ornate .gpb-line {
  width: 60px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #D4AF37);
}
.gpb-divider-ornate .gpb-line:last-child {
  background: linear-gradient(90deg, #D4AF37, transparent);
}
.gpb-divider-ornate .gpb-lotus {
  width: 28px;
  height: 28px;
  opacity: .8;
}

/* ===== HERO SIDE ORNAMENTS ===== */
.gpb-hero-ornament-left,
.gpb-hero-ornament-right {
  position: absolute;
  top: 50%;
  width: 180px;
  pointer-events: none;
  opacity: .06;
  z-index: 1;
}
.gpb-hero-ornament-left {
  left: 20px;
  transform: translateY(-50%);
}
.gpb-hero-ornament-right {
  right: 20px;
  transform: translateY(-50%) scaleX(-1);
}

/* ===== SPARKLES ===== */
.gpb-sparkle {
  position: absolute;
  pointer-events: none;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #D4AF37;
  opacity: 0;
  animation: gpb-sparkle 3s ease-in-out infinite;
}
.gpb-sparkle:nth-child(1) { top: 15%; left: 10%; animation-delay: 0s; }
.gpb-sparkle:nth-child(2) { top: 30%; right: 15%; animation-delay: .8s; }
.gpb-sparkle:nth-child(3) { top: 70%; left: 20%; animation-delay: 1.6s; }
.gpb-sparkle:nth-child(4) { top: 55%; right: 8%; animation-delay: 2.4s; }
.gpb-sparkle:nth-child(5) { top: 85%; left: 40%; animation-delay: .4s; }
.gpb-sparkle:nth-child(6) { top: 20%; right: 30%; animation-delay: 1.2s; }

@keyframes gpb-sparkle {
  0%, 100% { opacity: 0; transform: scale(0); }
  50% { opacity: .5; transform: scale(1); }
}

/* ===== OM SYMBOL WATERMARK ===== */
.gpb-om-symbol {
  position: absolute;
  pointer-events: none;
  opacity: .03;
  font-size: 15rem;
  color: #D4AF37;
  font-family: serif;
  z-index: 0;
  animation: gpb-om-pulse 6s ease-in-out infinite;
}

@keyframes gpb-om-pulse {
  0%, 100% { opacity: .03; }
  50% { opacity: .06; }
}

/* ===== CARD CORNER ORNAMENTS ===== */
.gpb-card-corner {
  position: absolute;
  width: 50px;
  height: 50px;
  opacity: .15;
  pointer-events: none;
  z-index: 1;
}
.gpb-card-corner.tl { top: 8px; left: 8px; }
.gpb-card-corner.br { bottom: 8px; right: 8px; transform: rotate(180deg); }

/* ===== PATRA WAVE BORDER ===== */
.gpb-patra-wave {
  display: block;
  width: 100%;
  pointer-events: none;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  .gpb-hero-ornament-left,
  .gpb-hero-ornament-right { display: none; }
  .gpb-corner { width: 80px; height: 80px; }
  .gpb-mandala-bg { width: 300px; height: 300px; }
}
@media (max-width: 480px) {
  .gpb-frangipani { display: none; }
  .gpb-corner { width: 60px; height: 60px; }
}