/* Rail Café — home: arrival hero, railway lines list, journey CTA, memory wall */

/* ===== Arrival theater ===== */
.rc-arrival{
    position:relative;
    display:grid;
    align-items:end;
    min-height:min(920px,100dvh);
    overflow:hidden;
    border-bottom:1px solid var(--rc-line);
    background:
        radial-gradient(ellipse 80% 50% at 70% 15%,rgba(0,127,255,.18),transparent 55%),
        radial-gradient(ellipse 60% 40% at 15% 80%,rgba(0,100,200,.12),transparent 50%),
        var(--rc-ink);
    contain:paint;
}

.rc-arrival__scene{
    position:absolute;
    inset:0;
    overflow:hidden;
    transform:translateZ(0);
    contain:strict;
    pointer-events:none;
}

.rc-arrival__photo{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.22;
    filter:saturate(.55) contrast(1.05);
}

.rc-arrival__night{
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg,rgba(6,10,18,.35) 0%,rgba(6,10,18,.55) 42%,rgba(6,10,18,.92) 78%,var(--rc-ink) 100%),
        linear-gradient(105deg,rgba(6,10,18,.88) 0%,rgba(6,10,18,.25) 48%,rgba(6,10,18,.7) 100%);
}

.rc-arrival__aurora{
    position:absolute;
    inset:-10% -5% auto;
    height:55%;
    background:
        radial-gradient(ellipse 45% 60% at 72% 40%,rgba(0,160,255,.28),transparent 70%),
        radial-gradient(ellipse 35% 50% at 40% 20%,rgba(80,140,255,.14),transparent 65%);
    filter:blur(8px);
    animation:rc-aurora 14s ease-in-out infinite alternate;
}

.rc-arrival__decal{
    position:absolute;
    right:-8%;
    top:6%;
    width:min(720px,78vw);
    opacity:.07;
    filter:brightness(0) invert(1) drop-shadow(0 0 40px rgba(185,227,255,.35));
    transform:rotate(-8deg) scaleX(-1);
    animation:rc-decal-drift 18s ease-in-out infinite alternate;
}

.rc-arrival__rails{
    position:absolute;
    left:50%;
    bottom:-4%;
    width:min(920px,120vw);
    transform:translateX(-50%);
    opacity:.55;
    mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 72%,transparent 100%);
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 72%,transparent 100%);
    filter:saturate(1.2) brightness(1.05);
}

.rc-arrival__beam,
.rc-arrival__beam--soft{
    position:absolute;
    left:8%;
    bottom:22%;
    width:55vw;
    height:28vh;
    background:linear-gradient(95deg,rgba(255,210,120,.22),rgba(0,160,255,.08) 35%,transparent 70%);
    filter:blur(18px);
    transform-origin:left center;
    transform:skewY(-4deg);
    opacity:.85;
    animation:rc-beam 6s ease-in-out infinite alternate;
}

.rc-arrival__beam--soft{
    left:18%;
    bottom:18%;
    width:40vw;
    height:18vh;
    background:linear-gradient(100deg,rgba(0,160,255,.18),transparent 65%);
    filter:blur(28px);
    animation-delay:-2.5s;
}

.rc-arrival__express{
    position:absolute;
    left:max(-2%, calc(50% - min(460px, 58vw)));
    bottom:7vh;
    width:clamp(220px,42vw,520px);
    filter:
        drop-shadow(0 0 24px rgba(0,140,255,.35))
        drop-shadow(0 28px 40px rgba(0,0,0,.65));
    animation:rc-express-breathe 8s ease-in-out infinite;
    z-index:5;
}

.rc-arrival__runner{
    position:absolute;
    left:0;
    right:0;
    bottom:18vh;
    height:clamp(56px,9vw,110px);
    z-index:6;
    overflow:visible;
}

.rc-arrival__pixel{
    position:absolute;
    left:0;
    bottom:0;
    height:100%;
    width:auto;
    image-rendering:pixelated;
    filter:
        drop-shadow(0 0 14px rgba(255,180,60,.45))
        drop-shadow(0 12px 18px rgba(0,0,0,.5));
    animation:rc-pixel-run 16s linear infinite;
}

