/*--------------------------------------------------------------
  SBInfratech Custom Theme Overrides
  - Header: Grey colour scheme
  - Buttons & Accents: Primary Red (#c1121f)
--------------------------------------------------------------*/

/* ============================================================
   LOGO SIZES — Header, Footer, Mobile Nav
   ============================================================ */

/* Header logo — Auto × 85px */
.main-menu__logo img,
.main-menu .main-menu__logo a img,
.stricky-header .main-menu__logo img {
    width: auto !important;
    height: 85px !important;
    max-height: 85px !important;
    object-fit: contain !important;
    display: block !important;
}


/* Footer logo — 270 × 180px */
.footer-widget__logo img,
.footer-widget__logo a img {
    width: 270px !important;
    height: 180px !important;
    object-fit: contain !important;
    display: block !important;
}

/* Mobile nav logo */
.mobile-nav .logo-box img,
.mobile-nav__logo img {
    width: 160px !important;
    height: 80px !important;
    object-fit: contain !important;
    display: block !important;
}

/* ============================================================
   TOP INFO BAR — Medium Grey
   ============================================================ */
.main-header-three__top,
.main-header-three__top-wrapper {
    background-color: #4a5568;
}

/* Icons in top bar → white */
.main-header-three__address-list li .icon span {
    color: #ffffff;
}

/* Text and links in top bar → light */
.main-header-three__address-list li .content p,
.main-header-three__top-text {
    color: rgba(255, 255, 255, 0.85);
}

.main-header-three__address-list li .content p a {
    color: rgba(255, 255, 255, 0.85);
}

.main-header-three__address-list li .content p a:hover {
    color: #ffffff;
}

/* "Get Quote" button → primary red */
.main-header-three__top-get-quote a {
    background-color: var(--adbaiz-base);
    color: #ffffff;
    border-radius: 3px;
}

.main-header-three__top-get-quote a:hover {
    background-color: #9b0e16;
    color: #ffffff;
}

/* ============================================================
   MAIN NAV BAR — Darker Grey
   ============================================================ */
.main-menu-three,
.stricky-header.main-menu-three {
    background-color: #2d3748;
}

/* Nav links → white */
.main-menu-three .main-menu__list>li>a {
    color: #ffffff;
}

.main-menu-three .main-menu__list>li>a:hover,
.main-menu-three .main-menu__list>li.current>a {
    color: var(--adbaiz-base);
}

/* Sub-menu dropdown */
.main-menu-three .main-menu__list .sub-menu {
    background-color: #2d3748;
}

.main-menu-three .main-menu__list .sub-menu li a {
    color: rgba(255, 255, 255, 0.85);
}

.main-menu-three .main-menu__list .sub-menu li a:hover {
    color: var(--adbaiz-base);
}

/* Phone icon in nav header */
.main-menu-three__support-icon {
    border-color: rgba(255, 255, 255, 0.4);
    color: #ffffff;
}

.main-menu-three__support-sub-title,
.main-menu-three__support-number,
.main-menu-three__support-number a {
    color: rgba(255, 255, 255, 0.85);
}

.main-menu-three__support-number a:hover {
    color: var(--adbaiz-base);
}

/* "Contact Us" nav button → primary red */
.main-menu-three__btn,
a.main-menu-three__btn {
    background-color: var(--adbaiz-base) !important;
    color: #ffffff !important;
    border-radius: 3px;
}

.main-menu-three__btn:hover,
a.main-menu-three__btn:hover {
    background-color: #9b0e16 !important;
    color: #ffffff !important;
}

/* Mobile nav toggler → white */
.main-menu-three .mobile-nav__toggler i {
    color: #ffffff;
}

/* ============================================================
   PRIMARY BUTTONS (thm-btn) — Red (reinforce)
   ============================================================ */
.thm-btn {
    background-color: var(--adbaiz-base);
    color: #ffffff;
}

.thm-btn:hover {
    color: #ffffff;
}

.thm-btn:after {
    background-color: #9b0e16;
}

/* ============================================================
   SUBSCRIBE BUTTON — Red
   ============================================================ */
.subscribe-one__btn {
    background-color: var(--adbaiz-base);
    color: #ffffff;
}

