/* ====== Daisy Desk Sub-Page Enhancements ====== */
/* Shared across landscape, design, retail */

/* ---------- Gooey Text Morph ---------- */
.gooey-text {
  position: relative;
  display: inline-block;
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #fff;
  filter: url(#gooey-filter);
}
.gooey-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px) scale(0.8);
  animation: gooey-reveal 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  animation-play-state: paused;
}
.gooey-text.is-visible .gooey-word {
  animation-play-state: running;
}
@keyframes gooey-reveal {
  0% { opacity: 0; transform: translateY(20px) scale(0.8); filter: blur(8px); }
  60% { filter: blur(2px); }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

/* ---------- Page Identity: Landscape ---------- */
.page-landscape .product-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 50% 80%, rgba(200,210,230,0.06) 0%, transparent 70%);
  pointer-events: none;
}
.page-landscape .card-tag { color: rgba(200,210,230,0.9); }
.page-landscape .bento-card:hover { border-color: rgba(200,210,230,0.2); }

/* ---------- Page Identity: Design ---------- */
.page-design .product-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 50% 80%, rgba(200,210,230,0.06) 0%, transparent 70%);
  pointer-events: none;
}
.page-design .card-tag { color: rgba(200,210,230,0.9); }
.page-design .bento-card:hover { border-color: rgba(200,210,230,0.2); }

/* ---------- Page Identity: Retail ---------- */
.page-retail .product-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 50% 80%, rgba(200,210,230,0.06) 0%, transparent 70%);
  pointer-events: none;
}
.page-retail .card-tag { color: rgba(200,210,230,0.9); }
.page-retail .bento-card:hover { border-color: rgba(200,210,230,0.2); }

/* ---------- Accent Divider ---------- */
.accent-divider {
  text-align: center;
  padding: 80px 0;
  position: relative;
}
.accent-divider::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(68,136,255,0.04) 0%, transparent 70%);
  pointer-events: none;
}

/* ---------- Staggered Gallery Reveal ---------- */
.gallery .bento-card {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.gallery.is-visible .bento-card {
  opacity: 1;
  transform: translateY(0);
}
.gallery.is-visible .bento-card:nth-child(1) { transition-delay: 0s; }
.gallery.is-visible .bento-card:nth-child(2) { transition-delay: 0.1s; }
.gallery.is-visible .bento-card:nth-child(3) { transition-delay: 0.2s; }
.gallery.is-visible .bento-card:nth-child(4) { transition-delay: 0.3s; }

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
  .gooey-word { animation: none; opacity: 1; transform: none; filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  .gooey-word { animation: none; opacity: 1; transform: none; filter: none; }
  .gallery .bento-card { opacity: 1; transform: none; }
}