/* Shared real 3D displays. Geometry and authentic artwork retain their aspect. */
.rr-jar-collection { display: flex; align-items: center; justify-content: center; gap: 0; }
.rr-jar-collection .jar-stage { flex: 1 1 0; min-width: 0; width: 100%; height: auto; aspect-ratio: .75; max-width: none; }
.rr-jar-collection .jar-fallback { inset: 11% auto auto 50%; width: auto; max-width: 100%; height: 78%; transform: translateX(-50%); object-fit: contain; filter: none; }
.jar-stage::after { content: ''; position: absolute; z-index: -1; left: 18%; right: 18%; bottom: 12%; height: 4%; border-radius: 50%; background: radial-gradient(ellipse, #3a271b3d, #3a271b0d 55%, transparent 73%); transform: scaleX(1.18); pointer-events: none; }
.jar-stage canvas { filter: drop-shadow(0 6px 4px #3a271b12); }
.jar-stage canvas:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; border-radius: 5px; }
.v15-product-lineup { align-items: center; padding: 24px 14px 38px 0; }
.v15-lineup-item { width: 25%; max-width: 195px; }
.v15-lineup-item .jar-stage { aspect-ratio: .75; }
.rr-lineup-note { position: absolute; left: 8px; right: 8px; bottom: 18px; text-align: center; color: var(--muted); font-size: 11px; line-height: 1.5; }
.rr15-authentic-trio.rr-jar-collection { padding: 3% 1%; background: var(--rr-canvas); }
.rr15-feature-media.rr15-authentic-trio.rr-jar-collection { padding: 4% 2%; background: var(--rr-canvas); }
.v15-why-jars.rr-jar-collection { padding: 0; background: var(--rr-canvas); }
.rr15-ratu-art.rr-pouch-collection { padding: 5% 4%; gap: 0; background: var(--rr-canvas); }
.rr-pouch-collection .packet-stage { flex: 1 1 0; min-width: 0; height: auto; aspect-ratio: .7; margin: 0; }
.rr-pouch-collection .packet-stage canvas, .rr-pouch-collection .packet-fallback { height: 100%; }
.rr-pouch-collection .packet-display { pointer-events: none; }
.packet-stage canvas { filter: drop-shadow(3px 6px 4px #2b201523); }
.v15-pack-shot { isolation: isolate; overflow: hidden; background: var(--rr-canvas); }
.v15-pack-shot .jar-stage { width: 65%; max-width: 390px; margin-inline: auto; }
.rr-splash-scene { opacity: 1; }
.rr-sauce-splash { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.rr-splash-scene .rr-ingredient { opacity: .92; filter: drop-shadow(0 6px 4px #3724151a); }
.rr-splash-scene .rr-ingredient-a { left: 4%; top: 9%; width: 18%; transform: rotate(-24deg); }
.rr-splash-scene .rr-ingredient-b { right: 2%; bottom: 22%; width: 22%; transform: rotate(18deg); }
.rr-splash-scene .rr-ingredient-c { left: 9%; bottom: 13%; width: 13%; max-width: 76px; transform: rotate(-13deg); opacity: .72; }
.rr-splash-scene[data-botanical-ready="true"] .botanical-leaf { animation: rr-pack-float 10s ease-in-out infinite alternate; animation-play-state: paused; }
.rr-splash-scene[data-botanical-ready="true"] .rr-splash-sheet { transform-origin: 50% 80%; animation: rr-sauce-breathe 12s ease-in-out infinite alternate; animation-play-state: paused; }
.rr-splash-scene[data-botanical-ready="true"] .rr-splash-droplets { animation: rr-droplet-drift 9s ease-in-out infinite alternate; animation-play-state: paused; }
.rr-splash-scene .rr-ingredient-c .botanical-leaf { animation-delay: -3s; }
.rr-splash-scene[data-botanical-active="true"] .botanical-leaf,
.rr-splash-scene[data-botanical-active="true"] .rr-splash-sheet,
.rr-splash-scene[data-botanical-active="true"] .rr-splash-droplets { animation-play-state: running; }
@keyframes rr-pack-float { from { transform: translate3d(0, 3px, 0) rotate(-3deg); } to { transform: translate3d(5px, -11px, 0) rotate(4deg); } }
@keyframes rr-sauce-breathe { from { transform: translate3d(0, 3px, 0) rotate(-1deg) scale(.985); } to { transform: translate3d(0, -3px, 0) rotate(1deg) scale(1.015); } }
@keyframes rr-droplet-drift { from { transform: translate3d(0, 3px, 0); } to { transform: translate3d(2px, -9px, 0); } }
@media (max-width: 700px) {
 .v15-product-lineup { height: auto; min-height: 0; padding: 4px 12px 32px; }
 .v15-lineup-item { max-width: none; }
 .rr-lineup-note { bottom: 6px; font-size: 10px; }
 .v15-pack-shot .jar-stage { width: 70%; }
 .rr-splash-scene .rr-ingredient-a { left: 2%; top: 10%; }
 .rr-splash-scene .rr-ingredient-b { right: 0; }
 .rr-splash-scene .rr-ingredient-c { left: 5%; bottom: 15%; }
}
@media (prefers-reduced-motion: reduce) {
 .rr-splash-scene .botanical-leaf, .rr-splash-scene .rr-splash-sheet, .rr-splash-scene .rr-splash-droplets { animation: none !important; transform: none !important; }
}