.subscribe-one__btn:hover {
    background-color: #9b0e16;
}

/* ============================================================
   FOOTER SUBSCRIBE BUTTON — Red accent icon
   ============================================================ */
.footer-widget-three__subscribe-btn {
    background-color: var(--adbaiz-base);
    color: #ffffff;
}

.footer-widget-three__subscribe-btn:hover {
    background-color: #9b0e16;
}

/* ============================================================
   PAGE HEADER BREADCRUMB ARROWS — Red
   ============================================================ */
.thm-breadcrumb li a:hover {
    color: var(--adbaiz-base);
}

/* ============================================================
   CONTACT FORM SUBMIT — Red
   ============================================================ */
.contact-form__btn,
.contact-one__form .thm-btn {
    background-color: var(--adbaiz-base);
    color: #ffffff;
}

/* ============================================================
   BLOG / UPDATES — Read More links: Red
   ============================================================ */
.blog-one__btn-2 a {
    color: var(--adbaiz-base);
}

.blog-one__btn-2 a:hover {
    color: #9b0e16;
}

/* ============================================================
   PRODUCT ARROW LINKS — Red
   ============================================================ */
.project-one__arrow {
    background-color: var(--adbaiz-base);
    color: #ffffff;
}

.project-one__arrow:hover {
    background-color: #9b0e16;
}

/* ============================================================
   HERO / MAIN SLIDER — Remove Grey Overlay
   ============================================================ */
.main-slider .swiper-slide {
    background-color: transparent !important;
}

.main-slider .image-layer {
    mix-blend-mode: normal !important;
}

/* Dark overlay so white slider text is readable over bright images */
.main-slider .swiper-slide::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 2;
    pointer-events: none;
}

/* ============================================================
   PRODUCT DETAILS MAIN IMAGE SIZE & OVERLAY REMOVAL
   ============================================================ */
#product-main-image {
    width: 650px !important;
    height: 450px !important;
    object-fit: cover;
}

.project-details__digital-solution-img-shape-1,
.project-details__digital-solution-img-shape-2,
.project-details__digital-solution-img-shape-3 {
    display: none !important;
}

/* ============================================================
   PRODUCT CARDS / CAROUSEL IMAGES SIZE
   ============================================================ */
.project-one__img img {
    width: 100% !important;
    height: 427px !important;
    object-fit: cover;
    display: block;
}

/* ============================================================
   WHY CHOOSE US IMAGE FIT
   ============================================================ */
.how-it-work__img-box {
    width: 100% !important;
    max-width: 460px !important;
    height: 420px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 20px !important;
}

@media (min-width: 992px) {
    .how-it-work__img-box {
        position: relative;
        left: -80px;
        top: 40px;
    }
}

@media (max-width: 991px) {
    .how-it-work__img-box {
        margin-top: 20px !important;
        height: 320px !important;
    }
}

.how-it-work__img {
    width: 100% !important;
    height: 100% !important;
    overflow: hidden;
    border-radius: 8px;
}

.how-it-work__img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}



/* ============================================================
   WHY CHOOSE — Slightly reduced image height to match content
   ============================================================ */
.how-it-work__img-box {
    width: 100% !important;
    max-width: 460px !important;
    height: 380px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 20px !important;
}

@media (min-width: 992px) {
    .how-it-work__img-box {
        position: relative;
        left: -80px;
        top: 30px;
    }
}

@media (max-width: 991px) {
    .how-it-work__img-box {
        margin-top: 20px !important;
        height: 300px !important;
    }
}

.how-it-work__img {
    width: 100% !important;
    height: 100% !important;
    overflow: hidden;
    border-radius: 8px;
}

.how-it-work__img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* ============================================================
   ABOUT PAGE — about-three right image height to match content
   ============================================================ */
.about-three__img-2 {
    max-height: 420px !important;
    overflow: hidden !important;
}

.about-three__img-2>img {
    width: 100% !important;
    height: 420px !important;
    object-fit: cover !important;
    object-position: center top !important;
}

/* ============================================================
   WHY CHOOSE — Dedicated image class (sb-why-img)
   Height tuned to match the 3-point list content on the left
   ============================================================ */
