/* Base */
html { scroll-behavior: smooth; }
body {}

.scroll-downs {
    bottom: 25px;
    color: #3555ff;
    display: block;
    justify-content: center;
    height: auto;
    left: 46%;
    right: auto;
    opacity: 1;
    position: absolute;
    width: 45px;
    z-index: 100;
    margin-bottom: 150px !important;
    /* removed redundant scroll-behavior */
}

.mousey {
    width: 3px;
    padding: 10px 15px;
    height: 35px;
    border: 2px solid #27310a;
    border-radius: 25px;
    opacity: 0.75;
    box-sizing: content-box;
}
.scroller {
    width: 3px;
    height: 12px;
    border-radius: 25%;
    background-color: #27310a;
    animation: scroll 2.2s cubic-bezier(.15,.41,.69,.94) infinite;
}
@keyframes scroll {
    0% { opacity: 0; }
    10% { transform: translateY(0); opacity: 1; }
    100% { transform: translateY(15px); opacity: 0; }
}



.second-image { background-color: #405089 !important; opacity: 0.5 !important; }
.member figcaption { background: #405089; opacity: 0.9 !important; }

/* Flip boxes */
.flip-box-front {
    background-image: linear-gradient(to right top, #46b431, #7bbc1a, #a9c200, #d4c600, #ffc810);
    border: 1px solid #95bf0b !important;
}
.flip-box .flip-box-back {
    background-image: linear-gradient(to right top, #46b431, #7bbc1a, #a9c200, #d4c600, #ffc810);
    border: 1px solid #95bf0b !important;
}

/* Branding / header */
.top-logo a img { height: 58px !important; }


/* Content colors */
.featured-services .content-wrapper .container .content-box p { color: #0a144a !important; }
.home-title-tagline { margin-top: 30px; color: #ffffff; }

.page-header { padding-top: 90px; padding-bottom: 10px; }

.video-size { height: 105%; }
.side-image-content .video video { margin-left: -10% !important; opacity: 1 !important; }

/* Buttons */
.btn-group-lg > .btn-lg { border: 0 !important; }
.btn-custom-dark { background-color: #fff !important; }


.btn-custom {
    display: inline-block;
    padding: 0 40px;
    height: 60px;
    line-height: 60px;               /* vertically center text */
    background-color: #fff;
    color: #0a1954;
    border: 1px solid #262d57;
    border-radius: 2px;
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: 0.3px;
    text-decoration: none;
    cursor: pointer;
    position: relative;               /* for ::before positioning */
    overflow: hidden;                 /* hide sliding layer overflow */
    transition: color .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
    z-index: 0;                       /* create a new stacking context */
}

/* slide effect layer lives behind the text */
.button_slide.slide_right::before {
    content: "";
    position: absolute;
    inset: 0;                         /* full size of button */
    background: #ffc810;              /* yellow slide bg */
    transform: translateX(-100%);     /* start off-canvas to the left */
    transition: transform .4s ease-out;
    z-index: -1;                      /* << keep it behind the caption */
}

/* animate in on hover/focus/active */
.button_slide.slide_right:hover::before,
.button_slide.slide_right:focus-visible::before,
.button_slide.slide_right:active::before {
    transform: translateX(0);
}

/* caption color when the yellow bg is visible */
.button_slide.slide_right:hover,
.button_slide.slide_right:focus-visible,
.button_slide.slide_right:active {
    color: #27310b;
    text-decoration: none;
}

/* accessibility: strong keyboard focus ring */
.btn-custom:focus-visible {
    outline: none;
    box-shadow:
            0 0 0 2px rgba(255, 255, 255, 0.9),
            0 0 0 5px rgba(38, 45, 87, 0.4),
            0 0 0 8px rgba(255, 200, 16, 0.55);
}

/* pressed state */
.btn-custom:active { transform: translateY(1px); }

/* disabled helper */
.btn-custom.is-disabled,
.btn-custom[aria-disabled="true"] {
    opacity: .6;
    pointer-events: none;
}

/* size variants (optional) */
.btn-custom.btn-sm { height: 44px; line-height: 44px; padding: 0 20px; font-size: .9rem; }
.btn-custom.btn-lg { height: 68px; line-height: 68px; padding: 0 48px; font-size: 1.0625rem; }

/* high-contrast on dark sections (optional) */
.bg-dark .btn-custom,
.text-bg-dark .btn-custom {
    border-color: #e5e7eb;
    background-color: #fff;
    color: #0a1954;
}

/* reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .button_slide.slide_right::before { transition: none; transform: none; }
    .btn-custom { transition: none; }
}

/* Headings */
.container h3 { color: #27310a !important; }

.icon-content-box .content-box span,
.flip-box-back h4,
.flip-box-back p { color: #27310a; }
.flip-box-back h4 { color: #27310a !important; }

/* Footer */
.footer { background: #ffc810; margin-top: 10px; }
.footer .content-wrapper { margin-top: 30px; }
.footer .content-wrapper p,
.footer .content-wrapper .footer-menu li a,
.footer .content-wrapper .contact-box,
.footer .content-wrapper .contact-box ul li a,
.footer .sub-footer { color: #24355a; }

/* Nav & z-index layering */
.sandwich-menu { position: fixed; z-index: 900; } /* below navbar */
.header, .navbar { position: relative; z-index: 1000; }
.navbar .dropdown, .navbar .dropdown-menu { position: absolute; z-index: 1050; }
.content-box, .card { position: relative; z-index: 1; }
.navbar .container { overflow: visible; }

/* Tables */
.tableFixHead { overflow: auto; height: 500px; }
.tableFixHead thead th { position: sticky; top: 0; z-index: 1; }
table { border-collapse: collapse; width: 100%; }
th, td { padding: 8px 16px; }
th { background: #fff; }

/* Hero title */
.hero-title span {
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}
.hero-title .easy { color: #ffc000 !important; }
.hero-title .ops { color: #48b62f !important; }

/* Cards & images */
.image-content-box .col-12 { padding: 10px !important; }
.content-box.card { transition: transform .15s ease, box-shadow .15s ease !important; }
.content-box.card:hover { transform: translateY(-2px) !important; }
.content-box .card-img-top img { transition: transform .25s ease; }
.content-box.card:hover .card-img-top img { transform: scale(1.02); }

/* Sections / overlays */
.dtr-section { position: relative; }
.dtr-section-with-bg { background-position: center center; background-repeat: no-repeat; background-size: cover; }
.dtr-overlay { position: absolute; inset: 0; z-index: 1; }
.dtr-overlay-green { background-color: rgba(252,196,4,.9); }
.dtr-overlay-content { position: relative; z-index: 10; }
.hero-section-top-padding { padding-top: 95px; }
.hero-svg-bg-absolute { position: absolute; left: 0; bottom: 0; z-index: 9; }

.header .topbar { width: 100%; height: 70px; }
.header .navbar { width: 100%; max-width: 2000px; margin: 0 auto; }

/* Brand utilities */
.brand-easy { color: #ffc000; }
.brand-ops { color: #48b62f; }

/* Accessibility (if not using Bootstrap’s helper) */
.visually-hidden {
    position: absolute !important; width: 1px !important; height: 1px !important;
    padding: 0 !important; margin: -1px !important; overflow: hidden !important;
    clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important;
}

/* Calendly tweak*/
.calendly-badge-widget { bottom: 70px !important; }
.calendly-badge-widget .calendly-badge-content { border-radius: 2px !important; }


/* Mobile only */
@media (max-width: 768px){
    .calendly-badge-widget {  display: none !important; }
    .topbar {
        height: 2px !important;
    }
    .hero-section-top-padding {
        padding-top: 45px !important;;
    }
    .dtr-overlay-green {
        background-color: rgba(252, 196, 4, 1);
    }
}

/* Responsive */
@media (max-width: 991px) {
    .video-size { width: 100%; height: auto; }
    .side-image-content .video video { margin-left: 0 !important; }
    .sandwich-menu .nav-menu { margin-bottom: 300px; }
    .hero-section-top-padding { padding-top: 130px; }
}

/* Make the panel sit above header & content */
.sandwich-menu {
    z-index: 1050; /* was 9 */
}

/* Show the nav when the menu is open */
.sandwich-menu.open .nav-menu {
    display: block; /* was display:none by default */
}

/* Fix text contrast against light gradient */
.sandwich-menu .nav-menu li a {
    color: #27310a;           /* dark ink instead of #fff */
    text-decoration: none;
}
.sandwich-menu .nav-menu li a:hover {
    opacity: .8;
}



/* Optional: prevent body scroll when open */
.no-scroll { overflow: hidden; }

@media (max-width: 767px) {
    .home-title-tagline { margin-top: 250px; }
    .bg-image { background-position: 40% !important; }
    .slide-inner1 {
        background-image: linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.8)), url("../images/s1easyops-01ec5ed9f10aefe29540350c6a781b12.png") !important;
    }
    .slide-inner2 {
        background-image: linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.8)), url("../images/s3easyops-d11e49db26d4b1f6175396ec8987543b.png") !important;
    }
    .slide-inner3 {
        background-image: linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.8)), url("../images/s2easyops-90b9afe66442d81e6699bfe90c409063.png") !important;
    }
    .slider .swiper-slide a {
        background-image: linear-gradient(to right, rgba(255,255,255,.3), rgba(255,255,255,.5)) !important;
    }
    .mousey, .scroller { display: none; }
}

@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
    .sandwich-menu {
        width: 50vw;
    }

}

.sandwich-menu {
    z-index: 1050;
}

.sandwich-menu .nav-menu li a {
    color: #0f0c01;
}

.gradient-overlay {
    position: relative;
    z-index: 0;
}

.gradient-overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(
            250deg,
            #ffc810 0%,
            #46b431 100%
    );
    opacity: 0.80; /* adjust to taste */
    z-index: -1;
}

.glass-bg {
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 0.75rem;
    padding: 1.5rem;
}

.footer-menu a {
    text-decoration: none !important;
}
.footer-menu a:focus,
.footer-menu a:hover {
    text-decoration: underline;
}
.site-footer .accordion-button {
    font-weight: 600;
    font-size: 1rem;
}
.site-footer a {
    font-size: 0.95rem; /* readable but compact */
}
@media (max-width: 991.98px) { /* ≤lg */
    .site-footer a { padding: .25rem 0; }
}
.border-top {
    border-top: 3px solid #ffc000 !important;
}


/* Footer section headings */
.site-footer h6 {
    font-size: 0.85rem;       /* matches your small fw-bold */
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}

/* Make links in footer headings look like headings */
.site-footer h6 a {
    color: inherit;           /* same as surrounding heading */
    text-decoration: none;    /* remove underline */
    transition: color 0.2s ease-in-out;
}

.site-footer h6 a:hover,
.site-footer h6 a:focus {
    color: #ffc810;           /* or your brand accent */
    text-decoration: none;    /* keep clean */
}