/* Madison Jané — custom styles on top of Tailwind CDN.
   Palette tokens (match tailwind.config in index.html):
   ink #0C0C10 · dark #14141A · dark-soft #22222C · bone #F7F5F0 · warm #F1EDE4
   sand #E7E0D2 · accent #E8467C · accent-deep #C22B5F · accent-light #FF7AA5 · gold #F2C230 */

html { scroll-behavior: smooth; }
body { font-size: 16px; }

/* ---------- nav links ---------- */
.nav-link { position: relative; transition: color 160ms ease; }
.nav-link:hover { color: #C22B5F; }
.nav-link::after {
  content: ""; position: absolute; left: 0; bottom: -4px; height: 2px; width: 0;
  background: #E8467C; transition: width 200ms ease;
}
.nav-link:hover::after { width: 100%; }

.announce { transition: transform 300ms ease; }

/* ---------- hero mosaic (drifting gallery wall) ---------- */
.mosaic {
  position: absolute; inset: -6% -2%;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
  transform: rotate(-3deg) scale(1.06);
  filter: saturate(1.05);
}
.mosaic-col { display: flex; flex-direction: column; gap: 14px; will-change: transform; }
.mosaic-col img {
  width: 100%; aspect-ratio: 3/4; object-fit: cover;
  border-radius: 14px; opacity: 0.9;
}
.mosaic-col-0 { animation: drift-up 70s linear infinite; }
.mosaic-col-1 { animation: drift-down 85s linear infinite; }
.mosaic-col-2 { animation: drift-up 78s linear infinite; }
@keyframes drift-up   { from { transform: translateY(0); } to { transform: translateY(-50%); } }
@keyframes drift-down { from { transform: translateY(-50%); } to { transform: translateY(0); } }

/* ---------- hero copy entrance ---------- */
.hero-fade, .hero-line { opacity: 0; transform: translateY(18px); transition: opacity 700ms ease, transform 700ms cubic-bezier(.2,.7,.2,1); }
.hero-fade.is-in, .hero-line.is-in { opacity: 1; transform: translateY(0); }

/* ---------- scroll reveal ---------- */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity 700ms ease, transform 700ms cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* ---------- marquee ---------- */
.marquee { overflow: hidden; }
.marquee-track { animation: marquee 36s linear infinite; width: max-content; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- gallery ---------- */
.filter-chip {
  padding: 0.5rem 1rem; border-radius: 9999px; font-size: 0.85rem; font-weight: 500;
  border: 1px solid rgba(247, 245, 240, 0.25); color: rgba(247, 245, 240, 0.75);
  transition: all 180ms ease; background: transparent;
}
.filter-chip:hover { border-color: rgba(247, 245, 240, 0.6); color: #F7F5F0; }
.filter-chip.is-active { background: #E8467C; border-color: #E8467C; color: #F7F5F0; }

.gal-card { cursor: zoom-in; }
.gal-badge {
  position: absolute; top: 10px; left: 10px; z-index: 2;
  padding: 0.25rem 0.7rem; border-radius: 9999px;
  font-size: 0.7rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
}
.gal-badge-available { background: #F2C230; color: #0C0C10; }

/* SOLD — gallery red-dot energy: crimson pill, gold ring, slow gold shimmer */
.gal-badge-sold {
  position: absolute; overflow: hidden;
  background: #C22B5F; color: #F7F5F0;
  padding: 0.32rem 0.85rem; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.1em;
  transform: rotate(-4deg);
  animation: sold-glow 2.6s ease-in-out infinite;
}
.gal-badge-sold::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(115deg, transparent 32%, rgba(242, 194, 48, 0.55) 46%, rgba(247, 245, 240, 0.85) 50%, rgba(242, 194, 48, 0.55) 54%, transparent 68%);
  transform: translateX(-130%);
  animation: sold-shine 2.6s ease-in-out infinite;
}
@keyframes sold-shine {
  0% { transform: translateX(-130%); }
  55%, 100% { transform: translateX(130%); }
}
@keyframes sold-glow {
  0%, 100% { box-shadow: 0 0 0 1.5px #F2C230, 0 3px 10px rgba(194, 43, 95, 0.4); }
  50% { box-shadow: 0 0 0 1.5px #F2C230, 0 3px 20px rgba(242, 194, 48, 0.6); }
}

/* lightbox chips */
.lb-chip {
  display: inline-block; position: relative; overflow: hidden; vertical-align: 1px;
  border-radius: 9999px; padding: 0.2rem 0.7rem; margin-left: 0.45rem;
  font-size: 0.62rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase;
}
.lb-chip-sold { background: #C22B5F; color: #F7F5F0; box-shadow: 0 0 0 1.2px #F2C230; }
.lb-chip-sold::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(115deg, transparent 32%, rgba(247, 245, 240, 0.8) 50%, transparent 68%);
  transform: translateX(-130%);
  animation: sold-shine 2.6s ease-in-out infinite;
}
.lb-chip-available { background: #F2C230; color: #0C0C10; }

/* ---------- lightbox ---------- */
.lightbox { background: rgba(12, 12, 16, 0.88); backdrop-filter: blur(8px); }

/* ---------- FAQ ---------- */
.faq-item summary::-webkit-details-marker { display: none; }
.faq-icon { font-size: 1.35rem; line-height: 1; transition: transform 200ms ease; }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .mosaic-col-0, .mosaic-col-1, .mosaic-col-2, .marquee-track { animation: none; }
  .gal-badge-sold, .gal-badge-sold::after, .lb-chip-sold::after { animation: none; }
  .hero-fade, .hero-line, .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}
