/* RentalAjay entry splash V10 — clean layers + smoother ~5 second animation. */
html.ra-splash-pending,
html.ra-splash-pending body {
    overflow: hidden;
}

.ra-entry-splash {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: grid;
    place-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 43%, rgba(70, 135, 255, .30), transparent 36%),
        linear-gradient(145deg, #062b77 0%, #0756d6 47%, #052f8e 100%);
    opacity: 1;
    visibility: visible;
    isolation: isolate;
    transition: opacity .38s cubic-bezier(.22,.61,.36,1), visibility .38s linear;
    -webkit-font-smoothing: antialiased;
}

html.ra-splash-seen .ra-entry-splash {
    display: none !important;
}

.ra-entry-splash.is-leaving {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.ra-entry-splash::before {
    content: "";
    position: absolute;
    width: min(94vw, 660px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,255,255,.12), transparent 69%);
    filter: blur(14px);
    opacity: .38;
    transform: scale(.9) translateZ(0);
    animation: ra-splash-breathe-v10 4.7s .08s cubic-bezier(.37,0,.63,1) both;
    will-change: transform, opacity;
}

.ra-entry-splash__ambient {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(112deg, transparent 26%, rgba(255,255,255,.055) 47%, transparent 68%);
    transform: translate3d(-115%,0,0);
    animation: ra-splash-sheen-v10 4.6s .18s cubic-bezier(.2,.7,.2,1) both;
    pointer-events: none;
    will-change: transform;
}

.ra-entry-splash__logo {
    position: relative;
    width: clamp(235px, 38vw, 330px);
    aspect-ratio: 1;
    filter: drop-shadow(0 18px 38px rgba(0, 17, 68, .30));
    transform: translateZ(0);
    animation: ra-logo-settle-v10 .62s 4.18s cubic-bezier(.16,1,.3,1) both;
    will-change: transform;
}