.rc-arrival__sparks{
    position:absolute;
    left:0;
    bottom:8%;
    width:100%;
    height:40%;
    pointer-events:none;
}

.rc-arrival__sparks i{
    position:absolute;
    bottom:0;
    width:3px;
    height:3px;
    border-radius:50%;
    background:#b9e3ff;
    box-shadow:0 0 8px #007fff;
    opacity:0;
    animation:rc-spark 16s linear infinite;
}

.rc-arrival__sparks i:nth-child(1){animation-delay:0s}
.rc-arrival__sparks i:nth-child(2){animation-delay:3.1s}
.rc-arrival__sparks i:nth-child(3){animation-delay:6.4s}
.rc-arrival__sparks i:nth-child(4){animation-delay:9.2s}
.rc-arrival__sparks i:nth-child(5){animation-delay:12.6s}

.rc-arrival__platform-glow{
    position:absolute;
    left:10%;
    right:10%;
    bottom:0;
    height:18%;
    z-index:1;
    background:radial-gradient(ellipse 70% 100% at 50% 100%,rgba(0,127,255,.22),transparent 70%);
}

.rc-arrival__mist{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:18%;
    z-index:1;
    background:linear-gradient(180deg,transparent,rgba(8,12,20,.35) 45%,rgba(8,12,20,.7));
    pointer-events:none;
}

/* Board / copy */
.rc-arrival__board{
    position:relative;
    z-index:4;
    display:grid;
    gap:clamp(2rem,5vw,3.5rem);
    padding-block:clamp(7.5rem,20vh,13rem) clamp(2.5rem,6vh,4rem);
}

.rc-arrival__ticket{
    position:relative;
    max-width:min(560px,100%);
    padding:clamp(1.4rem,3.5vw,2.2rem);
    border:1px solid rgba(185,227,255,.16);
    border-radius:var(--rc-r-lg);
    background:
        linear-gradient(145deg,rgba(26,31,40,.72),rgba(10,14,20,.55));
    backdrop-filter:blur(14px);
    box-shadow:
        0 30px 80px rgba(0,0,0,.45),
        inset 0 1px 0 rgba(185,227,255,.08);
}

.rc-arrival__ticket::before{
    content:"";
    position:absolute;
    inset-inline-start:-1px;
    top:18%;
    bottom:18%;
    width:3px;
    border-radius:3px;
    background:linear-gradient(180deg,transparent,var(--rc-blue),transparent);
    box-shadow:0 0 18px rgba(0,127,255,.55);
}

.rc-arrival__stamp{
    display:inline-flex;
    align-items:center;
    margin-bottom:.85rem;
    padding:.28rem .7rem;
    border:1px dashed rgba(0,127,255,.45);
    border-radius:var(--rc-r-pill);
    color:var(--rc-sky);
    font:700 .68rem/1 var(--rc-font-display);
    letter-spacing:.14em;
    text-transform:uppercase;
    background:rgba(0,127,255,.08);
}

.rc-arrival__ticket .rc-signal{
    margin:.35rem 0 .7rem;
    text-shadow:0 0 40px rgba(0,140,255,.25);
}

.rc-arrival__ticket .rc-lead{
    max-width:42ch;
}

.rc-arrival__actions{
    display:flex;
    flex-wrap:wrap;
    gap:.7rem;
    margin-top:1.5rem;
}

.rc-arrival__actions .rc-btn--solid{
    display:inline-flex;
    align-items:center;
    gap:.55rem;
}

.rc-arrival__actions .rc-btn--solid i{
    font-size:.85em;
    opacity:.9;
}

.rc-arrival__dock{
    position:relative;
}

.rc-arrival__manifest{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0;
    margin:0;
    max-width:min(640px,100%);
    border:1px solid rgba(185,227,255,.14);
    border-radius:var(--rc-r-md);
    overflow:hidden;
    background:rgba(10,14,20,.65);
    backdrop-filter:blur(10px);
}