.sb-why-img {
    width: 100% !important;
    height: 260px !important;
    overflow: hidden !important;
    border-radius: 10px !important;
    margin-bottom: 12px !important;
}

.sb-why-img>img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
}

/* ============================================================
   PAGE HEADER — Use image copy 18.png, remove ALL grey layers
   ============================================================ */
.page-header {
    background-color: transparent !important;
}

.page-header-bg {
    mix-blend-mode: normal !important;
    opacity: 1 !important;
}

.page-header:before {
    display: none !important;
}

/* ============================================================
   GLOBAL HEADER & MENU STYLE OVERRIDES (100px Height, White BG)
   ============================================================ */

/* Ensure the upper red header (top bar) remains visible and uses the theme's red color */
.main-header__top {
    background-color: var(--adbaiz-base) !important;
}

/* Force header container to white background */
.main-header {
    background-color: #ffffff !important;
    background: #ffffff !important;
}

/* Main Menu & Sticky Menu Container */
.main-menu,
.stricky-header.main-menu {
    height: 100px !important;
    background-color: #ffffff !important;
    box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.05) !important;
}

.main-menu__wrapper {
    height: 100px !important;
    background-color: #ffffff !important;
    padding: 0 70px !important;
}

/* Flexbox wrapper centering */
.main-menu__wrapper-inner {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
}

