/* ==========================================================
   Ema Paraschiv — Fine Art & Minimalist Editions
   Wabi-Sabi Interactive Aesthetics & Scroll Animations
   ========================================================== */

:root {
  --wabi-bg: #FAF8F5;          /* Rice paper canvas */
  --wabi-text: #1A1A1A;        /* Deep sumi ink */
  --wabi-accent: #B8734F;      /* Earthen terracotta */
  --wabi-card-bg: #F0EDE8;     /* Organic linen */
  --wabi-card-border: #E5E0D8; /* Soft stone micro-border */
  --wabi-stage: #EAE6DF;       /* Inset display bed */
  --wabi-muted: #7A756D;       /* Weathered taupe */
  --wabi-font-serif: 'Cormorant Garamond', Georgia, serif;
  --wabi-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Global Canvas & Typography Overrides */
body {
  background-color: var(--wabi-bg) !important;
  color: var(--wabi-text) !important;
  font-family: var(--wabi-font-sans) !important;
  font-weight: 300 !important;
}

h1, h2, h3, h4,
.serif-heading,
.hero-heading,
.artwork-title,
.config-product-title,
.brand-logo {
  font-family: var(--wabi-font-serif) !important;
  color: var(--wabi-text) !important;
}

/* Strict Label Hierarchy: Uppercase, 11px, letter-spacing 0.15em */
.text-uppercase-label,
.hero-tagline,
.artwork-categories,
.gallery-stats,
.format-pill-micro,
.filter-chip,
.btn-quick-config,
.wall-ruler-metric,
.control-label {
  font-family: var(--wabi-font-sans) !important;
  font-size: 11px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}

.artwork-categories {
  color: var(--wabi-accent) !important;
}

/* Terracotta Filter Bar Chips */
.filter-chip {
  background: rgba(240, 237, 232, 0.8) !important;
  border: 1px solid var(--wabi-card-border) !important;
  color: var(--wabi-text) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.filter-chip:hover {
  border-color: var(--wabi-accent) !important;
  color: var(--wabi-accent) !important;
}

.filter-chip.active {
  background: var(--wabi-accent) !important;
  color: #FAF8F5 !important;
  border-color: var(--wabi-accent) !important;
  box-shadow: 0 4px 14px rgba(184, 115, 79, 0.28) !important;
}

/* ==========================================================
   ARTWORK CARD: WABI-SABI LINEN SURFACE & HOVER DYNAMICS
   ========================================================== */
.artwork-card {
  background-color: var(--wabi-card-bg) !important;
  border: 1px solid var(--wabi-card-border) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  position: relative !important;
  box-shadow: 0 4px 20px rgba(26, 26, 26, 0.04) !important;
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.45s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.35s ease !important;
}

/* Intersection Observer Scroll Reveal Initial State */
.artwork-card.wabi-reveal {
  opacity: 0;
  transform: translateY(30px);
  will-change: opacity, transform;
  transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.85s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.45s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.35s ease !important;
}

.artwork-card.wabi-reveal.is-visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* Card Hover Micro-Interactions */
.artwork-card.is-visible:hover {
  transform: translateY(-8px) scale(1.008) !important;
  border-color: rgba(184, 115, 79, 0.4) !important;
  box-shadow: 0 24px 52px -12px rgba(26, 26, 26, 0.12),
              0 6px 20px -4px rgba(184, 115, 79, 0.1) !important;
}

.artwork-media-wrap {
  background: var(--wabi-stage) !important;
  transition: background 0.4s ease !important;
}

.artwork-card:hover .artwork-media-wrap {
  background: #E2DDD5 !important;
}

.artwork-thumbnail-container {
  transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.artwork-card:hover .artwork-thumbnail-container {
  transform: scale(1.035) !important;
}

.artwork-img {
  transition: box-shadow 0.5s ease !important;
}

.artwork-card:hover .artwork-img {
  box-shadow: 0 16px 36px -6px rgba(26, 26, 26, 0.22) !important;
}

/* Quick Config Button with Terracotta Accent on Hover */
.btn-quick-config {
  background: rgba(250, 248, 245, 0.94) !important;
  border: 1px solid var(--wabi-card-border) !important;
  color: var(--wabi-text) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-quick-config:hover {
  background: var(--wabi-accent) !important;
  color: #FAF8F5 !important;
  border-color: var(--wabi-accent) !important;
  box-shadow: 0 4px 16px rgba(184, 115, 79, 0.32) !important;
}

/* Add to Curation Primary Action Button */
.btn-add-to-cart {
  background: var(--wabi-text) !important;
  color: #FAF8F5 !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-add-to-cart:hover {
  background: var(--wabi-accent) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px -4px rgba(184, 115, 79, 0.35) !important;
}
