/* Site-specific additions (not part of the original Elementor export) */

/* Page transition loader */
    #kt-page-loader{position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;background:#0f1417;opacity:1;visibility:visible;transition:opacity .25s ease,visibility .25s ease;}
    #kt-page-loader.kt-loader-hidden{opacity:0;visibility:hidden;}
    .kt-logo-wrap{position:relative;width:180px;max-width:45vw;aspect-ratio:4240/3460;}
    .kt-logo-static{display:block;width:100%;height:100%;}
    .kt-logo-spin{position:absolute;left:31.86%;top:46.47%;width:36.25%;height:45.90%;animation:kt-spin 3s linear infinite;transform-origin:50% 50%;}
    @keyframes kt-spin{to{transform:rotate(360deg);}}

/* Contact section spacing fix */
    .elementor-343 .elementor-element.elementor-element-4dcfcd0{padding:20px 0 40px!important;margin-bottom:30px!important;position:relative;z-index:2;}

/* Responsive safety net: several Elementor widgets (notably the hero
   image) have a fixed pixel height baked into their per-widget inline
   CSS with no matching width limit. On narrow viewports the browser
   preserves aspect ratio and blows the image width past its container;
   because the container itself shrinks/grows to fit that image (rather
   than stretching to its own parent), the overflow cascades outward and
   the whole page gains horizontal scroll/blank space. Force both the
   container and the image to respect the actual column width. */
    @media (max-width:1024px){
        .elementor-widget-image .elementor-widget-container {
            width:100%!important;
            max-width:100%!important;
        }
        .elementor-widget-image img,
        .elementor-widget-container > img {
            max-width:100%!important;
            width:auto!important;
            height:auto!important;
        }
    }

/* "Arrive in Egypt" hero band: its background-image is forced to a
   fixed 721px width regardless of viewport (see
   .elementor-element-d792ec9 in elementor-inline.css), while the
   section itself keeps a fixed 712px min-height on every screen size.
   On phones the image no longer covers the full height at that fixed
   width, leaving a large blank gap below it. Force the background to
   actually cover the section on narrow viewports. */
@media (max-width:1024px){
    .elementor-element-d792ec9:not(.elementor-motion-effects-element-type-background){
        background-size: cover !important;
    }
}

/* "Expertly Crafted Kemetian Experiences" photo collage: both the
   rectangular photo's corner radius (400px) and the circular photo's
   negative top margin (-230px, pulling it up to overlap its sibling)
   were tuned for their much larger desktop/tablet size. On narrow
   phones the same fixed-pixel radius exceeds the image's own width -
   clamping into a big rounded blob that hides most of the photo behind
   white page background - and the same fixed overlap now covers most
   or all of the smaller image's height, leaving a blank gap where
   content should continue. Scale both down for phones. */
@media (max-width:767px){
    .elementor-element-48b031a3 img{
        border-radius: 24px !important;
    }
    .elementor-element-55b6d10f > .elementor-widget-container{
        margin-top: -70px !important;
    }
}

/* Hero logo: its mobile-breakpoint override sets a uniform -118px
   margin on all four sides plus an 880px fixed container width - both
   tuned for a much larger viewport. On phones the 880px box overflows
   sideways and the equal negative margin yanks the whole thing toward
   the top-left instead of the intended centered position. Give it a
   sane, viewport-relative width and drop the stray margin so the
   existing flex centering (align-self:center) can do its job. */
@media (max-width:767px){
    .elementor-343 .elementor-element.elementor-element-1966e29{
        --container-widget-width: 92% !important;
        width: 92% !important;
        max-width: 92% !important;
    }
    .elementor-343 .elementor-element.elementor-element-1966e29 > .elementor-widget-container{
        margin: 0 !important;
    }
    .elementor-343 .elementor-element.elementor-element-1966e29 img{
        height: auto !important;
    }
}

/* Events page floating button - stays visible while scrolling */
    .kt-events-bar{position:fixed;top:18px;right:18px;z-index:100000;display:inline-block;background:#FFCB36;color:#0f1417;font-family:'Outfit',sans-serif;font-weight:700;font-size:.85rem;padding:12px 20px;border-radius:999px;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,0.25);}
    .kt-events-bar:hover{filter:brightness(0.95);}
    @media (max-width:600px){
        .kt-events-bar{top:12px;right:12px;font-size:.72rem;padding:9px 14px;}
    }
