/* Botanical keepsakes: a painted 3D still life over a small CSS depth stage. */
[data-object-stage] { position: relative; }
.garden-object {
  --object-size: 240px;
  position: relative;
  width: var(--object-size);
  height: var(--object-size);
  flex: 0 0 auto;
  pointer-events: none;
  user-select: none;
  perspective: 900px;
  opacity: 0;
  transition: opacity 600ms var(--rg-ease, ease);
}
.garden-object.is-object-loaded { opacity: 1; }
.garden-object__pose {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transform: rotateX(calc(var(--object-y, 0) * -.7deg)) rotateY(calc(var(--object-x, 0) * .8deg));
  transition: transform 350ms ease-out;
}
.garden-object__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: translateZ(20px);
  animation: keepsakeBreath 8s ease-in-out infinite alternate;
  animation-play-state: paused;
}
.garden-object__petal {
  position: absolute;
  width: 12px;
  height: 19px;
  top: 28%;
  left: 12%;
  border-radius: 85% 15% 75% 25%;
  background: linear-gradient(135deg, var(--rg-rose-soft), var(--rg-rose));
  box-shadow: 0 4px 10px rgba(89, 63, 45, .12);
  transform: translate3d(calc(var(--object-x, 0) * -1px), calc(var(--object-y, 0) * -1px), 65px) rotate(-32deg);
  transition: transform 450ms ease-out;
}
.garden-object__petal:last-child {
  top: 55%;
  left: 83%;
  width: 9px;
  height: 14px;
  background: linear-gradient(135deg, var(--rg-gold-soft), var(--rg-gold));
  transform: translate3d(calc(var(--object-x, 0) * 1.2px), calc(var(--object-y, 0) * 1px), 45px) rotate(24deg);
}
[data-keepsake-motion="full"] .is-object-visible .garden-object__image { animation-play-state: running; }
[data-keepsake-data="reduced"] .garden-object { visibility: hidden; }
[data-keepsake-data="reduced"] .keepsake-interlude,
[data-keepsake-data="reduced"] .keepsake-bridge-object { display: none; }
[data-keepsake-motion="quiet"] .garden-object__pose,
[data-keepsake-motion="quiet"] .garden-object__petal { transform: none; }
@keyframes keepsakeBreath {
  from { transform: translate3d(0, 0, 20px) rotate(-1deg); }
  to { transform: translate3d(0, -5px, 20px) rotate(1deg); }
}

.foyer-object-book { position: absolute; z-index: 1; top: -18px; }
.foyer-object-book { --object-size: 220px; left: calc(50% + 310px); top: -2px; }
.foyer-journey { position: relative; }
.foyer-journey::before,
.keepsake-interlude::before,
.keepsake-interlude::after {
  content: '';
  width: clamp(70px, 16vw, 200px);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--rg-line-strong), transparent);
}
.foyer-journey::before { position: absolute; width: 340px; top: 30px; left: 50%; transform: translateX(-50%); z-index: -1; }
.keepsake-interlude {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(12px, 4vw, 50px);
  padding: 18px 24px;
  overflow: clip;
}
.keepsake-interlude .garden-object { --object-size: 240px; }
.keepsake-interlude--night { background: var(--rg-night); }
.keepsake-interlude--night::before,
.keepsake-interlude--night::after { background: linear-gradient(90deg, transparent, var(--rg-gold), transparent); }
.story-bridge .keepsake-bridge-object { --object-size: 230px; margin: -30px auto 8px; }
.story-bridge .keepsake-bridge-object ~ .story-bridge-rose { display: none; }
[data-keepsake-data="reduced"] .story-bridge .story-bridge-rose { display: block; }

@media (min-width: 901px) and (max-width: 1200px) {
  .foyer-object-book { --object-size: 155px; left: calc(50% + 295px); top: 5px; }
}
@media (min-width: 701px) and (max-width: 900px) {
  .foyer-object-book { display: none; }
}
@media (max-width: 700px) {
  .foyer-object-book { display: none; }
  .keepsake-interlude { gap: 8px; padding: 8px 18px; }
  .keepsake-interlude .garden-object { --object-size: 170px; }
  .story-bridge .keepsake-bridge-object { --object-size: 190px; margin-top: -10px; }
}
@media (max-height: 520px) and (orientation: landscape) {
  .foyer-object-book { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .garden-object, .garden-object__pose, .garden-object__petal { transition: none; }
  .garden-object__pose, .garden-object__petal { transform: none; }
  .garden-object__image { animation: none; }
}
