@charset "UTF-8";
/* ========================================
   Floating boobs — Custom Styles
   Warm Ink: dark + cream + gold aesthetic
   ======================================== */
/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* ---- Scroll reveal system ---- */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-reveal=left] {
  transform: translateX(-24px);
}

[data-reveal=right] {
  transform: translateX(24px);
}

[data-reveal=scale] {
  transform: scale(0.95);
}

[data-reveal].revealed {
  opacity: 1;
  transform: translateY(0) translateX(0) scale(1);
}

/* ---- Header ---- */
#site-header {
  transition: background-color 0.4s ease, backdrop-filter 0.4s ease, border-color 0.3s ease;
}

#site-header.header-scrolled {
  background-color: rgba(26, 22, 18, 0.95) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* ---- Buttons ---- */
.btn-gold {
  @apply inline-flex items-center justify-center gap-2
         bg-gold text-ink font-body font-semibold
         px-7 py-3.5 text-sm tracking-wider uppercase
         transition-all duration-300;
  letter-spacing: 0.08em;
}

.btn-gold:hover {
  @apply bg-gold-light;
  transform: translateY(-1px);
  box-shadow: 0 4px 20px rgba(196, 164, 122, 0.3);
}

.btn-outline {
  @apply inline-flex items-center justify-center gap-2
         border border-gold/40 text-gold font-body font-semibold
         px-7 py-3.5 text-sm tracking-wider uppercase
         transition-all duration-300;
  letter-spacing: 0.08em;
}

.btn-outline:hover {
  @apply bg-gold text-ink border-gold;
}

.btn-outline-light {
  @apply inline-flex items-center justify-center gap-2
         border border-cream/30 text-cream font-body font-semibold
         px-7 py-3.5 text-sm tracking-wider uppercase
         transition-all duration-300;
  letter-spacing: 0.08em;
}

.btn-outline-light:hover {
  @apply bg-cream text-ink;
}

/* ---- Gold decorative line ---- */
.gold-line {
  display: block;
  width: 48px;
  height: 1px;
  background-color: #c4a47a;
}

.gold-line-long {
  display: block;
  width: 80px;
  height: 1px;
  background-color: #c4a47a;
}

/* ---- Horizontal scroll gallery ---- */
.flash-gallery {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 1rem;
}

.flash-gallery::-webkit-scrollbar {
  display: none;
}

.flash-gallery-item {
  flex: 0 0 280px;
  scroll-snap-align: start;
  transition: transform 0.3s ease;
}

.flash-gallery-item:hover {
  transform: translateY(-4px);
}

@media (min-width: 768px) {
  .flash-gallery-item {
    flex: 0 0 320px;
  }
}
/* ---- FAQ accordion ---- */
[data-faq-content] {
  transition: max-height 0.3s ease;
}

/* ---- Noise texture overlay ---- */
.noise-overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.03;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-size: 256px 256px;
  pointer-events: none;
  z-index: 1;
}

/* ---- Dot pattern ---- */
.dot-pattern {
  background-image: radial-gradient(circle, #c4a47a 0.5px, transparent 0.5px);
  background-size: 24px 24px;
}

/* ---- Form inputs ---- */
.form-input {
  @apply w-full px-5 py-3.5 bg-transparent border border-warm-gray/30
         text-ink font-body
         focus:border-gold focus:ring-0 outline-none
         transition-colors duration-300;
}

/* ---- Selection color ---- */
::selection {
  background-color: #c4a47a;
  color: #1a1612;
}

/*# sourceMappingURL=main.css.map */