/* ============================================================
   Hero "drawer" effect for content pages (about, how-it-works,
   solutions, security, media). Mirrors the homepage hero drawer:
   the hero video is pinned full-viewport behind a purple backdrop,
   and the page content rises over it like a closing drawer.
   The JS in js/hero-drawer.js wraps the post-hero content in
   .ucr-papa and drives the darkening + magnetic snap + lock.
   ============================================================ */

/* Purple backdrop + gradual dark shade behind the pinned video */
.hero-purple-bg{
    position:fixed; inset:0; z-index:-3; pointer-events:none;
    /* היה סגול מלא — בזמן טעינת הווידאו כל המסך נצבע בו. הוחלף באפור
       בהיר מאוד, כך שההמתנה לסרטון נראית כמו דף נקי ולא כמשטח צבע. */
    background:#F5F5F7;
}
.hero-video-shade{
    position:fixed; top:0; left:0; width:100%; height:100vh; z-index:-1;
    background:#000; opacity:0; pointer-events:none; will-change:opacity;
}

/* Hero becomes a full-height spacer; its video is pinned behind everything */
#main.hero.hero--image-only{
    min-height:100vh !important; height:100vh !important; max-height:none !important;
    margin:0 !important; padding:0 !important; background:transparent !important;
    overflow:visible !important; pointer-events:none;
}
#main.hero.hero--image-only video.hero-bg,
#main.hero.hero--image-only .hero-bg{
    position:fixed !important; top:0 !important; left:0 !important;
    width:100vw !important; height:100vh !important; object-fit:cover !important;
    z-index:-2 !important; pointer-events:none; background:transparent !important;
    opacity:1 !important; visibility:visible !important; transform:none !important;
}

/* The wrapped post-hero content is the opaque page that rises over the video,
   with square top edges and a drawer shadow — identical to the homepage. */
.ucr-papa{
    position:relative; z-index:1; border-radius:0 !important;
    box-shadow:0 -16px 40px rgba(0,0,0,.22);
    background:var(--ucr-surface, #ffffff);
}
html[data-theme="dark"] .ucr-papa{ background:var(--ucr-surface, #0b1220); }

/* Let the pinned hero ignore clicks while its content takes over */
#main.hero.hero--image-only + .ucr-papa{ pointer-events:auto; }