@charset "utf-8";
/*--
	Add your style here
--*/ 
.menu-wrap {
        right:0 !important;
	-webkit-transform: translate3d(320px,0,0);
	transform: translate3d(320px,0,0);
	visibility:hidden;
}

.show-menu .menu-wrap,
.show-menu .menu-inner ,
.show-menu .morph-shape  {
        -webkit-transform: translate3d(-30px,0,0);
        transform: translate3d(-30px,0,0);
}
.show-menu .menu-wrap {
	right:0;
	opacity:1;
	visibility:visible;
}

/* ===== 2026-05 responsive fixes + motion effects ===== */
/* Mobile navigation: extend the dropdown so all menu items are visible. */
@media only screen and (max-width: 1064px) {
    .nav-holder {
        width: 290px !important;
        min-height: 300px !important;
        height: auto !important;
        max-height: calc(100vh - 90px) !important;
        padding: 36px 38px 34px !important;
        overflow-y: auto !important;
        transform-origin: top right;
        animation: navDropIn 0.32s cubic-bezier(.22, .61, .36, 1) both;
    }

    .nav-holder nav ul li {
        padding: 12px 0 !important;
    }

    .nav-holder nav li a,
    .nav-holder nav li ul li a {
        line-height: 1.35 !important;
    }
}

@media only screen and (max-width: 540px) {
    .nav-holder {
        width: min(310px, calc(100vw - 40px)) !important;
        min-height: 310px !important;
    }
}

/* Access map: keep the Google map centered on mobile and desktop. */
.access-map-wrap {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.access-map-wrap iframe,
.access-map,
.service-content-about .container > iframe[title*="Google Maps"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

@media only screen and (max-width: 768px) {
    .access-map-wrap {
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .access-map-wrap iframe,
    .access-map,
    .service-content-about .container > iframe[title*="Google Maps"] {
        float: none !important;
        clear: both !important;
    }
}

/* Subtle motion effects for desktop and mobile without changing content/layout. */
@keyframes navDropIn {
    from {
        opacity: 0;
        transform: translateY(-10px) scale(.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes headerSoftIn {
    from {
        opacity: 0;
        transform: translateY(-12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

header.main-header {
    animation: headerSoftIn .48s ease-out both;
}

.logo-holder img,
.nav-button span,
.btn,
.box-item img,
.respimg,
.access-map-wrap iframe,
#contact-form input,
#contact-form textarea,
#submit {
    transition: transform .36s ease, box-shadow .36s ease, opacity .36s ease, filter .36s ease, background-color .36s ease;
}

.nav-button-wrap:hover .nav-button span:first-child {
    width: 100%;
}

@media (hover: hover) {
    .logo-holder:hover img {
        transform: translateY(-2px);
    }

    .btn:hover,
    #submit:hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 30px rgba(0,0,0,.12);
    }

    .box-item:hover img {
        transform: scale(1.03);
        filter: brightness(1.04);
    }

    .access-map-wrap:hover iframe {
        box-shadow: 0 16px 45px rgba(0,0,0,.12);
    }
}

#contact-form input:focus,
#contact-form textarea:focus {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,0,0,.08);
    outline: none;
}

.js-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .68s cubic-bezier(.22,.61,.36,1), transform .68s cubic-bezier(.22,.61,.36,1);
    will-change: opacity, transform;
}

.js-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }

    .js-reveal {
        opacity: 1 !important;
        transform: none !important;
    }
}