.rc-arrival__manifest > div{
    display:grid;
    gap:.2rem;
    padding:1rem 1.15rem;
    border-inline-start:1px solid rgba(185,227,255,.1);
}

.rc-arrival__manifest > div:first-child{
    border-inline-start:0;
}

.rc-arrival__manifest dt{
    margin:0;
    color:#5f6772;
    font-size:.66rem;
    letter-spacing:.04em;
}

.rc-arrival__manifest dd{
    margin:0;
    color:var(--rc-white);
    font:700 1.05rem var(--rc-font-display);
    font-variant-numeric:tabular-nums;
}

.rc-arrival__live{
    display:inline-flex;
    align-items:center;
    gap:.45rem;
    color:var(--rc-sky)!important;
    font-size:.92rem!important;
}

.rc-arrival__live span{
    width:.55rem;
    height:.55rem;
    border-radius:50%;
    background:#2ee59d;
    box-shadow:0 0 0 0 rgba(46,229,157,.55);
    animation:rc-live-pulse 1.8s ease-out infinite;
}

/* Motion */
@keyframes rc-aurora{
    from{transform:translate3d(0,0,0) scale(1);opacity:.85}
    to{transform:translate3d(-3%,2%,0) scale(1.06);opacity:1}
}
@keyframes rc-decal-drift{
    from{transform:rotate(-8deg) scaleX(-1) translate3d(0,0,0)}
    to{transform:rotate(-6deg) scaleX(-1) translate3d(-2%,1.5%,0)}
}
@keyframes rc-beam{
    from{opacity:.55;transform:skewY(-4deg) scaleX(.96)}
    to{opacity:.95;transform:skewY(-3deg) scaleX(1.04)}
}
@keyframes rc-express-breathe{
    0%,100%{transform:translate3d(0,0,0)}
    50%{transform:translate3d(0,-10px,0)}
}
@keyframes rc-express-breathe-mobile{
    0%,100%{transform:translateX(-50%) translate3d(0,0,0)}
    50%{transform:translateX(-50%) translate3d(0,-8px,0)}
}
@keyframes rc-pixel-run{
    0%{transform:translate3d(110vw,0,0)}
    100%{transform:translate3d(-40vw,0,0)}
}
@keyframes rc-spark{
    0%,8%{opacity:0;transform:translate3d(100vw,0,0) scale(.4)}
    12%{opacity:1}
    35%{opacity:.8;transform:translate3d(55vw,-12px,0) scale(1)}
    55%{opacity:0;transform:translate3d(20vw,-28px,0) scale(.2)}
    100%{opacity:0;transform:translate3d(-10vw,-10px,0)}
}
@keyframes rc-live-pulse{
    0%{box-shadow:0 0 0 0 rgba(46,229,157,.55)}
    70%{box-shadow:0 0 0 10px rgba(46,229,157,0)}
    100%{box-shadow:0 0 0 0 rgba(46,229,157,0)}
}

/* ===== Lines / CTA / memory ===== */
.rc-lines{position:relative;padding:clamp(5rem,11vw,9rem) 0;background:radial-gradient(circle at 85% 0%,rgba(0,127,255,.06),transparent 45%)}
.rc-lines__map{position:relative;display:grid;gap:.15rem}
.rc-lines__rail{position:absolute;top:0;bottom:0;right:1.9rem;width:2px;background:linear-gradient(180deg,transparent,rgba(0,127,255,.5) 8%,rgba(0,127,255,.5) 92%,transparent)}
.rc-lines__rail::after{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(180deg,rgba(197,204,216,.35) 0 2px,transparent 2px 22px)}

