.case-study-cinematic-hero{isolation:isolate;background:#050609!important;position:relative;overflow:hidden}
.case-study-cinematic-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#050609 5%,rgba(5,6,9,.94) 37%,rgba(5,6,9,.58) 61%,rgba(5,6,9,.18)),url('../images/hero-cinematic/space.webp') center/cover;opacity:.30;pointer-events:none}
.case-study-cinematic-hero::after{content:"";position:absolute;inset:0;z-index:-1;width:auto;height:auto;background:radial-gradient(ellipse at 88% 40%,var(--world-nebula, #183a60),transparent 60%);opacity:.12;pointer-events:none}
.lp-case-study-planet{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:0;transition:opacity .5s ease}
.case-study-cinematic-hero[data-scene="ready"] .lp-case-study-planet{opacity:1}
.case-study-cinematic-hero .ewallet-hero-inner,.case-study-cinematic-hero .project-case-study-hero-inner{position:relative;z-index:1}
.lp-case-study-fallback{position:absolute;inset:0;z-index:0;background-image:var(--case-fallback-desktop);background-position:center;background-size:cover;display:none;pointer-events:none}
.case-study-cinematic-hero[data-scene="fallback"] .lp-case-study-fallback{display:block}
.case-study-cinematic-hero[data-animation="paused"] .ewallet-hero-illustration{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.lp-case-study-planet{transition:none}.case-study-cinematic-hero .ewallet-hero-illustration{animation:none}}

@media(max-width:699px){.case-study-cinematic-hero::before{background-image:linear-gradient(180deg,#050609 0%,rgba(5,6,9,.90) 45%,rgba(5,6,9,.25) 78%),url('../images/hero-cinematic/space.webp')}}

.lp-case-study-horizon{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,#050609 0%,rgba(5,6,9,.96) 48%,rgba(5,6,9,.5) 70%,rgba(5,6,9,.15)),url('../images/bg/footerbg.webp') center/cover;mask:url('../images/hero-cinematic/contact-horizon-mask.svg') center/cover no-repeat;-webkit-mask:url('../images/hero-cinematic/contact-horizon-mask.svg') center/cover no-repeat;opacity:.6}
.case-study-cinematic-hero[data-scene="fallback"] .lp-case-study-horizon{display:none}

@media(max-width:699px){.lp-case-study-fallback{background-image:var(--case-fallback-mobile)}}


/* Shared approved environment; existing artwork transforms remain page-owned. */
.case-study-cinematic-hero .ewallet-hero-art::before {
    content: "";
    position: absolute;
    inset: -4% -8%;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(ellipse at 52% 48%, rgba(2, 5, 10, .22) 0%, rgba(2, 5, 10, .12) 43%, transparent 73%);
}
.ewallet-case-study > .ewallet-hero .ewallet-hero-illustration {
    /* Keep the phones unchanged; reduce only their baked floor reflection ~20%. */
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 68%, rgba(0, 0, 0, .6) 86%, rgba(0, 0, 0, .429) 90%, rgba(0, 0, 0, .274) 92%, rgba(0, 0, 0, .137) 96%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 68%, rgba(0, 0, 0, .6) 86%, rgba(0, 0, 0, .429) 90%, rgba(0, 0, 0, .274) 92%, rgba(0, 0, 0, .137) 96%, transparent 100%);
}
.case-study-cinematic-hero .ewallet-hero-meta span {
    padding: 6.75px 10px;
    border-color: rgba(255, 255, 255, .23);
    background: rgba(5, 7, 10, .45);
    color: #f4f3ef;
}
.ewallet-hero-transition {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: clamp(80px, 11vh, 130px);
    z-index: 0;
    pointer-events: none;
    background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, .22) 30%, rgba(0, 0, 0, .76) 72%, #000 100%);
}
.case-study-cinematic-hero[data-case-study="ewallet"] + .ewallet-content-shell > .ewallet-story-row:first-child {
    border-top-color: transparent;
}
@media (max-width: 699px) {
    .ewallet-hero-transition { height: clamp(70px, 10vh, 100px); }
    .case-study-cinematic-hero .ewallet-hero-art::before { opacity: .8; }
}

/* Stage 4 — case-owned environment, without changing content geometry. */
.case-study-cinematic-hero {background:#000!important;--case-progress:0}
.case-study-cinematic-hero::before {opacity:.16;mask-image:linear-gradient(#000 60%,transparent);-webkit-mask-image:linear-gradient(#000 60%,transparent)}
.case-study-cinematic-hero::after {opacity:.045}
.case-study-cinematic-hero .lp-case-study-planet {opacity:0;transition:opacity .65s ease;mask-image:linear-gradient(#000 64%,transparent 100%);-webkit-mask-image:linear-gradient(#000 64%,transparent 100%)}
.case-study-cinematic-hero[data-scene="ready"] .lp-case-study-planet {opacity:calc(1 - var(--case-progress)*.75)}
.case-study-cinematic-hero .lp-case-study-horizon {opacity:calc(.38 - var(--case-progress)*.24)}
.case-study-cinematic-hero .ewallet-hero-illustration {animation:none!important;filter:drop-shadow(0 16px 22px rgba(0,0,0,.20))}
.case-study-cinematic-hero .ewallet-hero-transition {height:clamp(100px,15vh,155px);background:linear-gradient(transparent,#000)}
.ewallet-content-shell .project-visual-panel,.ewallet-content-shell .ewallet-visual-panel {box-shadow:0 18px 45px rgba(0,0,0,.18);transition:box-shadow .35s ease}
.ewallet-content-shell a:focus-visible,.case-study-cinematic-hero a:focus-visible {outline:2px solid #ffae42;outline-offset:5px}
@media(prefers-reduced-motion:reduce){.case-study-cinematic-hero .lp-case-study-planet,.ewallet-content-shell .project-visual-panel,.ewallet-content-shell .ewallet-visual-panel{transition:none}}
/* Keep the original mobile-device and dashboard framing; soften only their surround. */
.ewallet-screen-gallery .website-screen-frame {box-shadow:0 26px 70px rgba(0,0,0,.42),0 0 32px rgba(255,164,68,.025)}
.ewallet-screen-gallery .ewallet-phone-device {filter:drop-shadow(0 22px 30px rgba(0,0,0,.24))}
/* Resolve dashboard slides against the viewport rather than a percentage inside
   a max-content track. This also restores the original Next/Previous model on phones. */
.ewallet-screen-gallery .website-screen-frame .ewallet-phone-screen-track {width:100%}
.ewallet-screen-gallery .website-screen-frame .ewallet-phone-shot {flex:0 0 100%;width:100%;min-width:0}

/* Server-rendered poster is visible before any scene code or renderer download. */
.case-study-cinematic-hero:not([data-scene="ready"]) .lp-case-study-fallback{display:block}
