/* ---- custom.css FINAL ---- */

/* 1) Never lock the whole page */
html, body {
    height: auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    position: static !important;
}

/* 2) Common template “lock body” classnames: unlock them all */
body.menu-show,
body.offcanvas-menu,
body.overflow-hidden,
html.nav-open,
body.nav-open {
    overflow: auto !important;
    position: static !important;
    height: auto !important;
    width: auto !important;
}

/* 3) Prevent overlays/menus from blocking the page */
.menu-overlay,
.site-overlay,
.offcanvas,
.offcanvas-menu,
.mobile-menu,
.js-fh5co-offcanvas,

    /* 4) Loader should never block interaction */
#ftco-loader {
    display: none !important;
    pointer-events: none !important;
}

/* 5) Mobile fix: allow scrolling, don’t force hard 100vh */
@media (max-width: 992px) {
    .js-fullheight,
    .fullscreen,
    .home-slider,
    .home-slider .owl-stage-outer,
    .home-slider .owl-stage,
    .home-slider .owl-item,
    .home-slider .slider-item,
    .home-slider .slider-text {
        height: auto !important;
        min-height: 80vh !important; /* Keep hero height but allow further scrolling */
    }

    /* Ensure vertical gesture works */
    .home-slider,
    .home-slider * {
        touch-action: pan-y !important;
    }
}

/* Restore dark overlays only where needed */
.home-slider .overlay,
.testimony-hero .overlay,
.ftco-counter .overlay {
    display:block !important;
    pointer-events:none !important;   /* Don’t intercept touch */
    background: rgba(0,0,0,.45);      /* Increase .45 to .55/.6 if you want darker */
}

/* About: video card (responsive, no fixed width/height) */
.about-video{
    position: relative;
    width: 100%;
    border-radius: 15px;
    overflow: hidden;
    background:#000;
    /* Reserve 16:9 space to avoid layout shift before video loads */
    aspect-ratio: 16 / 9;
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
}

.about-video__media{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover; /* Fill and crop to avoid letterboxing */
    background:#000;
}

.about-video__scrim{
    position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 20%, rgba(0,0,0,.35) 100%);
    pointer-events:none;
}

.about-video__badge{
    position:absolute; top:14px; left:14px;
    padding:6px 12px;
    font: 600 12px/1.1 "Poppins",system-ui,sans-serif;
    letter-spacing:.06em; text-transform:uppercase;
    color:#fff; background:rgba(0,0,0,.4);
    border:1px solid rgba(255,255,255,.25);
    border-radius:999px; backdrop-filter: blur(4px) saturate(130%);
}

.about-video__hint{
    position:absolute; left:16px; bottom:16px;
    display:inline-flex; align-items:center; gap:10px;
    padding:10px 14px; border:0; cursor:pointer;
    font:600 13px/1 "Poppins",system-ui,sans-serif; color:#fff;
    background:rgba(0,0,0,.45);
    border:1px solid rgba(255,255,255,.25);
    border-radius:12px; backdrop-filter: blur(4px) saturate(130%);
    transition: transform .15s ease, background .15s ease;
}
.about-video__hint:hover{ transform: translateY(-1px); background:rgba(0,0,0,.55); }

.about-video__icon{
    display:inline-grid; place-items:center;
    width:26px; height:26px; border-radius:50%;
    background:#e8b84b; color:#111; font-weight:800; font-size:12px;
}

/* Mobile tweaks */
@media (max-width: 768px){
    .about-video{ border-radius:12px; aspect-ratio: 16 / 9; }
    .about-video__hint{ padding:8px 12px; font-size:12px; }
    .about-video__icon{ width:24px; height:24px; font-size:11px; }
}