/* Full bleed artwork; transparency blends into the actual storefront background. */
.luxury-store .arrival-poster.era-cinematic {
    isolation: isolate;
    margin: -12px -22px 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
}
.era-cinematic .arrival-poster-image,
.era-cinematic .era-light {
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 16%, #000 79%, transparent);
    mask-image: linear-gradient(to bottom, transparent, #000 16%, #000 79%, transparent);
}
.era-cinematic .arrival-poster-image { width: 100%; height: auto; }
.era-light { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.era-glow {
    position: absolute; inset: 0;
    background: radial-gradient(ellipse at 51% 33%, #f7c56a26, transparent 44%), radial-gradient(ellipse at 66% 29%, #fff0be1c, transparent 22%);
    mix-blend-mode: screen;
    animation: era-breathe 7s ease-in-out infinite;
}
.era-glass {
    position: absolute; inset: -20% -60%;
    background: linear-gradient(112deg, transparent 42%, #ffe7ac04 46%, #fff7db24 49%, #ffe7ac08 51%, transparent 55%);
    mix-blend-mode: screen;
    animation: era-glass-pass 11s ease-in-out infinite;
}
.era-star {
    position: absolute; width: 24%; height: 1px;
    background: linear-gradient(90deg, transparent, #efd49b80 35%, #fff9e8 50%, #efd49b80 65%, transparent);
    box-shadow: 0 0 8px #ffd48160;
    mix-blend-mode: screen;
    animation: era-star-shine 6s ease-in-out infinite;
}
.era-star::before {
    content: ''; position: absolute; left: 50%; top: 50%;
    width: 1px; height: 25px; transform: translate(-50%, -50%);
    background: linear-gradient(transparent, #fff6dc, transparent);
}
.era-star::after {
    content: ''; position: absolute; left: 50%; top: 50%;
    width: 14px; height: 14px; transform: translate(-50%, -50%);
    background: radial-gradient(circle, #fff9dfb3, #ffd07540 24%, transparent 70%);
}
.era-star-one { left: 20%; top: 28%; }
.era-star-two { left: 54%; top: 28.5%; animation-delay: -2s; }
.era-star-three { left: 58.5%; top: 40.4%; width: 19%; animation-delay: -4s; }
.era-cinematic { container-type: inline-size; }
.era-meteor {
    position: absolute; left: 50%; top: 50%; width: 5px; height: 5px;
    border-radius: 50%; background: #fffdf4; opacity: 0;
    box-shadow: 0 0 6px #fff5d5, 0 0 16px #ffd484;
    mix-blend-mode: screen;
    animation: era-meteor-fall 6s linear infinite;
}
.era-meteor::before {
    content: ''; position: absolute; right: 2px; top: 1px;
    width: 28cqw; height: 2px; transform-origin: right center; transform: rotate(31.3deg);
    background: linear-gradient(90deg, transparent, #fbbf4d33 30%, #ffe0a0b3 75%, #fffdf4);
    box-shadow: 0 0 7px #ffd07880;
}
.era-meteor-blink {
    position: absolute; left: 50%; top: 50%; width: 52cqw; height: 52cqw;
    transform: translate(-50%, -50%); opacity: 0; mix-blend-mode: screen;
    background: radial-gradient(circle, #fffef4 0%, #fffbed 5%, #fff5cee6 10%, #ffdc8ca6 20%, #f5b44c40 40%, transparent 70%);
    animation: era-meteor-impact 6s linear infinite;
}
.era-meteor-blink::before, .era-meteor-blink::after {
    content: ''; position: absolute; left: 50%; top: 50%;
    width: 85cqw; height: 3px; transform: translate(-50%, -50%);
    background: linear-gradient(90deg, transparent, #ffe3a680 30%, #fffdf2 50%, #ffe3a680 70%, transparent);
    box-shadow: 0 0 9px #ffd58d99;
}
.era-meteor-blink::after { width: 3px; height: 52cqw; background: linear-gradient(transparent, #fffdf2, transparent); }
.era-impact-rays {
    position: absolute; left: 50%; top: 50%; width: 65cqw; height: 65cqw;
    opacity: 0; mix-blend-mode: screen; transform: translate(-50%, -50%);
    background: repeating-conic-gradient(from 12deg, transparent 0deg 28deg, #ffe5a699 29deg, #fffbea 30deg, #ffe5a666 31deg, transparent 32deg 60deg);
    -webkit-mask-image: radial-gradient(circle, #000 0%, #0008 22%, transparent 67%);
    mask-image: radial-gradient(circle, #000 0%, #0008 22%, transparent 67%);
    animation: era-impact-rays 6s linear infinite;
}
.era-impact-ring {
    position: absolute; left: 50%; top: 50%; width: 36cqw; height: 36cqw;
    border: 1px solid #fff1c5b3; border-radius: 50%; opacity: 0;
    box-shadow: 0 0 12px #ffd88b99, inset 0 0 12px #ffd88b66;
    transform: translate(-50%, -50%) scale(.15); mix-blend-mode: screen;
    animation: era-impact-ring 6s linear infinite;
}
@keyframes era-impact-rays {
    0%, 23.5% { opacity: 0; transform: translate(-50%, -50%) scale(.25) rotate(-8deg); }
    25.5% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0deg); }
    30% { opacity: .5; transform: translate(-50%, -50%) scale(1.25) rotate(5deg); }
    39%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(1.5) rotate(10deg); }
}
@keyframes era-impact-ring {
    0%, 24% { opacity: 0; transform: translate(-50%, -50%) scale(.15); }
    26% { opacity: .9; transform: translate(-50%, -50%) scale(.45); }
    31% { opacity: .5; transform: translate(-50%, -50%) scale(1.25); }
    40%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(2); }
}
@keyframes era-meteor-fall {
    0%, 8% { transform: translate(-50cqw, -30.4cqw); opacity: 0; }
    10% { opacity: 1; }
    24% { transform: translate(0, 0); opacity: 1; }
    27%, 100% { transform: translate(0, 0); opacity: 0; }
}
@keyframes era-meteor-impact {
    0%, 23.5% { opacity: 0; transform: translate(-50%, -50%) scale(.35); }
    25.5% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    29% { opacity: .55; transform: translate(-50%, -50%) scale(1.2); }
    39%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(1.5); }
}
.era-twinkle {
    position: absolute; width: 3px; height: 3px; border-radius: 50%;
    background: #fff8e3; box-shadow: 0 0 5px #ffe3a699, 0 0 11px #fbc77766;
    mix-blend-mode: screen; pointer-events: none;
    animation: era-twinkle-light 2s ease-in-out infinite;
}
.era-twinkle::before, .era-twinkle::after {
    content: ''; position: absolute; left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    background: linear-gradient(90deg, transparent, #fff9e5, transparent);
    width: 15px; height: 1px;
}
.era-twinkle::after { width: 1px; height: 15px; background: linear-gradient(transparent, #fff9e5, transparent); }
.era-twinkle-one { left: 16%; top: 24%; animation-delay: -.8s; }
.era-twinkle-two { left: 83%; top: 32%; animation-delay: -.5s; animation-duration: 2.3s; }
.era-twinkle-three { left: 28%; top: 58%; animation-delay: -1.7s; animation-duration: 1.8s; }
.era-twinkle-four { left: 76%; top: 72%; animation-delay: -1.3s; animation-duration: 2.1s; }
.era-twinkle-five { left: 38%; top: 19%; animation-delay: -.3s; animation-duration: 1.9s; }
.era-twinkle-six { left: 65%; top: 24%; animation-delay: -1.1s; animation-duration: 2.2s; }
.era-twinkle-seven { left: 10%; top: 46%; animation-delay: -1.5s; animation-duration: 2.4s; }
.era-twinkle-eight { left: 90%; top: 55%; animation-delay: -.7s; animation-duration: 1.7s; }
.era-twinkle-nine { left: 43%; top: 75%; animation-delay: -1.2s; animation-duration: 2s; }
.era-twinkle-ten { left: 59%; top: 53%; animation-delay: -.2s; animation-duration: 1.8s; }
.era-twinkle-eleven { left: 7%; top: 21%; animation-delay: -.4s; animation-duration: 2.1s; }
.era-twinkle-twelve { left: 21%; top: 17%; animation-delay: -1.3s; animation-duration: 2.4s; }
.era-twinkle-thirteen { left: 80%; top: 18%; animation-delay: -.9s; animation-duration: 1.9s; }
.era-twinkle-fourteen { left: 94%; top: 26%; animation-delay: -1.6s; animation-duration: 2.2s; }
.era-twinkle-fifteen { left: 6%; top: 36%; animation-delay: -1.1s; animation-duration: 1.8s; }
.era-twinkle-sixteen { left: 92%; top: 42%; animation-delay: -.6s; animation-duration: 2s; }
.era-twinkle-seventeen { left: 14%; top: 65%; animation-delay: -1.8s; animation-duration: 2.3s; }
.era-twinkle-eighteen { left: 88%; top: 69%; animation-delay: -.3s; animation-duration: 1.7s; }
.era-twinkle-nineteen { left: 22%; top: 82%; animation-delay: -1.4s; animation-duration: 2s; }
.era-twinkle-twenty { left: 84%; top: 81%; animation-delay: -.7s; animation-duration: 2.2s; }
@keyframes era-twinkle-light {
    0%, 100% { opacity: .06; }
    34% { opacity: .12; }
    42% { opacity: .5; }
    48% { opacity: .65; }
    54% { opacity: .5; }
    68% { opacity: .1; }
}
.era-cinematic .arrival-concept-label {
    z-index: 1; left: 22px; bottom: 8px; padding: 0;
    border: 0; background: transparent; color: #b7aa8d;
    font-size: 8px; letter-spacing: 1px;
}
@keyframes era-breathe { 0%, 100% { opacity: .35; } 50% { opacity: .85; } }
@keyframes era-glass-pass {
    0%, 15% { transform: translateX(-34%); opacity: 0; }
    32% { opacity: .45; }
    60% { transform: translateX(34%); opacity: 0; }
    100% { transform: translateX(34%); opacity: 0; }
}
@keyframes era-star-shine {
    0%, 100% { opacity: .12; transform: scaleX(.7); }
    45% { opacity: .75; transform: scaleX(1); }
    60% { opacity: .25; transform: scaleX(.85); }
}
@media (prefers-reduced-motion: reduce) {
    .era-light > span { animation: none; }
    .era-glass { display: none; }
    .era-star { opacity: .25; }
    .era-meteor, .era-meteor-blink, .era-impact-rays, .era-impact-ring { display: none; }
    .era-twinkle { opacity: .5; }
}
