/* =====================================================
 * Raj Collection Sequel — Cinematic Intro
 * First-visit only. Maroon drape + RC monogram in gold.
 * Auto-skips on repeat sessions, reduced-motion, or non-home.
 * ===================================================== */

.rcs-intro {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background:
        radial-gradient(circle at 50% 38%, var(--rcs-primary) 0%, var(--rcs-primary-deep) 70%),
        var(--rcs-primary-deep);
    display: grid;
    place-items: center;
    overflow: hidden;
    transition:
        transform 900ms cubic-bezier(0.7, 0, 0.16, 1),
        opacity 600ms cubic-bezier(0.7, 0, 0.16, 1);
    will-change: transform, opacity;
}

/* Ambient gold dust speckle behind the monogram */
.rcs-intro::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 25% 35%, rgba(201,169,97,0.08) 0%, transparent 18%),
        radial-gradient(circle at 78% 60%, rgba(201,169,97,0.06) 0%, transparent 22%),
        radial-gradient(circle at 60% 22%, rgba(201,169,97,0.05) 0%, transparent 14%);
    pointer-events: none;
    animation: rcs-intro-dust 4s var(--rcs-ease-inout) infinite;
}

.rcs-intro__inner {
    text-align: center;
    position: relative;
}

/* RC monogram */
.rcs-intro__monogram {
    font-family: var(--rcs-font-display);
    font-size: clamp(96px, 22vw, 220px);
    font-weight: 600;
    color: var(--rcs-accent);
    line-height: 1;
    letter-spacing: -0.06em;
    opacity: 0;
    transform: scale(0.85);
    filter: drop-shadow(0 4px 24px rgba(201,169,97,0.35));
    animation: rcs-intro-mono 1400ms cubic-bezier(0.22, 1, 0.36, 1) 200ms forwards;
    position: relative;
    display: inline-block;
}
/* Gold hairline flourish under monogram */
.rcs-intro__monogram::after {
    content: '';
    position: absolute;
    left: 12%;
    right: 12%;
    bottom: -16px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--rcs-accent), transparent);
    transform-origin: center;
    transform: scaleX(0);
    animation: rcs-intro-rule 800ms cubic-bezier(0.22, 1, 0.36, 1) 900ms forwards;
}

/* Subtitle "Raj Collection · Sangli Boutique" */
.rcs-intro__sub {
    position: absolute;
    bottom: 12vh;
    left: 0;
    right: 0;
    text-align: center;
    color: rgba(201,169,97, 0.85);
    font-family: var(--rcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.36em;
    text-transform: uppercase;
    opacity: 0;
    animation: rcs-intro-sub 900ms var(--rcs-ease-out) 1100ms forwards;
}

/* Tiny tagline above monogram */
.rcs-intro__eyebrow {
    position: absolute;
    top: 14vh;
    left: 0;
    right: 0;
    text-align: center;
    color: rgba(201,169,97, 0.65);
    font-family: var(--rcs-font-ui);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.5em;
    text-transform: uppercase;
    opacity: 0;
    animation: rcs-intro-eyebrow 900ms var(--rcs-ease-out) 600ms forwards;
}

@keyframes rcs-intro-mono {
    to {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes rcs-intro-rule {
    to { transform: scaleX(1); }
}
@keyframes rcs-intro-sub {
    to { opacity: 0.85; }
}
@keyframes rcs-intro-eyebrow {
    to { opacity: 0.85; }
}
@keyframes rcs-intro-dust {
    0%, 100% { opacity: 0.7; }
    50% { opacity: 1; }
}

/* Leaving — slide drape up + fade */
.rcs-intro.is-leaving {
    transform: translateY(-100%);
    opacity: 0;
}
.rcs-intro.is-leaving .rcs-intro__monogram {
    animation: none;
    opacity: 1;
    transform: scale(1.04);
    transition: transform 600ms var(--rcs-ease-out);
}

/* Body lock while intro is open */
body.rcs-intro-open {
    overflow: hidden;
    height: 100vh;
}

/* Respect reduced motion — skip entirely */
@media (prefers-reduced-motion: reduce) {
    .rcs-intro,
    .rcs-intro__monogram,
    .rcs-intro__sub,
    .rcs-intro__eyebrow {
        animation: none !important;
        display: none !important;
    }
}
