/*=======================================================================
   Basics 
=========================================================================*/

@font-face {
    font-family: BasicFont;
    src: url(../fonts/Tajawal-Regular.ttf);
}

@font-face {
    font-family: BasicFont;
    src: url(../fonts/Tajawal-Bold.ttf);
    font-weight: bold;
}

* {
    font-family: BasicFont;
}


html {
    height: 100%;
    font-size: 62.5%;
}

@media only screen and (max-width: 1199px) {
    html {
        font-size: 60%;
    }
}

@media only screen and (max-width: 991px) {
    html {
        font-size: 55%;
    }
}

@media only screen and (max-width: 767px) {
    html {
        font-size: 50%;
    }
}

@media only screen and (max-width: 480px) {
    html {
        font-size: 45%;
    }
}

@media only screen and (max-width: 320px) {
    html {
        font-size: 40%;
    }
}

body {
    font-size: 18.5px;
    font-family: 'BasicFont', sans-serif !important;
    font-weight: 400;
    height: 100%;
    line-height: 1.6;
    vertical-align: baseline;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    /*background-color: #024b9408;*/
    /*background-color: #2E6071;*/
}

p {
    margin: 0 0 20px 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400;
    font-family: 'BasicFont', sans-serif !important;
    margin: 0 0 20px 0;   
}

h1 {
    line-height: 1.2;
}

h2 {
    line-height: 1.3;
}

h3,
h4,
h5,
h6 {
    line-height: 1.4;
}

h1 {
    font-size: 32px;
}


/*=======================================================================
   overrides  / Common
=========================================================================*/
.bg-dark {
    background-color: #1E4C5D !important;
}

.section-title {
    font-size: 28px !important;
    color: #6A0619;
    font-weight: bold;
}


.section-title-larg {
    font-size: 30px !important;
    color: #6A0619;
    font-weight: bold;
}

.section-title-larg-White {
    font-size: 30px !important;
    color: #fff;
    font-weight: bold;
}

.section-description-white {
    color: #fff;
   /* font-weight: bold;*/
}

.section-title-Small {
    font-size: 22px !important;
    color: #6A0619;
    font-weight: bold;
}


.top-margin25 {
    margin-top: 25px !important
}


.btn-xl {
    padding: 1rem 2rem;
    font-size: 1.5rem;
    border-radius: 0.5rem;
}

.btn-primary {
    color: #fff;
    background-color: #1e4c5d;
    border-color: #1e4c5d;
}

.btn-primary:hover {
    color: #fff;
    background-color: #6A0619;
    border-color: #6A0619;
}


/*=======================================================================
   headers  
=========================================================================*/
/*.logo {
    padding-left: 10px !important;
    width: 80px !important;
    height: auto !important;
    position: relative !important;
    display: inline-block !important;
    vertical-align: middle !important;
    border-radius: 50%;
}*/

.logo {
    padding-left: 10px !important;
    width: 200px !important;
    height: auto !important;
    position: relative !important;
    display: inline-block !important;
    vertical-align: middle !important;
    /* border-radius: 50%; */
}

.navbar, .container-fluid, .navbar-brand {
    overflow: visible !important;
}

.navbar-brand .logo {
    max-height: none !important;
}


/*=======================================================================
   navbar  
=========================================================================*/
/* Add spacing between nav items */
.mainNavbar-bg {
   /* background-color: hsla(0, 0%, 0%, 0.5) !important;
    transition: background-color 0.3s ease;*/
}

.navbar-nav .nav-item {
    /*padding: 0 2.5rem;*/
    padding: 0 1.5rem;
    /*font-size: 19.5px !important;   */ 
    font-size: 16px !important;    
    font-family: 'BasicFont', sans-serif !important;
}

.navbar-dark .navbar-nav .nav-link {
    color: #fff;
}

.search-icon-btn {
    color: #FFF !important;
}

/* Transition for smooth color change */
.navbar {
    transition: all 0.3s ease;    
}