/* Left side (Logo & Navigation Links) */
.main-menu__left {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

/* Logo container overrides */
.main-menu__logo {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    margin-right: 60px !important;
}

/* Main navigation list and box */
.main-menu__main-menu-box {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

.main-menu__list {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

/* Center each menu item list element vertically */
.main-menu .main-menu__list>li,
.stricky-header .main-menu__list>li {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100px !important;
    display: flex !important;
    align-items: center !important;
}

.main-menu .main-menu__list>li>a,
.stricky-header .main-menu__list>li>a {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
}

/* Right side (Support Call & Button Box) */
.main-menu__right {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

.main-menu__call-btn-box {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

/* Support icon & text vertical alignment */
.main-menu__support {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

.main-menu__support-icon {
    height: 55px !important;
    width: 55px !important;
    font-size: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.main-menu__support-content {
    margin-left: 12px !important;
}

/* Contact button box */
.main-menu__btn-box {
    margin-left: 30px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

/* Ensure mobile toggler centers on mobile screens */
@media (max-width: 1199px) {
    .main-menu__wrapper {
        padding: 0 20px !important;
    }

    .main-menu__left {
        justify-content: space-between !important;
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
    }
}

/* ============================================================
   FOOTER CONTACT SECTION — 2 Column Layout (Location Left, Phone/Email Right)
   ============================================================ */

/* Adjust column widths in the footer for proper fit */
@media (min-width: 1200px) {
    .site-footer__top .row>div:nth-child(1) {
        flex: 0 0 28% !important;
        max-width: 28% !important;
    }

    .site-footer__top .row>div:nth-child(2) {
        flex: 0 0 22% !important;
        max-width: 22% !important;
    }

    .site-footer__top .row>div:nth-child(3) {
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .site-footer__top .row>div:nth-child(3) {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-top: 30px !important;
    }
}

/* Format the Contact Us list items into a 2-column grid layout on larger screens */
@media (min-width: 992px) {
    .footer-widget__contact {
        display: grid !important;
        grid-template-columns: 1.2fr 0.8fr !important;
        grid-gap: 15px 40px !important;
        margin-top: 20px !important;
    }

    .footer-widget__contact>li {
        margin-bottom: 0 !important;
        margin-top: 0 !important;
    }

    /* Column 1, Row 1: First address */
    .footer-widget__contact>li:nth-child(1) {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    /* Column 1, Row 2: Second address */
    .footer-widget__contact>li:nth-child(2) {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    /* Column 2, Row 1: Contact numbers */
    .footer-widget__contact>li:nth-child(3) {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    /* Column 2, Row 2: Email address */
    .footer-widget__contact>li:nth-child(4) {
        grid-column: 2 !important;
        grid-row: 2 !important;
    }
}

/* Reset negative margin on mobile footer to shift it 20px right and align it correctly */
@media (max-width: 991px) {
    .site-footer {
        margin-left: 0px !important;
    }
}

/* ============================================================
   WHY CHOOSE US — Mobile Responsive (overrides inline styles)
   ============================================================ */

/* On tablet & below: reset the right column's inline top offset */
@media (max-width: 991px) {
    #why-choose-img-col {
        margin-top: 30px !important;
    }

    #why-choose-img-inner {
        position: static !important;
        top: auto !important;
    }

    .sb-why-choose-wrapper {
        left: 0 !important;
        margin-top: 0 !important;
    }

    .sb-why-choose-image img {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Hide decorative background shapes on mobile (they overflow) */
    .how-it-work__shape-1,
    .how-it-work__shape-2,
    .how-it-work__shape-3 {
        display: none !important;
    }
}

/* On small phones: extra padding tightening */
@media (max-width: 575px) {
    #why-choose-img-col {
        margin-top: 20px !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .how-it-work__left {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .how-it-work__title {
        font-size: 24px !important;
        line-height: 1.3 !important;
    }
}

/* ============================================================
   HEADER — Mobile / Tablet Responsive
   ============================================================ */
@media (max-width: 991px) {

    /* Collapse fixed height so the header doesn't get too tall */
    .main-menu,
    .stricky-header.main-menu {
        height: auto !important;
        min-height: 70px !important;
    }

    .main-menu__wrapper {
        height: auto !important;
        min-height: 70px !important;
        padding: 0 20px !important;
    }

    .main-menu__wrapper-inner {
        height: 70px !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
    }

    .main-menu__logo {
        margin-right: 0 !important;
        height: auto !important;
    }

    /* Hamburger toggler — visible and styled in red */
    .main-menu .mobile-nav__toggler {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        height: 42px !important;
        background-color: var(--adbaiz-base) !important;
        border-radius: 6px !important;
        font-size: 18px !important;
        color: #ffffff !important;
    }

    .main-menu .mobile-nav__toggler i {
        color: #ffffff !important;
    }

    .main-menu .mobile-nav__toggler:hover {
        background-color: #9b0e16 !important;
    }

    /* Hide desktop nav links & right side on mobile */
    .main-menu__main-menu-box>ul.main-menu__list {
        display: none !important;
    }

    .main-menu__right {
        display: none !important;
    }

    /* Ensure logo image is a good size */
    .main-menu__logo img,
    .main-menu .main-menu__logo a img,
    .stricky-header .main-menu__logo img {
        height: 65px !important;
        max-height: 65px !important;
        width: auto !important;
    }
}

@media (max-width: 575px) {
    .main-menu__wrapper {
        padding: 0 12px !important;
    }

    .main-menu__logo img,
    .main-menu .main-menu__logo a img,
    .stricky-header .main-menu__logo img {
        height: 55px !important;
        max-height: 55px !important;
    }
}

/* Hide top info bar on phones */
@media (max-width: 767px) {
    .main-header__top {
        display: none !important;
    }
}

/* ============================================================
   MOBILE NAV DRAWER — White bg, Red accent (matches reference layout)
   ============================================================ */

/* ── Drawer panel: white background, red right border ── */
.mobile-nav__content {
    background-color: #ffffff !important;
    border-right: none !important;
    box-shadow: 4px 0 30px rgba(0, 0, 0, 0.18) !important;
    width: 310px !important;
    padding: 0 !important;
}

/* ── Logo strip at top: white bg, generous padding ── */
.mobile-nav__content .logo-box {
    background-color: #ffffff !important;
    padding: 24px 25px 20px !important;
    margin-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
    min-height: 90px !important;
    border-bottom: 2px solid #c1121f !important;
}

.mobile-nav__content .logo-box img {
    height: 52px !important;
    width: auto !important;
    object-fit: contain !important;
    filter: none !important;
    /* show actual logo colours on white */
}

/* ── Close (×) button: dark grey circle, top-right ── */
.mobile-nav__close {
    top: 26px !important;
    right: 20px !important;
    color: #2d3748 !important;
    font-size: 16px !important;
    background: #f0f2f5 !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 250ms ease !important;
    line-height: 1 !important;
}

.mobile-nav__close:hover {
    background: #c1121f !important;
    color: #ffffff !important;
}

/* ── Nav container: full width, no side margins ── */
.mobile-nav__container {
    border-top: none !important;
    border-bottom: none !important;
    padding: 8px 0 !important;
    margin: 0 !important;
}

/* ── CRITICAL: Force nav list to be VERTICAL (column), not horizontal ── */
.mobile-nav__content .main-menu__list,
.mobile-nav__content .main-menu__list>li>ul,
.mobile-nav__content .main-menu__list>li>ul>li>ul {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: auto !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Each list item: full width block */
.mobile-nav__content .main-menu__list>li,
.mobile-nav__content .main-menu__list>li>ul>li,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
}

/* ── Nav item dividers: light grey lines ── */
.mobile-nav__content .main-menu__list>li:not(:last-child),
.mobile-nav__content .main-menu__list>li>ul>li:not(:last-child),
.mobile-nav__content .main-menu__list>li>ul>li>ul>li:not(:last-child) {
    border-bottom: 1px solid #edf0f3 !important;
}

.mobile-nav__content .main-menu__list>li>ul,
.mobile-nav__content .main-menu__list>li>ul>li>ul {
    border-top: 1px solid #edf0f3 !important;
    background-color: #fafafa !important;
    margin-left: 0 !important;
}

/* ── Nav link text: dark grey, large, bold ── */
.mobile-nav__content .main-menu__list>li>a,
.mobile-nav__content .main-menu__list>li>ul>li>a,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a {
    color: #1a202c !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    height: 55px !important;
    padding: 0 20px !important;
    letter-spacing: 0.2px !important;
    transition: all 250ms ease !important;
    border-left: 3px solid transparent !important;
    background-color: transparent !important;
}

/* Sub-menu items slightly indented + smaller */
.mobile-nav__content .main-menu__list>li>ul>li>a,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #4a5568 !important;
    padding: 0 20px 0 30px !important;
    height: 48px !important;
}

/* ── Hover / active: red left border + light red bg ── */
.mobile-nav__content .main-menu__list>li>a:hover,
.mobile-nav__content .main-menu__list>li>ul>li>a:hover,
.mobile-nav__content .main-menu__list li a.expanded {
    color: #c1121f !important;
    background-color: #fff5f5 !important;
    border-left-color: #c1121f !important;
}

/* ── Dropdown expand button: red bg, white arrow (like reference) ── */
.mobile-nav__content .main-menu__list>li>a>button,
.mobile-nav__content .main-menu__list>li>ul>li>a>button,
.mobile-nav__content .main-menu__list>li>ul>li>ul>li>a>button {
    background-color: #c1121f !important;
    color: #ffffff !important;
    border-radius: 5px !important;
    width: 30px !important;
    height: 30px !important;
    flex-shrink: 0 !important;
}

.mobile-nav__content .main-menu__list>li>a>button.expanded,
.mobile-nav__content .main-menu__list>li>ul>li>a>button.expanded {
    background-color: #9b0e16 !important;
    color: #ffffff !important;
    transform: rotate(0deg) !important;
}

/* ── Contact info block: light grey card with red left accent ── */
.mobile-nav__contact {
    margin: 16px 20px 10px !important;
    padding: 16px !important;
    background-color: #f7f8fa !important;
    border-radius: 8px !important;
    border-left: 3px solid #c1121f !important;
}

.mobile-nav__contact li {
    color: #4a5568 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
}

.mobile-nav__contact li+li {
    margin-top: 14px !important;
    padding-top: 14px !important;
    border-top: 1px solid #edf0f3 !important;
}

/* Icon circle: red bg, white icon */
.mobile-nav__contact li>i {
    color: #ffffff !important;
    background-color: #c1121f !important;
    border-radius: 50% !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    margin-right: 12px !important;
}

.mobile-nav__contact li a {
    color: #2d3748 !important;
    font-weight: 500 !important;
}

.mobile-nav__contact li a:hover {
    color: #c1121f !important;
}

/* ── Social icons: grey circles, red on hover ── */
.mobile-nav__social {
    padding: 16px 20px 20px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.mobile-nav__social a {
    color: #4a5568 !important;
    width: 38px !important;
    height: 38px !important;
    background-color: #f0f2f5 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    transition: all 250ms ease !important;
    margin-left: 0 !important;
}

.mobile-nav__social a+a {
    margin-left: 0 !important;
}

.mobile-nav__social a:hover {
    background-color: #c1121f !important;
    color: #ffffff !important;
}

/* Ensure the Services section container has the same wide layout (max-width: 1600px) as the Products section */
.services-one .container {
    max-width: 1600px !important;
}

/* ============================================================
   GLOBAL FOOTER HEIGHT REDUCTION & ADJUSTMENTS
   ============================================================ */
.site-footer {
    padding-top: 60px !important;
    margin-top: 10px !important;
}

/* Hide background shapes in footer globally since they are removed from the homepage */
.footer-widget__shape-1,
.footer-widget__shape-2,
.footer-widget__shape-3,
.footer-widget__shape-4 {
    display: none !important;
}

.site-footer__top {
    padding-bottom: 30px !important;
}

.site-footer__bottom-inner {
    padding: 15px 0 15px !important;
}

/* ============================================================
   ABOUT PAGE MICRO-ANIMATIONS & HOVER EFFECTS
   ============================================================ */

/* Points List item hover slide effect */
.about-three__points-list li {
    display: flex;
    align-items: center;
    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

.about-three__points-list li:hover {
    transform: translateX(8px);
}

/* Check Circle Icon spin and color transform on hover */
.about-three__points-list li:hover .icon span {
    transform: scale(1.2) rotate(360deg);
    color: var(--adbaiz-base) !important;
}

.about-three__points-list li .icon span {
    display: inline-block;
    transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), color 0.3s ease;
}

/* About Us main image hover lift & subtle scale zoom */
.about-three__img-2 {
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s ease !important;
}

.about-three__img-2:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15) !important;
}

.about-three__img-2 img {
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

.about-three__img-2:hover img {
    transform: scale(1.05);
}

/* ============================================================
   HOW IT WORKS (PROCESS) HOVER EFFECTS
   ============================================================ */

/* How It Work Two Card hover effects */
.how-it-work-two__single {
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s ease, background-color 0.4s ease !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.03);
}

.how-it-work-two__single:hover {
    transform: translateY(-12px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08) !important;
    background-color: #ffffff !important;
}

/* Hover effect on card title */
.how-it-work-two__single:hover .how-it-work-two__title a {
    color: var(--adbaiz-base) !important;
}

/* Count badge transitions and animations on hover */
.how-it-work-two__count {
    background-color: var(--adbaiz-base) !important;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.3s ease !important;
}

.how-it-work-two__single:hover .how-it-work-two__count {
    transform: translateX(-50%) scale(1.1) rotate(5deg) !important;
    background-color: var(--adbaiz-black) !important;
}

/* Make arrow shapes between columns bob horizontally */
.how-it-work-two__shape-2 {
    animation: float-bob-x 3s ease-in-out infinite;
}

@keyframes float-bob-x {
    0% {
        transform: translateX(0px);
    }

    50% {
        transform: translateX(10px);
    }

    100% {
        transform: translateX(0px);
    }
}

/* ============================================================
   PRODUCT & SERVICE DETAILS — Replace checkmark with filled circle bullet
   ============================================================ */

/* Override the icon-draw-check font glyph with a filled circle (●) */
.project-details__digital-solution-points .icon span.icon-draw-check::before {
    content: "\25CF" !important;
    /* ● filled circle */
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 13px !important;
    line-height: 1 !important;
    color: var(--adbaiz-base) !important;
}

/* Adjust icon container alignment for the smaller circle */
.project-details__digital-solution-points li {
    align-items: flex-start !important;
    padding-top: 4px !important;
}

.project-details__digital-solution-points .icon {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    width: 20px !important;
    top: 8px !important;
    position: relative !important;
}

/* Slightly indent text next to bullet */
.project-details__digital-solution-points .text {
    margin-left: 4px !important;
}