.ra-entry-splash__layer,
.ra-entry-splash__rj-reveal {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.ra-entry-splash__layer {
    display: block;
    object-fit: contain;
    user-select: none;
    -webkit-user-drag: none;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    will-change: transform, opacity;
}

/* Tangan atas masuk dari kanan menuju posisi final. */
.ra-entry-splash__hand--top {
    opacity: 0;
    transform: translate3d(88vw, -3px, 0);
    animation: ra-hand-top-in-v10 1.42s .12s cubic-bezier(.16,1,.3,1) forwards;
}

/* Tangan bawah masuk dari kiri menuju posisi final. */
.ra-entry-splash__hand--bottom {
    opacity: 0;
    transform: translate3d(-88vw, 3px, 0);
    animation: ra-hand-bottom-in-v10 1.42s .12s cubic-bezier(.16,1,.3,1) forwards;
}

/* Bintang baru muncul setelah kedua tangan hampir diam. */
.ra-entry-splash__star {
    opacity: 0;
    transform: translateZ(0) scale(.16);
    transform-origin: 50% 50%;
    animation: ra-star-jelly-v10 1.48s 1.48s cubic-bezier(.22,.8,.24,1) forwards;
}

/* RJ muncul setelah jelly bintang selesai, seperti ditulis kiri -> kanan. */
.ra-entry-splash__rj-reveal {
    overflow: hidden;
    clip-path: inset(0 100% 0 0);
    -webkit-clip-path: inset(0 100% 0 0);
    animation: ra-rj-write-v10 1.14s 3.02s cubic-bezier(.4,0,.2,1) forwards;
    will-change: clip-path;
}

.ra-entry-splash__rj {
    opacity: 0;
    transform: translate3d(-2px,0,0);
    animation: ra-rj-ink-v10 .26s 3.02s ease-out forwards;
}

.ra-entry-splash__brand {
    position: absolute;
    top: calc(50% + clamp(138px, 20vw, 192px));
    left: 50%;
    transform: translate3d(-50%, 10px, 0);
    color: #fff;
    font: 800 clamp(18px, 2.4vw, 24px)/1.1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: .02em;
    opacity: 0;
    text-shadow: 0 6px 24px rgba(0, 20, 74, .42);
    animation: ra-brand-in-v10 .50s 4.22s cubic-bezier(.16,1,.3,1) forwards;
    will-change: transform, opacity;
}

@keyframes ra-hand-top-in-v10 {
    0% {
        opacity: 0;
        transform: translate3d(88vw, -3px, 0);
    }
    12% { opacity: 1; }
    76% {
        opacity: 1;
        transform: translate3d(-4px, 0, 0);
    }
    90% { transform: translate3d(1.5px, 0, 0); }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes ra-hand-bottom-in-v10 {
    0% {
        opacity: 0;
        transform: translate3d(-88vw, 3px, 0);
    }
    12% { opacity: 1; }
    76% {
        opacity: 1;
        transform: translate3d(4px, 0, 0);
    }
    90% { transform: translate3d(-1.5px, 0, 0); }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes ra-star-jelly-v10 {
    0% {
        opacity: 0;
        transform: translateZ(0) scale(.16);
    }
    20% {
        opacity: 1;
        transform: translateZ(0) scale(.78, 1.12);
    }
    39% { transform: translateZ(0) scale(1.10, .91); }
    56% { transform: translateZ(0) scale(.95, 1.06); }
    70% { transform: translateZ(0) scale(1.035, .98); }
    83% { transform: translateZ(0) scale(.99, 1.015); }
    92% { transform: translateZ(0) scale(1.006, .997); }
    100% {
        opacity: 1;
        transform: translateZ(0) scale(1);
    }
}

@keyframes ra-rj-write-v10 {
    0% {
        clip-path: inset(0 100% 0 0);
        -webkit-clip-path: inset(0 100% 0 0);
    }
    18% {
        clip-path: inset(0 88% 0 0);
        -webkit-clip-path: inset(0 88% 0 0);
    }
    52% {
        clip-path: inset(0 48% 0 0);
        -webkit-clip-path: inset(0 48% 0 0);
    }
    80% {
        clip-path: inset(0 15% 0 0);
        -webkit-clip-path: inset(0 15% 0 0);
    }
    100% {
        clip-path: inset(0 0 0 0);
        -webkit-clip-path: inset(0 0 0 0);
    }
}

@keyframes ra-rj-ink-v10 {
    from { opacity: 0; transform: translate3d(-2px,0,0); }
    to { opacity: 1; transform: translate3d(0,0,0); }
}

@keyframes ra-logo-settle-v10 {
    0% { transform: translateZ(0) scale(1); }
    45% { transform: translateZ(0) scale(1.022); }
    100% { transform: translateZ(0) scale(1); }
}

@keyframes ra-brand-in-v10 {
    from { opacity: 0; transform: translate3d(-50%, 10px, 0); }
    to { opacity: .97; transform: translate3d(-50%, 0, 0); }
}

@keyframes ra-splash-breathe-v10 {
    0% { transform: scale(.90) translateZ(0); opacity: .30; }
    50% { transform: scale(1.07) translateZ(0); opacity: .67; }
    100% { transform: scale(1) translateZ(0); opacity: .42; }
}

@keyframes ra-splash-sheen-v10 {
    0% { transform: translate3d(-115%,0,0); }
    100% { transform: translate3d(115%,0,0); }
}

@media (max-width: 600px) {
    .ra-entry-splash__logo {
        width: min(72vw, 292px);
    }

    .ra-entry-splash__brand {
        top: calc(50% + min(37vw, 150px));
        font-size: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ra-entry-splash__ambient,
    .ra-entry-splash::before,
    .ra-entry-splash__logo,
    .ra-entry-splash__layer,
    .ra-entry-splash__rj-reveal,
    .ra-entry-splash__brand {
        animation-duration: .01ms !important;
        animation-delay: 0ms !important;
        animation-iteration-count: 1 !important;
    }
}