.navbar-scrolled {
    background-color: #343a40; /* Dark background (same as bg-dark) */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

/* Search icon button styling */
.search-icon-btn {
    background: none;
    border: none;
    color: inherit;
    padding: 0.5rem;
}

.navbar-dark .search-icon-btn {
   /* color: rgba(255, 255, 255, 0.75);*/
}

.navbar-scrolled .search-icon-btn {
   /* color: rgba(0, 0, 0, 0.75) !important;*/
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: .75rem 1rem;
    clear: both;
    font-weight: 600;
    font-size: 15px;
    color: #212529;
    text-align: inherit;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border: 1px;
}

.search-icon-btn:hover {
    color: inherit;
    opacity: 0.8;
}

.Mega-title {
    font-weight: bold;
    font-size: 14px;
    color:#0985e9
}

.Mega-item {
    font-weight: bold;
    font-size: 12px;
    color: #000;
}

/* Make the icon white and bigger */
.custom-toggler .navbar-toggler-icon {
   /* background-image: none;*/
    display: inline-block;
    width: 22px;
    height: 20px;
    position: relative;
}

.custom-toggler .navbar-toggler-icon::before,
.custom-toggler .navbar-toggler-icon::after,
.custom-toggler .navbar-toggler-icon div {
    content: "";
    position: absolute;
    height: 3px;
    width: 100%;
    background-color: white;
    left: 0;
    transition: all 0.3s ease;
    border-radius: 2px;
}

.custom-toggler .navbar-toggler-icon::before {
    top: 0;
}

.custom-toggler .navbar-toggler-icon::after {
    bottom: 0;
}

.custom-toggler .navbar-toggler-icon div {
    top: 10px;
}

.mega-content {
    width: 95vw !important; /* or 100% if inside a container */
    margin: 0 auto;
}

@media only screen and (max-width: 767px) {
    .mega-content {
        width:100% !important;
    }
}


@media (max-width: 767px) {
  .dropdown-menu.mega, /* add a "mega" class or target your specific dropdown */
  .dropdown-menu.show {
    position: fixed !important;
    top: 56px;                /* change to your navbar height if different */
    left: 0;
    right: 0;
    bottom: 0;
    width: 100% !important;
    max-height: calc(100vh - 56px);
    overflow-y: auto;
    z-index: 2000;            /* ensure it's above other elements */
    border-radius: 0;
    padding: 0.75rem 0.75rem;
    background: #fff;         /* or whatever background you want */
  }

  /* Make inner content full width on mobile */
  .dropdown-menu.show .mega-content {
    width: 100% !important;
    margin: 0;
    padding: 0 1rem;
  }

  /* Optional: tighten column paddings for better fit */
  .dropdown-menu.show .row > [class*="col-"] {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}


/*=======================================================================
   hero  
=========================================================================*/
    /*.hero {
    height: 100vh;
    width: 100% !important;
    overflow: hidden;
}

.hero-Full {
    padding-right: 0px !important;
    padding-left: 0px !important;
    margin-right: 0px !important;
    margin-left: 0px !important;
}

.hero .container {
    padding: 0;
    height: 100%;
}

#imageCarousel {
    height: 100%;
}

.carousel-inner {
    height: 100%;
}

.carousel-item {
    height: 100%;
    position: absolute;
    width: 100%;
    display: block;
    opacity: 0;
    transition: opacity 0.5s ease;
}

.carousel-item.active {
    position: relative;
    opacity: 1;
}

.carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}*/

    /* Animation styles */
    /*.slide-in {
    animation-duration: 1s;
    animation-fill-mode: both;
}*/

    /* Random animation keyframes */
    /*@keyframes slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInLeft {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInUp {
    from {
        transform: translateY(100%);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideInDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes zoomIn {
    from {
        transform: scale(0.5);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes rotateIn {
    from {
        transform: rotate(-180deg) scale(0.5);
        opacity: 0;
    }

    to {
        transform: rotate(0) scale(1);
        opacity: 1;
    }
}*/

    /* Caption styles */
    /*.carousel-caption 
{
    bottom: 50%;
    background: rgba(0, 0, 0, 0.4);
    padding: 20px;
    border-radius: 10px;
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.5s ease 0.3s;
}

.carousel-title {
    font-size:30px !important;
    font-weight:bold;   
    color:#fff;
}

.carousel-item.active .carousel-caption 
{
    opacity: 1;
    transform: translateY(0);
}*/

    /* Navigation buttons */
    /*.carousel-control-prev, .carousel-control-next 
{
    width: 5%;
    transition: all 0.3s ease;
}

.carousel-control-prev:hover,
.carousel-control-next:hover {
    background: rgba(0, 0, 0, 0.2);
}

.carousel-caption p {
    margin-bottom: 1.5rem;
    font-size: 1.8rem;
}

.carousel-caption .btn {
    margin-right: 10px;
    font-size: 1.6rem;
    padding: 10px 20px;
}*/



    /* carousel - Small devices (phones to small tablets, up to 768px) */
    /*@media only screen and (max-width: 768px) {*/
    /* Styles for small devices */

    /*.carousel-item {
        height: 1000px !important;
        position: absolute;
        width: 100%;
        display: block;
        opacity: 0;
        transition: opacity 0.5s ease;
    }

        .carousel-item img {
            max-height: 940px !important;
            width: 100%;
            object-fit: cover;
        }
}*/

    /* iPhone SE / older small screens */
    /*@media only screen and (max-width: 375px) {*/
    /* Very small devices */
    /*}*/

    /* Extra small devices (phones, portrait 320px - 480px) */
    /*@media only screen and (max-width: 480px) {*/
    /* Styles for phones */
    /*}*/




    /*=======================================================================
   Swiper Slider  
=========================================================================*/
    .section-slider {
        width: 100%;
        height: 80vh;
    }

    .swiper-container {
        width: 100%;
        height: 100%;
    }

    .slide {
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        text-align: center;
        font-size: 18px;
        background: #fff;
        overflow: hidden;
    }

    .slide-image {
        position: absolute;
        top: -200px;
        left: -200px;
        width: calc(100% + 400px);
        height: calc(100% + 400px);
        background-position: 50% 50%;
        background-size: cover;
    }

    .slide-title {
        font-size: 40px !important;
        line-height: 1;
        max-width: 50%;
        white-space: normal;
        word-break: break-word;
        color: #FFF;
        z-index: 100;
        font-family: BasicFont;
        text-transform: uppercase;
        font-weight: bold;
        -webkit-text-stroke: 0.5px #000; /* Border color and width */
        text-stroke: 1px #000; /* Optional: For other browsers (not widely supported) */
        letter-spacing: 5px; /* Space between characters */
    }

    @media only screen and (max-width: 768px) {

        .slide-title {
            font-size: 25px !important;
            line-height: 1;
            max-width: 50%;
            white-space: normal;
            word-break: break-word;
            color: #FFF;
            z-index: 100;
            font-family: BasicFont;
            text-transform: uppercase;
            font-weight: bold;
            -webkit-text-stroke: 0.5px #000; /* Border color and width */
            text-stroke: 1px #000; /* Optional: For other browsers (not widely supported) */
            letter-spacing: 5px; /* Space between characters */
        }
    }

    @media (min-width: 45em) {
        .slide-title {
            font-size: 7vw;
            max-width: none;
        }
    }

    .slide-title span {
        white-space: pre;
        display: inline-block;
        opacity: 0;
    }

    .slideshow {
        position: relative;
    }

    .slideshow-pagination {
        position: absolute;
        bottom: 5rem;
        left: 0;
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        transition: .3s opacity;
        z-index: 10;
        font-weight: bold;
        font-size: 15px !important;
        -webkit-text-stroke: 0.5px #000; /* Border color and width */
        text-stroke: 1px #000; /* Optional: For other browsers (not widely supported) */
        letter-spacing: 5px; /* Space between characters */
    }

    .slideshow-pagination-item {
        display: flex;
        align-items: center;
    }

        .slideshow-pagination-item .pagination-number {
            opacity: 0.5;
        }

        .slideshow-pagination-item:hover, .slideshow-pagination-item:focus {
            cursor: pointer;
        }

        .slideshow-pagination-item:last-of-type .pagination-separator {
            width: 0;
        }

        .slideshow-pagination-item.active .pagination-number {
            opacity: 1;
        }

        .slideshow-pagination-item.active .pagination-separator {
            width: 10vw;
        }

    .slideshow-navigation-button {
        position: absolute;
        top: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        width: 5rem;
        z-index: 1000;
        transition: all .3s ease;
        color: #FFF;
    }

        .slideshow-navigation-button:hover, .slideshow-navigation-button:focus {
            cursor: pointer;
            background: rgba(0, 0, 0, 0.5);
        }

        .slideshow-navigation-button.prev {
            left: 0;
        }

        .slideshow-navigation-button.next {
            right: 0;
        }

    .pagination-number {
        font-size: 1.8rem;
        color: #FFF;
        font-family: 'Oswald', sans-serif;
        padding: 0 0.5rem;
    }

    .pagination-separator {
        display: none;
        position: relative;
        width: 40px;
        height: 2px;
        background: rgba(255, 255, 255, 0.25);
        transition: all .3s ease;
    }

    @media (min-width: 45em) {
        .pagination-separator {
            display: block;
        }
    }

    .pagination-separator-loader {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #FFFFFF;
        transform-origin: 0 0;
    }

    /* Make sure slide content is positioned properly */
    .slide-content {
        position: absolute;
        /*bottom: 15%;*/
        left: 10%;
        z-index: 10;
        color: #fff;
        text-align: left;
    }

    /* CTA button base style */
    .cta-button {
        display: inline-block;
        padding: 12px 24px;
        margin: 10px 10px 0 0;
        font-size: 16px;
        font-weight: 600;
        text-decoration: none;
        border-radius: 5px;
        transition: background 0.3s ease;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    }

    /* Primary button (e.g., Learn More) */
    .cta-primary {
        background-color: #007bff;
        color: white;
    }

    .cta-primary:hover {
        background-color: #0056b3;
    }

    /* Secondary button (e.g., Contact Us) */
    .cta-secondary {
        background-color: #28a745;
        color: white;
    }

    .cta-secondary:hover {
        background-color: #1e7e34;
    }


/*=======================================================================
   Services Cards  
=========================================================================*/
    .service-card img {
        height: 150px;
        object-fit: cover;
    }


/*=======================================================================
  Contact-form
=========================================================================*/

.get-in-touch {
    max-width: 100%;
    margin: 50px auto;
    position: relative;
    padding-left: 24px;
    padding-right: 5px;
}

.get-in-touch .title {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size: 3.2em;
    line-height: 48px;
    padding-bottom: 48px;
    color: #5543ca;
    background: #5543ca;
    background: -moz-linear-gradient(left,#f4524d 0%,#5543ca 100%) !important;
    background: -webkit-linear-gradient(left,#f4524d 0%,#5543ca 100%) !important;
    background: linear-gradient(to right,#f4524d 0%,#5543ca 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.contact-form .form-field {
    position: relative;
    margin: 5px 0;
}

.contact-form .input-text {
    display: block;
    width: 100%;
    height: 36px;
    border-width: 0 0 2px 0;
    border-color: #024b94;
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
}

.contact-form .input-text-area {
    display: block;
    width: 100%;    
    border-width: 0 0 2px 0;
    border-color: #024b94;
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
}

.contact-form .input-text:focus {
    outline: none;
}

.contact-form .input-text:focus + .label,
.contact-form .input-text.not-empty + .label {
    -webkit-transform: translateY(-24px);
    transform: translateY(-24px);
}

.contact-form .label {
    position: absolute;
    left: 20px;
    bottom: 11px;
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    color: #024b94;
    cursor: text;
    transition: -webkit-transform .2s ease-in-out;
    transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.contact-form .submit-btn {
    display: inline-block;
    background-color: #000;
    background-image: linear-gradient(125deg,#a72879,#064497);
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 16px;
    padding: 8px 16px;
    border: none;
    width: 200px;
    cursor: pointer;
}


/*=======================================================================
# Clients Section
=========================================================================*/
.clients .clients-wrap {
    border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
    border-left: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
}

.clients .client-logo {
    background-color: var(--surface-color);
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
    border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
    overflow: hidden;
}

.clients .client-logo img {
    padding: 20px;
    max-width: 100%;
    transition: 0.3s;
}

@media (max-width: 640px) {
    .clients .client-logo img {
        padding: 30px;
        max-width: 50%;
    }
}

.clients .client-logo:hover img {
    transform: scale(1.1);
}

/*=======================================================================
   Case Studies Tabs 
=========================================================================*/
.logo-tab {
    width: 55px;
    opacity: 0.5;
    transition: opacity 0.3s ease, border-color 0.3s ease;
    cursor: pointer;
    border-bottom: 4px solid transparent;
    padding: 8px 0;
}

.logo-tab.active {
    opacity: 1;
    border-color: #f25c5c; /* soft red underline */
}

.nav-logo-tabs {
    display: flex;
    justify-content: left;
    gap: 40px;
    border: none;
    margin-top: 20px;
}

.tab-card {
    display: flex;
    flex-wrap: wrap;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
}

.tab-card .left {
    flex: 1 1 50%;
    position: relative;
    overflow: hidden;
}

.tab-card .left img.bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.7);
}

.tab-card .left .logo-overlay {
    position: absolute;
    bottom: 20px;
    left: 20px;
    background: white;
    padding: 10px 20px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    width: 30% !important;
}

.logo-study-inner {
    width: 100% !important;
}

.tab-card .right {
    flex: 1 1 50%;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.tab-card .right h6 {
    color: #f25c5c;
    font-weight: bold;
    font-size: 15px;
}

.tab-card .right h4 {
    /* font-weight: 700; */
    margin: 20px 0;
    font-size: 20px;
}

.btn-read-more {
    color: #fff;
    background-color: #024b94;
    border: 1px solid #181616;
    border-radius: 30px;
    padding: 10px 24px;
    font-weight: 500;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s;
    /*width: 25% !important;*/
    width: 140px !important;
}

.btn-read-more:hover {
    background-color: #f25c5c;
    color: white;
}




/*=======================================================================
   fancy-item 
=========================================================================*/
.fancy-item {
    height: 180px;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease;
 }

.fancy-item:hover {
    transform: scale(1.02);
}

.fancy-tall {
    height: 410px;
}

.fancy-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px;
    background: rgba(0, 0, 0, 0.6);
    color: white;
}

.fancy-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/*=======================================================================
   featured-post 
=========================================================================*/

.featured-post {
    background-color: #f8f9fa;
    padding: 40px;
    border-radius: 10px;
}

.featured-post img {
    max-width: 100%;
    border-radius: 10px;
}

.card {
    border: none;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.card-body {
    padding: 20px;
}

.card-title {
    font-size: 14px !important;
    font-weight: bold;
}

.card-title a {
    font-size: 14px !important;
    font-weight: bold;
    color: #024b94;
    text-decoration: none;
}

.card-title a:hover {
    font-size: 14px !important;
    font-weight: bold;
    color: #f25c5c;
    text-decoration: underline;
}

.blog-header {
    /*text-align: center;*/
    margin-bottom: 40px;
}

.blog-header h1 {
    font-size: 3rem;
    font-weight: bold;
}

.blog-header p {
    font-size: 1.25rem;
    color: #6c757d;
}

.card-height {
    min-height: 500px;
    max-height:500px;
}

.card-height-sm {
    min-height: 400px;
    max-height: 400px;
}

/*=======================================================================
   footer
=========================================================================*/
.footer 
{
    color: #fff !important;
    padding: 70px 0 30px;
    position: relative;
    overflow: hidden;
}

.footer::before 
{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(to right, #3498db, #2ecc71);
}

.footer-logo 
{
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 10px;
    background: linear-gradient(45deg, #ffffff, #024b94);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.footer-about {
    color: #fff !important;
    margin-bottom: 25px;
    line-height: 1.6;
}

.footer h5 
{
    color: #fff !important;
    font-weight: bold;
    margin-bottom: 25px;
    position: relative;
    font-size: 15.5px !important;
}

.footer h5::after 
{
    content: '';
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 30px;
    height: 2px;
    background: #3498db;
}

.footer-links 
{
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li 
{
    margin-bottom: 12px;
}

.footer-links a 
{
    color: #fff !important;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-block;
}

.footer-links a:hover 
{
    color: #fff !important;
    transform: translateX(5px);
}

.social-links 
{
    display: flex;
    gap: 15px;
    margin-top: 20px;
}

.social-icon 
{
    width: 35px;
    height: 35px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-decoration: none;
    transition: all 0.3s ease;
}

.social-icon:hover
{
    background: #3498db;
    transform: translateY(-3px);
    color: #fff;
}

.footer-newsletter 
{
    position: relative;
    width: 100%;
}

.footer-newsletter input 
{
    padding: 12px 15px;
    border-radius: 25px;
    border: none;
    width: 100%;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    outline: none;
    padding-right: 50px;
}

.footer-newsletter input::placeholder {
    color: #a4b5c6;
}

.newsletter-btn {
    position: absolute;
    right: 5px;
    top: 5px;
    bottom: 5px;
    width: 40px;
    border-radius: 50%;
    background: #3498db;
    border: none;
    color: #fff;
    transition: all 0.3s ease;
}

.newsletter-btn:hover {
    background: #2980b9;
}

/* Flex row for full name + email-with-button */
.newsletter-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

/* Shared input styling */
.newsletter-input {
    padding: 12px 15px;
    border-radius: 25px;
    border: none;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    outline: none;
    width: 100%;
    box-sizing: border-box;
}

    .newsletter-input::placeholder {
        color: #a4b5c6;
    }

/* Wrapper around email + button */
.newsletter-email-wrapper {
    position: relative;
    flex: 1;
    min-width: 200px;
}

/* Add right padding to make room for button */
.email-with-button {
    padding-right: 50px !important;
}

/* Submit button inside the email input */
.newsletter-btn {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #3498db;
    border: none;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .newsletter-btn:hover {
        background: #2980b9;
    }

/* Responsive stacking on small screens */
@media (max-width: 600px) {
    .newsletter-row {
        flex-direction: column;
    }

    .newsletter-email-wrapper {
        width: 100%;
    }
}


.footer-bottom {
    margin-top: 50px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    text-align: center;
    color: #a4b5c6;
}

.footer-bottom-links {
    list-style: none;
    padding: 0;
    margin: 15px 0;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.footer-bottom-links a {
    color: #fff !important;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-bottom-links a:hover {
    color: #fff !important;
}

@media (max-width: 768px) {
    .footer-section {
        margin-bottom: 40px;
    }
}

.VistorsDiv {
    color: #b7babc;
    font-size: 14px !important;
    letter-spacing: 1.1px;
}

/*=======================================================================
   scroll-up
=========================================================================*/
.scrollup {
    overflow: hidden;
    position: fixed;
    height: 40px;
    width: 40px;
    line-height: 40px;
    bottom: -50px;
    right: 20px;
    text-align: center;
    z-index: 9999;
    background-color: rgba(255, 74, 82, 0.8);
    display: block;
    font-size: 16px;
    color: #ffffff;
    -webkit-transition: all 0.5s cubic-bezier(0, 0, 0.15, 1.88);
    -moz-transition: all 0.5s cubic-bezier(0, 0, 0.15, 1.88);
    -ms-transition: all 0.5s cubic-bezier(0, 0, 0.15, 1.88);
    -o-transition: all 0.5s cubic-bezier(0, 0, 0.15, 1.88);
    transition: all 0.5s cubic-bezier(0, 0, 0.15, 1.88);
}

.scrollup i {
    display: inline-block;
    margin-top: 10px !important;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}

.scrollup:hover,
.scrollup:focus {
    color: #ffffff;
}

.scrollup:hover i,
.scrollup:focus i {
    -webkit-animation: toBottomFromTop 0.5s forwards;
    animation: toBottomFromTop 0.5s forwards;
}

.scrollup.back-top {
    bottom: 20px;
}




/*=======================================================================
   Inner-Banner 
=========================================================================*/
.Inner-banner-title 
{
    font-size: 25px !important;
    line-height: 1;
    white-space: normal;
    word-break: break-word;
    color: #FFF;
    z-index: 100;
    font-family: BasicFont;
    text-transform: uppercase;
    font-weight: bold;
    -webkit-text-stroke: 0.5px #000;
    text-stroke: 1px #000;
    letter-spacing: 5px;
}

.Inner-banner-crumb {
    /* font-weight: bold; */
    /* -webkit-text-stroke: 0.5px #000; */
    text-stroke: 1px #000;
}

/*=======================================================================
   Inner Content  
=========================================================================*/
.fancy-inner-item {
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease;
    float: right; /* Floating to the right */
    margin-left: 20px; /* Space between image and text */
    margin-bottom: 15px; /* Space below image */
    width: 450px; /* Set a width for floated element */
    max-width: 500px;
}

.fancy-inner-item:hover {
    transform: scale(1.05); /* Hover effect */
}

.inner-content {
    text-align: justify;
    line-height: 1.6;
}

/* Clearfix for the container */
.inner-content::after {
    content: "";
    display: table;
    clear: both;
}

/* Style for the image inside our fancy container */
.fancy-inner-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Mobile styles */
@media (max-width: 768px) {
    .fancy-inner-item {
        float: none;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        display: block;
        text-align: center;
    }

    .inner-content {
        padding: 0 15px; /* Add some padding on mobile */
    }
}



/*=======================================================================
  Search Overlay Styles
=========================================================================*/
.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background-color: rgba(0, 0, 0, 0.95);*/
    background-color: #1E4C5D;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.search-overlay.active {
    opacity: 1;
    visibility: visible;
}

.search-container {
    width: 80%;
    max-width: 600px;
    text-align: center;
}

.search-form input[type="text"] {
    width: 100%;
    padding: 20px;
    font-size: 1.8rem;
    border: none;
    border-bottom: 3px solid #fff;
    background: transparent;
    color: white;
    outline: none;
    margin-bottom: 30px;
}

.search-form input[type="text"]::placeholder {
    color: rgba(255, 255, 255, 0.7); /* Semi-transparent white */
    font-weight: 300; /* Lighter font */
}

.search-form button[type="submit"] {
    padding: 15px 40px;
    font-size: 1.3rem;
    font-weight: bold;
    background: #fff;
    color: #000;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.search-form button[type="submit"]:hover {
    background: #3f97ef;
    color: white;
}

.search-form button[type="button"] {
    padding: 15px 40px;
    font-size: 1.3rem;
    font-weight: bold;
    background: #fff;
    color: #000;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.search-form button[type="button"]:hover {
    background: #3f97ef;
    color: white;
}

.close-search {
    position: absolute;
    top: 40px;
    right: 40px;
    background: transparent;
    border: none;
    color: white;
    font-size: 3.5rem;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.close-search:hover {
    transform: rotate(90deg);
}

/* Dropdown List Styling */
.search-form select.ddlNormal {
    padding: 15px 20px;
    font-size: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 4px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;    
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 13px !important;
    width:400px !important;
}

.search-form select.ddlNormal:hover {
    background-color: rgba(255, 255, 255, 0.2);
}

.search-form select.ddlNormal:focus {
    border-color: #4CAF50;
}



/*=======================================================================
  Gallary and Albums Css 
=========================================================================*/
.gallery-title {
    font-size: 36px;
    color: #42B32F;
    text-align: center;
    font-weight: 500;
    margin-bottom: 70px;
}

.gallery-title:after {
    content: "";
    position: absolute;
    width: 7.5%;
    left: 46.5%;
    height: 45px;
    border-bottom: 1px solid #5e5e5e;
}

.filter-button {
    font-size: 18px;
    border: 1px solid #161616;
    border-radius: 5px;
    text-align: center;
    color: #f5f5f5;
    background-color: #024b94;
    margin-bottom: 30px;
}

.filter-button:hover {
    font-size: 18px;
    border: 1px solid #161616;
    border-radius: 5px;
    text-align: center;
    color: #ffffff;
    background-color: #58a7f5;
}

.btn-default:active .filter-button:active {
    background-color: #f4524d;
    color: white;
}

.port-image {
    width: 100%;
}

.gallery_thumbnail {
    margin-bottom: 30px;
    text-align: center;
}

.gallery_item {
    width: 75%;
    height: 300px;
    border: solid 8px #024b94
}


img.zoom {
    width: 100%;
    height: 200px;
    border-radius: 5px;
    object-fit: cover;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
}


.transition {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}

.modal-header {
    border-bottom: none;
}

.modal-title {
    color: #000;
}

.modal-footer {
    display: none;
}



/*=======================================================================
  SiteMap  - Css
=========================================================================*/

.ul-sitemap-parent {
    padding-bottom: 10px !important;
}

.ul-sitemap-child {
    padding-bottom: 5px !important;
}

.ul-sitemap-parent a {
    color: #024b94 !important;
    font-size: 18px;
    text-decoration: none;
}

.ul-sitemap-parent a:hover {
    color: #000 !important;
    font-size: 18px;
    text-decoration: none;
}

/*=======================================================================
    Project Wrapper
=========================================================================*/
.project-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    width: 100% !important;   
}

@media (max-width: 991px) {
    .project-wrapper {
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 30px;
    }
}

.project-wrapper .project-image-items {
    margin-top: 30px;
    width: 160px;
    height: 550px;
    position: relative;
    transition: all 0.4s ease-in-out;
    overflow: hidden;
    border-radius: 4px;
}

/*  Add dark overlay on image */
.project-wrapper .project-image-items::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.4); /* Adjust opacity here */
    z-index: 1;
    pointer-events: none;
    border-radius: 4px;
}

.project-wrapper .project-image-items img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
    position: relative;
    z-index: 0;
    border : 3px solid #1E4C5D    ;
}

.project-wrapper .project-image-items .content {
    position: absolute;
    left: 28%;
    bottom: 40px;
    transform: rotate(180deg) translateX(-50%);
    z-index: 2;
    writing-mode: vertical-rl;
}

.project-wrapper .project-image-items .content h4 {
    font-size: 20px;
}

.project-wrapper .project-image-items .content h4 a {
    color: var(--white);
}

.project-wrapper .project-image-items .content h4 a:hover {
    color: var(--theme-color);
}

.project-wrapper .project-image-items .content p {
    display: none;
    color: #fff;
    margin-top: 8px;
}

.project-wrapper .project-image-items .icon {
    width: 74px;
    height: 74px;
    line-height: 74px;
    display: inline-block;
    border-radius: 50%;
    text-align: center;
    background-color: var(--theme-color-2);
    color: var(--white);
    position: absolute;
    top: 25px;
    right: 25px;
    opacity: 0;
    visibility: hidden;
}

.project-wrapper .project-image-items .icon i {
    transform: rotate(-45deg);
}

.project-wrapper .project-image-items .icon:hover {
    background-color: var(--header);
}

@media (max-width: 991px) {
    .project-wrapper .project-image-items {
        width: 445px !important;
    }

   .project-wrapper .project-image-items .content {
       left: 30px;
       right: 20px;
       bottom: 30px;
       transform: none;
       transition: all 0.8s ease-in-out;
       writing-mode: initial;
   }

   .project-wrapper .project-image-items .content p {
       display: block;
   }

   .project-wrapper .project-image-items .icon {
       opacity: 1;
       visibility: visible;
   }
}

.project-wrapper .project-image-items.active {
    width: 445px !important;
}

.project-wrapper .project-image-items.active img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 4px;
    position: relative;
    z-index: 0;
    border: 3px solid #1E4C5D;
}

.project-wrapper .project-image-items.active .content {
    left: 30px;
    right: 20px;
    bottom: 30px;
    transform: none;
    transition: all 0.8s ease-in-out;
    writing-mode: initial;
}

.project-wrapper .project-image-items.active .content p {
    display: block;
}

.project-wrapper .project-image-items.active .icon {
    opacity: 1;
    visibility: visible;
}

.project-image-items.dynamic-width {
    width: var(--dynamic-width, 25%) !important;
}


/*****************************/


.filter-btn.active {
    background-color: #1E4C5D;
    color: white;
    font-size: 13px !important;
    font-weight: bold;
}

.filter-btn {
    background-color: #fff;    
    font-size: 13px !important ;
    font-weight:bold;
}

.filter-btn:hover {
    background-color: #6A0619;
    color: white;
    font-size: 13px !important;
    font-weight:bold;
}

/**********************************/

/*.casestudy-timeline 
{
    position: relative;
    padding-left: 20px;
}

.casestudy-timeline::before 
{
    content: '';
    position: absolute;
    top: 0;
    left: 5px;
    height: 100%;
    width: 2px;
    background: #1e4c5d;
}

.timeline-item 
{
    position: relative;
    padding-bottom: 20px;
}

.timeline-item::before 
{
    content: '';
    position: absolute;
    top: 5px;
    left: -10px;
    width: 10px;
    height: 10px;
    background: #1e4c5d;
    border-radius: 50%;
}


.rocket-icon 
{
    position: absolute;
    left: -30px;
    top: 0;
    color: #0000FF;
}

.flag-icon {
    position: absolute;
    left: -30px;
    top: 0;
    color: #FF0000;
}


.casestudy-timeline-bg-primary {*/
    /*background-color: #1e4c5d !important;*/
    /*background-color: #2e607126 !important;
}*/

.casestudy-logo {
    width:30% !important ;
}

@media only screen and (max-width: 767px) {
    .casestudy-logo {
        width: 100% !important;
    }
}

/* ===== Default: Desktop / Tablet (Horizontal Roadmap) ===== */
.roadmap-container {
    overflow-x: auto;        /* allow horizontal scrolling */
    overflow-y: hidden;
    white-space: nowrap;     /* keep steps on one line */
    padding-bottom: 10px;
}

.roadmap {
    display: flex;           /* horizontal layout */
    flex-wrap: nowrap;       /* prevent wrapping */
    align-items: flex-start;
    position: relative;
    min-width: max-content;  /* expand to fit all steps */
}

.roadmap::before {
    content: '';
    position: absolute;
    top: 25px;               /* align with circles */
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #ddd;
    z-index: 1;
}

.roadmap-step {
    position: relative;
    flex: 0 0 auto;          /* don't shrink */
    text-align: center;
    width: 140px;            /* fixed width */
    z-index: 2;
    display: inline-block;
}

.roadmap-step .circle {
    width: 40px;
    height: 40px;
    background-color: #1E4C5D;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 16px;
    margin: 0 auto 10px auto;
}

.roadmap-step p {
    margin: 0;
    font-size: 14px;
}

/* ===== Mobile: Vertical Roadmap ===== */
@media (max-width: 767px) {
    .roadmap-container {
        overflow-x: visible;   /* disable horizontal scroll */
        white-space: normal;   /* allow wrapping */
        padding-bottom: 0;
    }

    .roadmap {
        display: block;        /* stack steps vertically */
        min-width: auto;
        position: relative;
    }

    .roadmap::before {
        content: '';
        position: absolute;
        top: 0;
        left: 20px;            /* position vertical line under circles */
        width: 4px;
        height: 100%;
        background-color: #ddd;
        z-index: 1;
    }

    .roadmap-step {
        width: auto;
        text-align: left;
        margin-bottom: 30px;
        padding-left: 50px;    /* space for circle */
    }

    .roadmap-step .circle {
        position: absolute;
        left: 0;
        top: 0;
        width: 30px;
        height: 30px;
        font-size: 14px;
        margin: 0;
    }
}



.list-group-item-Custom {
    border: 0px !important;
}

.hr-bg {
    background-color: #1E4C5D;
    width:100% !important;
    height:2px !important ;
}

.casesImages {
    width: 100%;
    height: 170px !important;
    justify-content: center;
    align-items: center;
    background-color: #f8f9fa;
    border: 4px #1e4c5d solid !important;
    border-radius: 0.5%;
}

.casesImages img {
    width: 100%;
    height: 100%;
    /*object-fit: cover;  */
    display: block;
}

/**********************************/
.service-title {
    font-size: 23px !important;
    color: #fff;
    font-weight: bold;
}

.service-subtitle {
    color: #1e4c5d !important;
    font-size:18px ;
    font-weight:bold;
}

.card-service {
    border-radius: 15px;
    padding: 20px;
    color: white;
    height: 100%;
    position: relative;
    background-size: cover;
    background-position: center;
    overflow: hidden;

    /* Add smooth animation */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}


.card-service:hover {
    transform: scale(1.1); /* Slight enlargement */
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.3); /* Optional shadow for depth */
    z-index: 2; /* Ensure hovered card appears above others */
}

/***************************************************************************/

/* Reusable overlay class */
.overlay-dark1::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient( #1E4C5D, rgba(0, 0, 0, 0.1) );
    z-index: 0;
}

.overlay-dark1 > * {
    position: relative;
    z-index: 1;
}

.overlay-dark2::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient( #6A0619, rgba(0, 0, 0, 0.1) );
    z-index: 0;
}

.overlay-dark2 > * {
    position: relative;
    z-index: 1;
}

.overlay-dark3::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient( #610A1E, rgba(0, 0, 0, 0.1) );
    z-index: 0;
}

.overlay-dark3 > * {
    position: relative;
    z-index: 1;
}

.overlay-dark4::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient( #2E6071, rgba(0, 0, 0, 0.1) );
    z-index: 0;
}

.overlay-dark4 > * {
    position: relative;
    z-index: 1;
}


/***************************************************************************/
.card-service-background-strategy {
   /* background-image: url('/Themes/SiteImages/strategy-bg.jpg');*/
}

.card-service-background-focus-area {
    /*background-image: url('/Themes/SiteImages/focus-area.jpg');*/
}

.card-service-background-frameworks {
    /*background-image: url('/Themes/SiteImages/framework.jpg');*/
}

.card-service-background-benefits {
    /*background-image: url('/Themes/SiteImages/benefits.jpg');*/
}


.card-service-background-strategy2 {
    /*background-image: url('/Themes/SiteImages/strategy-bg2.jpg');*/
}

.card-service-background-focus-area2 {
    /*background-image: url('/Themes/SiteImages/focus-area2.jpg');*/
}

.card-service-background-frameworks2 {
    /*background-image: url('/Themes/SiteImages/framework2.jpg');*/
}

.card-service-background-benefits2 {
    /*background-image: url('/Themes/SiteImages/benefits2.jpg');*/
}

.card-service h5 {
    font-weight: bold;
}

.bg-service-teal {
  background-color: #1e4c5d;
}

.bg-service-maroon {
  background-color: #6A0619;
}

.bg-service-red {
    background-color: #460f1c;
}

.bg-service-darkred {
  background-color: #2E6071;
}

/**********************************************/

/*.bg-service-teal2 {
    background-color: #6A0619 ;
}

.bg-service-maroon2 {
    background-color: #1e4c5d;
}

.bg-service-red2 {
    background-color: #2E6071 ;
}

.bg-service-darkred2 {
    background-color: #460f1c;
}*/

.bg-service-teal2 {
    background-color: #1e4c5d;
}

.bg-service-maroon2 {
    background-color: #6A0619;
}

.bg-service-red2 {
    background-color: #460f1c;
}

.bg-service-darkred2 {
    background-color: #2E6071;
}



/**********************************************/

/*.bg-service-teal3 {
    background-color: #9f6570;
}

.bg-service-maroon3 {
    background-color: #73bead;
}

.bg-service-red3 {
    background-color: #4a7a6f;
}

.bg-service-darkred3 {
    background-color: #72424b;
}*/

.bg-service-teal3 {
    background-color: #1e4c5d;
}

.bg-service-maroon3 {
    background-color: #6A0619;
}

.bg-service-red3 {
    background-color: #460f1c;
}

.bg-service-darkred3 {
    background-color: #2E6071;
}



/**********************************************/

#ctl00_cntBody_ucClassicSTopic1_lblDDetails > div > div.row.g-4 > div > div > p {
    color: #fff;
    font-size : 18px;
}

#ctl00_cntBody_ucClassicSTopic1_lblDDetails > div > div.row.g-4 > div > div > ul > li {
    color: #fff;
    font-size: 18px;
}


/**********************************************/
.learning-gallery-img {
    width: 180px; /* Fixed width for consistency */
    height: 130px; /* Fixed height */
    object-fit: contain; /* Better for logos */
    margin: 10px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.learning-gallery-img:hover {
    transform: scale(1.05);
}

.learning-image-gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-top: 2rem;
}


/****************************/

.learning-modern-services-section {
     padding: 40px 0;
}

.learning-modern-section-title {
    color: #1e4c5d;
    font-weight: bold;
    margin-bottom: 20px;
    text-transform: uppercase;
}
.learning-modern-services-list .list-group-item {
    background-color: #1E4C5D;
    color: #ffffff; /* White text */
    border: none;
    margin-bottom: 10px;
    border-radius: 5px; /* Slightly rounded corners */
    padding: 15px 20px;
    font-size: 1.1em;
    transition: background-color 0.3s ease;
}
.learning-modern-services-list .list-group-item:hover {
    background-color: #610A1E; 
}

.learning-modern-services-list .list-group-item::before {    
    margin-right: 10px;
    font-weight: bold;
}

/****************************/

.badge-4cs {
    background: linear-gradient(90deg, #6a0619, #47f6f8);
    color: #033033;
    padding: 0.5rem 1.25rem;
    border-radius: 999px;
    font-weight: 800;
    color: #fff;
    display: inline-block;
    box-shadow: 0 6px 18px rgba(47, 208, 209, 0.12);
}

.arrow-down {
    font-size: 6rem;
    color: #7b1222;
    margin: 0.75rem 0;
    display: block;
}


@media (max-width: 575.98px) {
    .card-4c {
        min-height: auto;
    }
}



/*********************************/

.white-link-title { 
    color: #fff !important ;
    font-size:19px !important ;
    text-decoration : none ;
}

.partner-client-logo {
  padding: 1rem;
  text-align: center;
  transition: all 0.3s ease-in-out;
}

.partner-client-logo:hover {
    transform: scale(1.05);
    opacity: 0.8;
}

/* This class replaces the inline style for white/light logos */
.partner-logo-inverted-bg {
  background-color: #000;
  padding: 10px;
  border-radius: 5px; /* Optional: adds rounded corners */
}

.partner-logo-inverted-bg-whiter {
    background-color: #fff;
    padding: 10px;
    border-radius: 5px;
}


/*********************************/

.floating-download-wrapper {
  position: fixed;
  bottom: 110px;
  right: -120px; 
  z-index: 1050;
  text-align: center;
  transition: right 0.4s ease;
}

.floating-download-wrapper.active {
  right: 30px; 
}

.floating-download-btn {
  box-shadow: 0 6px 12px rgba(0,0,0,0.2);
  border-radius: 50%;
  width: 120px;
  height: 120px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 36px;
  background: #6A0619;
  color: #fff;
  text-decoration: none;
  border: 5px solid #fff;
  padding: 10px;
  position: relative;
}

.floating-download-btn:hover {
    color:#fff;
}

.floating-download-btn span {
  font-size: 14px;
  font-weight: bold;
  margin-top: 6px;
  line-height: 1.2;
}

/* Handle (half visible button) */
.dock-handle {
  position: absolute;
  top: 50%;
  left: -30px; 
  transform: translateY(-50%);
  width: 30px;
  height: 60px;
  background: #6A0619;
  border: 3px solid #fff;
  border-radius: 30px 0 0 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #fff;
  font-size: 16px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}


/*********************************/
.core-buss-section {
    margin-bottom: 2rem;
}

.core-buss-title {
    font-size: 3rem;
    font-weight: 600;
    color: #6A0619;
    margin-bottom: 0.5rem;
}

.core-buss-text {
    margin-bottom: 0.5rem;
}

.core-buss-list {
    list-style-type: disc;
    padding-left: 1.5rem;
}


.white-text-black-border {
    color: white;
    /*-webkit-text-stroke: 0.8px black;*/ /* visible but not too thick */
    text-stroke: 1px black;
    /* fallback for browsers without text-stroke */
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    font-weight: 700; /* make white text bold so it stands out */
    font-size:22px !important ;
}

#map {
    width: 800px; /* Fixed container size */
    height: 600px; /* Fixed container size */
    margin: 0 auto;
}

.map-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 ratio, adjust if needed */
  height: 0;
  overflow: hidden;
  border-radius: 8px; /* optional rounded corners */
}

.map-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/*****************************/
.back-custom-icon {
    background-color: rgb(103, 6, 24); /* Custom dark red */
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 50%; /* Perfect circle */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px !important; 
    border: none;
    cursor: pointer;
    transition: 0.3s;
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
    text-decoration: none; /* Prevent underline for LinkButton */
}

.back-custom-icon:hover {
    background-color: rgb(150, 20, 40);  /* Slightly lighter red on hover */
    transform: scale(1.1);               /* Grow effect */
    color: #fff;
}


@media print {
    .no-pdf {
        display: none !important;
    }
}