.rc-line{position:relative;z-index:1;display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:1.1rem;padding:1.15rem 1.4rem;border:1px solid transparent;border-radius:var(--rc-r-lg);background:linear-gradient(150deg,rgba(42,49,64,.55),rgba(15,19,28,.7));transition:transform var(--rc-transition),border-color var(--rc-transition),background var(--rc-transition);animation:rc-line-in .7s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * .07s)}
.rc-line:hover,.rc-line:focus-visible{transform:translateX(-8px);border-color:rgba(0,127,255,.35);background:linear-gradient(150deg,rgba(42,49,64,.85),rgba(15,19,28,.92))}
.rc-line:focus-visible{outline:2px solid var(--rc-blue);outline-offset:2px}
.rc-line__platform{color:#5f6772;font:600 .7rem var(--rc-font-display);letter-spacing:.06em}
.rc-line__signal{display:grid;place-items:center;width:46px;aspect-ratio:1;border:1px solid var(--rc-line);border-radius:50%;background:#0a0e16;color:var(--rc-blue);transition:border-color var(--rc-transition),box-shadow var(--rc-transition)}
.rc-line:hover .rc-line__signal{border-color:var(--rc-blue);box-shadow:0 0 18px rgba(0,127,255,.3)}
.rc-line__copy{display:grid;gap:.1rem;min-width:0}
.rc-line__copy strong{overflow:hidden;color:var(--rc-white);font:600 1.05rem var(--rc-font-display);text-overflow:ellipsis;white-space:nowrap}
.rc-line__copy em{color:var(--rc-muted);font-size:.74rem;font-style:normal}
.rc-line__arrow{color:var(--rc-muted);font-size:.85rem;transition:transform var(--rc-transition),color var(--rc-transition)}
.rc-line:hover .rc-line__arrow{transform:translateX(-4px);color:var(--rc-blue)}
@keyframes rc-line-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

.rc-journey-cta{position:relative;overflow:hidden;padding:clamp(5rem,11vw,9rem) 0;border-block:1px solid var(--rc-line);background:linear-gradient(120deg,#0a0e16,#141a24 60%,#0a0e16)}
.rc-journey-cta__inner{display:grid;grid-template-columns:minmax(220px,.6fr) 1fr;gap:clamp(2rem,8vw,7rem);align-items:center}
.rc-journey-cta__scene{position:relative;justify-self:center;width:min(320px,80vw)}
.rc-journey-cta__scene img{width:100%;opacity:.85;filter:drop-shadow(0 20px 30px rgba(0,127,255,.15))}
.rc-journey-cta h2{margin:.7rem 0;color:var(--rc-white);font:600 clamp(1.7rem,4vw,3rem)/1.25 var(--rc-font-display)}
.rc-journey-cta p{max-width:48ch;margin:0;color:var(--rc-muted)}
.rc-journey-cta .rc-btn{margin-top:1.1rem}

.rc-memory{padding:clamp(5rem,11vw,9rem) 0}
.rc-memory__strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(190px,240px);gap:1rem;padding:.4rem .1rem 1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin}
.rc-memory__strip>*{scroll-snap-align:start}
.rc-memory__frame{margin:0;overflow:hidden;border:1px solid var(--rc-line);border-radius:var(--rc-r-md);background:linear-gradient(150deg,rgba(42,49,64,.6),rgba(15,19,28,.75));box-shadow:0 16px 40px rgba(0,0,0,.3);transition:transform .3s ease,border-color .3s ease;animation:rc-line-in .6s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * .06s)}
.rc-memory__frame:hover{transform:translateY(-6px);border-color:rgba(0,127,255,.35)}
.rc-memory__frame button{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.rc-memory__frame img{width:100%;aspect-ratio:4/5;object-fit:cover}
.rc-memory__frame figcaption{overflow:hidden;padding:.65rem .75rem;color:var(--rc-muted);font-size:.72rem;text-align:center;text-overflow:ellipsis;white-space:nowrap}

.rc-wall-lightbox{position:fixed;inset:0;z-index:1500;display:grid;place-items:center;padding:1rem}
.rc-wall-lightbox[hidden]{display:none}
.rc-wall-lightbox__veil{position:absolute;inset:0;border:0;background:rgba(6,9,14,.92)}
.rc-wall-lightbox__panel{position:relative;z-index:1;width:min(760px,100%);padding:.7rem;border:1px solid var(--rc-line);border-radius:var(--rc-r-lg);background:var(--rc-steel);box-shadow:var(--rc-shadow)}
.rc-wall-lightbox__panel img{width:100%;max-height:76dvh;object-fit:contain;border-radius:calc(var(--rc-r-lg) - 8px)}
.rc-wall-lightbox__panel p{margin:.6rem 0 0;color:var(--rc-muted);text-align:center}
.rc-wall-lightbox__close{position:absolute;z-index:2;top:1rem;left:1rem;width:42px;height:42px;border:1px solid var(--rc-line);border-radius:50%;background:rgba(6,9,14,.75);color:var(--rc-white);font-size:1.3rem;cursor:pointer;transition:border-color var(--rc-transition)}
.rc-wall-lightbox__close:hover{border-color:var(--rc-blue)}

@media(max-width:900px){
    .rc-arrival__express{width:clamp(180px,52vw,320px);bottom:8vh;left:max(-4%,2%)}
    .rc-arrival__runner{bottom:16vh}
    .rc-arrival__decal{width:min(560px,95vw);opacity:.05}
}

@media(max-width:768px){
    .rc-arrival{
        align-items:start;
        min-height:min(820px,100dvh);
    }
    .rc-arrival__board{
        padding-top:calc(var(--rc-header-h,76px) + 1.25rem);
        padding-bottom:clamp(210px,52vw,300px);
        gap:1.25rem;
    }
    .rc-arrival__ticket{
        max-width:100%;
        padding:1.15rem 1.1rem;
        backdrop-filter:none;
        -webkit-backdrop-filter:none;
        background:rgba(10,14,20,.9);
    }
    .rc-arrival__manifest{
        grid-template-columns:1fr 1fr;
        max-width:100%;
        backdrop-filter:none;
        -webkit-backdrop-filter:none;
        background:rgba(10,14,20,.88);
    }
    .rc-arrival__manifest > div:last-child{display:none}
    .rc-arrival__mist{
        height:12%;
        opacity:.55;
    }
    .rc-arrival__beam,
    .rc-arrival__beam--soft{
        bottom:28%;
        opacity:.4;
        filter:blur(12px);
    }
    .rc-arrival__express{
        left:50%;
        bottom:1.1rem;
        width:min(260px,72vw);
        transform:translateX(-50%);
        animation:rc-express-breathe-mobile 8s ease-in-out infinite;
    }
    .rc-arrival__runner{
        bottom:calc(1.1rem + min(118px,34vw));
        height:clamp(44px,12vw,72px);
    }
    .rc-arrival__pixel{animation-duration:12s}
    .rc-journey-cta__inner{grid-template-columns:1fr;text-align:center}
    .rc-journey-cta__scene{width:min(240px,60vw)}
    .rc-line{padding:1rem}
    .rc-line__copy strong{font-size:.95rem}
    .rc-lines__rail{right:1.55rem}
}

@media(max-width:480px){
    .rc-arrival__board{padding-bottom:clamp(190px,58vw,260px)}
    .rc-arrival__express{width:min(230px,78vw);bottom:.85rem}
    .rc-arrival__runner{bottom:calc(.85rem + min(100px,36vw))}
    .rc-arrival__beam,.rc-arrival__beam--soft{opacity:.3}
    .rc-line__platform{display:none}
    .rc-lines__rail{display:none}
    .rc-memory__strip{grid-auto-columns:minmax(150px,180px)}
}

@media(prefers-reduced-motion:reduce){
    .rc-arrival__aurora,
    .rc-arrival__decal,
    .rc-arrival__beam,
    .rc-arrival__beam--soft,
    .rc-arrival__express,
    .rc-arrival__pixel,
    .rc-arrival__sparks i,
    .rc-arrival__live span{animation:none}
    .rc-arrival__pixel{left:8%;transform:none}
    .rc-arrival__express{transform:none}
    @media(max-width:768px){
        .rc-arrival__express{transform:translateX(-50%)}
    }
    .rc-line,.rc-memory__frame{animation:none;opacity:1;transform:none}
}

html.rc-scrolling .rc-line,
html.rc-scrolling .rc-memory__frame{transition:none!important}
