/* =============================================================================
   PAW-DECORATIONS.CSS — Decorative paw print elements
   Pet Transfer Bodrum — PREMIUM_CONCIERGE accent: #C8963E
   ============================================================================= */

/* ── Paw print SVG elements ─────────────────────────────── */
.paw-print {
  display: inline-block;
  color: var(--color-accent);
  opacity: 0.18;
  pointer-events: none;
  user-select: none;
}

/* ── Background paw decoration ──────────────────────────── */
.paw-bg {
  position: absolute;
  pointer-events: none;
  user-select: none;
  color: var(--color-accent);
  opacity: 0.06;
  z-index: 0;
}

/* Decorative section watermark */
.paw-watermark {
  position: absolute;
  right: -60px;
  top: 50%;
  transform: translateY(-50%) rotate(15deg);
  width: 280px;
  height: 280px;
  color: var(--color-accent);
  opacity: 0.04;
  pointer-events: none;
  z-index: 0;
}

/* ── Paw trail (animated, GSAP-driven) ──────────────────── */
.paw-trail-wrap {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}

.paw-trail-print {
  display: inline-block;
  color: var(--color-accent);
  opacity: 0; /* GSAP fades in */
  transform: rotate(-20deg);
}
.paw-trail-print:nth-child(odd)  { transform: rotate(-20deg) translateY(-4px); }
.paw-trail-print:nth-child(even) { transform: rotate(20deg)  translateY(4px);  }

/* ── Section divider paws ───────────────────────────────── */
.paw-divider {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 24px 0;
}
.paw-divider::before,
.paw-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--color-border);
  max-width: 120px;
}
.paw-divider-icon {
  color: var(--color-accent);
  opacity: 0.5;
  width: 20px;
  height: 20px;
}

/* ── Floating paw badge ─────────────────────────────────── */
.paw-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--color-accent-pale);
  border: 1px solid rgba(200,150,62,0.2);
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 600;
  font-family: var(--font-heading);
  color: var(--color-accent);
}
.paw-badge svg { width: 14px; height: 14px; }

/* ── Accent dot cluster ─────────────────────────────────── */
.dot-cluster {
  position: absolute;
  pointer-events: none;
  z-index: 0;
}
.dot-cluster circle { fill: var(--color-accent); opacity: 0.15; }

/* ── Paw icon in hero trust row ─────────────────────────── */
.hero-trust-item .paw-icon {
  color: var(--color-accent-light);
  opacity: 0.7;
  width: 18px;
  height: 18px;
  margin-bottom: 4px;
}

/* ── On dark backgrounds ────────────────────────────────── */
.section--dark .paw-bg,
.section--primary .paw-bg,
.section--primary-dark .paw-bg {
  color: var(--color-accent-light);
  opacity: 0.08;
}