/* Make carousel full height */
#mainSlider, 
#mainSlider .carousel-inner, 
#mainSlider .carousel-item {
    height: 100vh; /* Full viewport height */
}

a:hover {
    text-decoration: auto;
}

.dashboard-pdf-frame {
    border: 0;
}



:root {
    --base-font-size: 16px;
}

html {
    font-size: var(--base-font-size);
    transition: font-size 0.2s ease-in-out;
}

/* Font size steps */
html.font-step-1 {
    --base-font-size: 17px;
}

html.font-step-2 {
    --base-font-size: 18px;
}

html.font-step-3 {
    --base-font-size: 19px;
}


    



    /* --- Carousel Section --- */
	    .carousel-item img {
	        height: 430px;
	        object-fit: cover;
	        filter: brightness(0.8);
	    }

	    .hero-banner-row {
	        align-items: stretch;
	    }

	    .hero-carousel-col,
	    .hero-copy-col {
	        display: flex;
	    }

	    #heroCarousel {
	        width: 100%;
	    }
	    
	    .carousel-caption {
        background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 100%);
        bottom: 0;
        left: 0;
        right: 0;
        padding-bottom: 2rem;
        padding-top: 4rem;
    }

	    .banner-content-side {
	            display: flex;
	            flex-direction: column;
	            justify-content: center;
	            padding: 3rem; /* Adds nice spacing around the text */
            height: 100%; /* Ensures it matches the image height */

            background-color: #f1f3f5; 
            /* background: linear-gradient(270deg, #bfd6ed 0%, #a2dfff 100%); */
            /* background: linear-gradient(0deg, #ddedfd 0%, #b9e4fb 100%); */
            background: linear-gradient(0deg, #f0f2f4 0%, #d0efff 100%); 
            animation: fadeInContent 0.8s ease-in-out;
        }

        /* Animation definition */
        @keyframes fadeInContent {
            from {
                opacity: 0;
                transform: translateX(20px); /* Content slides in from the right */
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        .banner-content-side h2 {
            font-weight: 300; /* A lighter, more modern font weight */
            border-bottom: 2px solid #0d6efd; /* Bootstrap's primary blue */
            padding-bottom: 0.5rem;
            display: inline-block; /* Makes the border only span the text */
        }
        
	        .banner-content-side p {
	            font-size: 1.15rem;
	            line-height: 1.7;
	            color: #333;
	            font-weight: 600;
	            text-align: left;
	        }

	    @media (max-width: 1599.98px) {
	        .carousel-item img {
	            height: 390px;
	        }

	        .banner-content-side {
	            padding: 2.25rem;
	        }

	        .banner-content-side h2 {
	            font-size: 2rem;
	        }

            .btn-login{
                font-size: 1rem !important;
            }

	        .banner-content-side p {
	            font-size: 1rem;
	            line-height: 1.55;
	        }
	    }

	    @media (max-width: 1199.98px) {
	        .hero-carousel-col {
	            flex: 0 0 66.666667%;
	            max-width: 66.666667%;
	        }

	        .hero-copy-col {
	            flex: 0 0 33.333333%;
	            max-width: 33.333333%;
	        }

	        .carousel-item img {
	            height: 340px;
	        }

	        .banner-content-side {
	            padding: 1.75rem;
	        }

	        .banner-content-side h2 {
	            font-size: 1.7rem;
	        }

            .btn-login{
                font-size: 14px !important;
            }

	        .banner-content-side p {
	            font-size: 0.95rem;
	            line-height: 1.45;
	        }
	    }

	    @media (max-width: 991.98px) {
	        .hero-banner-row {
	            flex-direction: column;
	        }

	        .hero-carousel-col,
	        .hero-copy-col {
	            flex: 0 0 100%;
	            max-width: 100%;
	        }

	        .carousel-item img {
	            height: 320px;
	        }

	        .banner-content-side {
	            min-height: auto;
	            padding: 1.5rem 1.25rem;
	        }

	        .banner-content-side h2 {
	            font-size: 1.5rem;
	            margin-bottom: 1rem !important;
	        }

            .btn-login{
                font-size: 12px !important;
            }

	        .banner-content-side p {
	            font-size: 0.95rem;
	            text-align: left;
	        }
	    }

	    @media (max-width: 767.98px) {
	        .carousel-item img {
	            height: 260px;
	        }

	        .carousel-indicators {
	            margin-bottom: 0.5rem;
	        }

	        .carousel-control-prev,
	        .carousel-control-next {
	            width: 12%;
	        }

	        .banner-content-side {
	            padding: 1.25rem 1rem;
	        }

	        .banner-content-side h2 {
	            font-size: 1.35rem;
	        }

	        .banner-content-side p {
	            font-size: 0.9rem;
	            line-height: 1.4;
	        }
	    }

    /* --- What's New Marquee --- */
    .news-container {
        /* background-color: #1d56b6; */
        background-color: #054290;
        color: white;
        padding: 12px 0;
        display: flex;
        align-items: center;
    }
    .marquee-wrapper {
        flex-grow: 1;
        overflow: hidden;
        white-space: nowrap;
    }
    .news-marquee-content {
        display: inline-block;
        padding-left: 100%; /* Start off-screen */
        animation: marquee 250s linear infinite;
    }

    .news-marquee-content a{
        color: #fbfbfb;
        font-size: 15px;
    }

    .news-marquee-content.paused,
    .news-marquee-content:hover {
        animation-play-state: paused;
    }
    .news-marquee-content .tag {
        font-weight: bold;
        /* background-color: #fba21b; */
        background-color: #0891b2;
        color: #fff;
        padding: 4px 9px;
        border-radius: 4px;
        margin-right: 15px;
    }
    .news-marquee-content .separator {
        margin: 0 25px;
        color: #6c757d;
    }
    #marquee-toggle {
        background: none;
        border: none;
        color: #0891b2;
        font-size: 1.1rem;
        padding: 0 20px;
        cursor: pointer;
    }
    #marquee-toggle:focus {
        outline: none;
        box-shadow: none;
    }
    .client-logos-section {
        padding-top: 40px !important;
    }

    .carousel-item:nth-child(2) img {
        transform: skewY(5deg) scale(1.34);
    }
    
	    @keyframes marquee {
	        0%   { transform: translateX(0); }
	        100% { transform: translateX(-50%); }
	    }

    /* --- Tiles Card Section --- */
    

    .client-logos-section {
        padding-bottom: 20px;
    /* margin-bottom: 30px; */
        border-bottom: 1px solid #174555;
        background-color: #fff;
        margin-top: -1px;
        padding-top: 20px;
    }

    .tiles-section {
        padding: 30px 0 60px 0;
    }

    .tiles-container{
        margin-inline: 5%;
    }

    .section-title {
        margin-bottom: 30px;
        font-weight: 700;
    }

    .tile-card {
            width: 100%;
            max-width: 24rem; 
            height: 28rem !important;
            /* All direct children will transition */
            & * {
                transition: all 0.3s ease-in-out;
            }
        }

        /* Background Image Styling */
        .tile-card .card-img-bg {
            transition: transform 0.5s ease-in-out;
        }
        
        .tile-card:hover .card-img-bg {
            transform: scale(1.2);
        }

        /* Overlay Styling */
        .tile-card .card-overlay {
            /* background-color: rgba(0, 0, 0, 0.5); */
            /* background-color: rgb(0 41 86 / 56%); */
            background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgb(0 79 149 / 56%) 63.21%), rgba(0, 0, 0, .08);
            transition: background-color 0.3s ease-in-out;
        }

        .tile-card:hover .card-overlay {
            background-color: rgba(0, 0, 0, 0.75);
        }

        .tile-card .card-description{
            height: 9rem;
            font-weight: 600;
            text-align: justify;
            color: #325578;
        }

        /* Description Styling (Hidden by default) */
        /* .tile-card .card-description {
            opacity: 0;
            transform: translateY(1.5rem);
        }

        .tile-card:hover .card-description {
            opacity: 1;
            transform: translateY(0);
            transition-delay: 0.1s;
        }
         */
        /* Expand Link Styling (Hidden by default) */
        /* .tile-card .expand-link {
            opacity: 0;
        } */

        .tile-card .expand-link {
            position: absolute;
            bottom: -20px;
            right: 20px;
            color: #325578;
        }

        .tile-card:hover .expand-link {
            opacity: 1;
            transition-delay: 0.2s;
        }
/* 
        .tile-card .card-body{
            background-image: url("/mahaias/image/card-pattern-2.png");
            background-repeat: no-repeat;
            background-size: contain;
            background-position: right;
            position: relative;
            z-index: 1;
        } */
        .tile-card .card-body{
            background-image: url("/mahaias/image/card-pattern-2.png");
            background-repeat: no-repeat;
            background-size: contain;
            background-position: right;
            position: relative;
            z-index: 1;
        }

        @media (max-width: 768px) {
            .client-logos-section{
                display: none;
            }
        }

    /* 2026 landing-page refresh */
    .landing-shell {
        --landing-green: #087326;
        --landing-blue: #123b9f;
        --landing-orange: #ed5a16;
        --landing-gold: #ef9700;
        /* background: #fffaf2; */
        background: #f5e8d2;
        color: #14213d;
        /* padding: 22px clamp(16px, 2.2vw, 38px) 12px; */
    }

    .landing-container {
        /* width: min(100%, var(--public-shell-width)); */
        margin-inline: auto;
    }

    .landing-stack {
        display: grid;
        gap: 10px;
    }

    .landing-hero {
        min-height: 474px;
        padding-inline: 2.5%;
        position: relative;
        overflow: hidden;
        border-radius: 14px;
        margin-bottom: 30px;
        background:
            radial-gradient(ellipse at 1% 98%, rgba(255, 171, 51, 0.56) 0, rgba(255, 181, 71, 0.28) 23%, rgba(255, 185, 79, 0) 45%),
            radial-gradient(ellipse at 96% 9%, rgba(204, 239, 132, 0.78) 0, rgba(212, 242, 151, 0.43) 35%, rgba(222, 244, 173, 0) 60%),
            linear-gradient(105deg, #fff0d9 0%, #fff8eb 43%, #e6f5c8 100%);
        box-shadow: 0 8px 28px rgba(116, 70, 15, .10);
    }

    .landing-hero::before,
    .landing-hero::after,
    .landing-hero-wave {
        content: "";
        position: absolute;
        pointer-events: none;
    }

    .landing-hero::before {
        left: 40%;
        right: -8%;
        bottom: 54px;
        height: 185px;
        background: rgba(211, 240, 164, 0.72);
        border-radius: 58% 0 0 0 / 85% 0 0 0;
        transform: rotate(-8deg);
        z-index: 0;
    }

    .landing-hero::after {
        left: 56%;
        right: -8%;
        bottom: -48px;
        height: 160px;
        background: rgba(190, 226, 121, 0.68);
        border-radius: 64% 0 0 0 / 100% 0 0 0;
        transform: rotate(-4deg);
        z-index: 0;
    }

    .landing-hero-wave {
        left: -6%;
        right: -8%;
        bottom: -72px;
        height: 190px;
        background: rgba(255, 234, 199, 0.64);
        clip-path: polygon(0 48%, 12% 68%, 29% 70%, 45% 55%, 58% 31%, 71% 23%, 83% 34%, 100% 6%, 100% 100%, 0 100%);
        z-index: 0;
    }

    .landing-hero-copy {
        padding: clamp(34px, 5vw, 50px);
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: relative;
        z-index: 1;
    }

	.landing-hero-copy h1  {
        max-width: 840px;
        margin: 0 0 30px;
        color: #393939;
        font-size: clamp(2rem, 3.2vw, 2.8rem);
        line-height: 1.3;
        font-weight: 700;
    }

    .landing-hero-copy h1 span:first-child{
        /* color: #393939; */
        color: #02691f;
    }

    .landing-hero-copy h1 span { color: var(--landing-orange); }

    .tricolour-rule {
        display: flex;
        gap: 7px;
        margin-bottom: 28px;
    }

    .tricolour-rule span {
        width: 54px;
        height: 4px;
        border-radius: 99px;
        background: var(--landing-orange);
    }

    .tricolour-rule span:nth-child(2) { background: #fff; box-shadow: 0 0 0 1px #ddd; }
    .tricolour-rule span:nth-child(3) { background: var(--landing-green); }

	    .landing-hero-copy p {
	        /* max-width: 690px; */
	        margin: 0;
	        font-size: 1.4rem;
	        line-height: 1.68;
	        font-weight: 600;
            text-align: justify;
	    }

    .landing-hero-visual {
        min-height: 380px;
        padding: 10px clamp(22px, 3vw, 30px) 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        z-index: 1;
    }

    .landing-hero-visual::before,
    .landing-hero-visual::after {
        content: "";
        position: absolute;
        border-radius: 50%;
        pointer-events: none;
    }

    .landing-hero-visual::before {
        inset: 17% 13% auto auto;
        width: min(300px, 78%);
        aspect-ratio: 1;
        border: 2px solid rgba(255,255,255,.48);
        box-shadow: 0 0 0 28px rgba(255,255,255,.10), 0 0 0 58px rgba(255,255,255,.06);
    }

    .landing-hero-visual::after {
        right: -4%;
        bottom: -18%;
        width: 320px;
        height: 320px;
        background: radial-gradient(circle, rgba(163,211,87,.62) 0%, rgba(163,211,87,0) 70%);
    }

	    .landing-shell .news-container {
	        margin: -60px 2.2% 0;
	        padding: 12px 18px;
	        display: flex;
	        align-items: center;
	        gap: 12px;
	        min-width: 0;
	        max-width: 100%;
	        overflow: hidden;
	        box-sizing: border-box;
	        border: 1px solid #e5e5e5;
	        border-radius: 12px;
	        background: #fff;
	        color: #13234a;
	        box-shadow: 0 4px 14px rgba(0,0,0,.08);
	        position: relative;
	        z-index: 4;
	    }

	    .landing-shell .news-container::before {
	        content: none;
	    }

	    .landing-shell .news-label {
	        flex: 0 0 auto;
	        display: inline-flex;
	        align-items: center;
	        gap: 8px;
	        padding: 0 18px 0 4px;
	        color: var(--landing-orange);
	        font-weight: 700;
	        font-size: 1.15rem;
	        border-right: 1px solid #e2e2e2;
	        text-transform: none !important;
	    }

	    .landing-shell .news-label i {
	        font-size: 1.05rem;
	    }

	    .landing-shell .marquee-wrapper {
	        min-width: 0;
	        flex: 1 1 auto;
	        overflow: hidden;
	        max-width: 100%;
	    }
	    .landing-shell .news-marquee-content a,
	    .landing-shell .news-marquee-content {
	        color: #13234a;
	        font-size: .9rem;
	        font-weight: 600;
	        display: inline-flex;
	        align-items: center;
	        min-width: max-content;
	        width: max-content;
	        max-width: none;
	        white-space: nowrap;
	        padding-left: 0;
	        animation: marquee 95s linear infinite;
	        will-change: transform;
	    }
	    .landing-shell .news-viewall {
	        margin-left: auto;
	        border: 0;
	        background: transparent;
	        color: var(--landing-green);
	        font-weight: 700;
	        text-decoration: none;
	        white-space: nowrap;
	        font-size: 1rem;
	        cursor: pointer;
	    }
	    .updates-modal-list { max-height: 365px; overflow-y: auto; padding-right: .5rem; }
	    .updates-modal-list::-webkit-scrollbar { width: 7px; }
	    .updates-modal-list::-webkit-scrollbar-thumb { background: #b9c1ce; border-radius: 8px; }
	    .updates-modal-item { padding: 1rem 0; border-bottom: 1px solid #e8ebf0; }
	    .updates-modal-item:last-child { border-bottom: 0; }
	    .updates-modal-item .tag { display: inline-flex; align-items: center; margin: 0 .6rem 0 0; padding: 4px 13px; border-radius: 7px; background: #fff3ec; color: #d95c0f; font-size: .78rem; font-weight: 700; }
	    .updates-modal-item__description { margin: .55rem 0 0; color: #45536f; }
	    .landing-shell .tag {
	        display: inline-flex;
	        align-items: center;
	        padding: 4px 13px;
	        margin: 0 10px 0 8px;
	        border-radius: 7px;
	        background: #fff3ec;
	        color: var(--landing-orange);
	        font-size: .78rem;
	        font-weight: 700;
	    }
	    .landing-shell .news-marquee-content > *:nth-child(6n + 1).tag { background: #fff3ec; color: #d95c0f; }
	    .landing-shell .news-marquee-content > *:nth-child(6n + 4).tag { background: #eef8eb; color: #2c7c2b; }
	    .landing-shell .news-marquee-content > *:nth-child(6n + 7).tag { background: #eef1ff; color: #3459d5; }
	    .landing-shell .news-marquee-content > *:nth-child(6n + 10).tag { background: #f4ebff; color: #7c3cb2; }
	    .landing-shell .separator { color: #a4afc6; }
	    .landing-shell .news-marquee-content .separator {
	        display: inline-block;
	        width: 1px;
	        height: 22px;
	        margin: 0 20px;
	        vertical-align: middle;
	        background: #d7dce8;
	        color: transparent;
	        font-size: 0;
	    }

    .landing-shell .tiles-section { padding: 30px 10px; margin: 0 !important; }
    .landing-shell .tiles-section .container { max-width: none; padding: 0; }
    .landing-shell .tiles-section .row { margin-inline: -6px; }
    .landing-shell .tiles-section [class*="col-"] { padding-inline: 15px; }

	    .landing-shell .tile-card {
	        --card-accent: var(--landing-green);
	        --card-soft: #edf7ef;
	        max-width: none;
	        min-height: 300px;
	        height: 100% !important;
	        border: 1px solid #e5e5e5 !important;
        border-radius: 12px !important;
        box-shadow: 0 4px 14px rgba(0,0,0,.08) !important;
        background: #fff;
    }
    .landing-shell .tiles-section [class*="col-"]:nth-child(2) .tile-card {
        --card-accent: var(--landing-blue);
        --card-soft: #edf2ff;
    }
    .landing-shell .tiles-section [class*="col-"]:nth-child(3) .tile-card {
        --card-accent: var(--landing-orange);
        --card-soft: #fff1e7;
    }
    .landing-shell .tiles-section [class*="col-"]:nth-child(4) .tile-card {
        --card-accent: #7c3aed;
        --card-soft: #f3ecff;
    }

	    .landing-shell .tile-card .tile-top {
	        min-height: 94px;
	        padding: 16px 22px;
	        position: relative;
	        display: flex;
	        align-items: center;
	        gap: 14px;
	        background: var(--card-soft);
	    }
	    .landing-shell .tile-watermark {
	        position: absolute;
	        right: 18px;
	        top: 50%;
	        transform: translateY(-50%);
	        opacity: .12;
	        color: var(--card-accent);
	        pointer-events: none;
	        line-height: 1;
	    }
	    .landing-shell .tile-watermark i { font-size: 4.5rem; }
	    .landing-shell .tile-icon {
	        width: 58px;
	        height: 58px;
	        display: grid;
	        place-items: center;
	        flex: 0 0 auto;
	        border-radius: 50%;
	        background: var(--card-accent);
	        color: #fff;
	        font-size: 1.62rem;
	    }
	    .landing-shell .tile-card .card-body { padding: 20px 22px 18px !important; background: #fff !important; }
	    .landing-shell .tile-card h4 { color: var(--card-accent); font-size: 1.72rem; line-height: 1.18; }
	    .landing-shell .tile-card h4::after {
	        content: "";
	        display: block;
	        width: 44px;
	        height: 3px;
	        margin-top: 10px;
	        border-radius: 99px;
	        background: var(--card-accent);
	    }
	    .landing-shell .tile-card .card-description {
	        height: auto;
	        display: -webkit-box;
	        -webkit-line-clamp: 4;
	        -webkit-box-orient: vertical;
	        overflow: hidden;
	        color: #222;
	        font-size: 1.05rem;
	        line-height: 1.56;
	        font-weight: 500;
	        text-align: justify;
	    }
	    .landing-shell .tile-card .expand-link {
	        position: static;
	        color: var(--card-accent);
	        text-align: right;
	        font-size: 1.08rem;
	    }

    @media (max-width: 991.98px) {

        .landing-hero { min-height: 420px; }
        
        .landing-hero-copy { padding: 34px 28px; padding-bottom: 0px;}

        .landing-hero-visual { 
            min-height: 280px;
            margin-bottom: 30px;
         }

         .landing-hero-copy p {
            font-size: 1.3rem;
         }

    }

	    @media (max-width: 575.98px) {
            .landing-shell { padding-inline: 12px; }
            .landing-shell .news-container {
                margin-inline: 0;
                padding-inline: 10px;
                gap: 8px;
            }
            .landing-hero-copy h1 { font-size: 1.5rem; }
            .landing-hero-copy p {
                font-size: 1rem;
            }
	        .landing-shell .news-label span { display: none; }
	        .landing-shell .news-viewall span { display: none; }
	        .landing-shell .tile-watermark i { font-size: 3.4rem; }
            .landing-shell .tile-card h4 {
                color: var(--card-accent);
                font-size: 1.4rem;
            }

            .landing-shell .tile-card .card-description {
                font-size: 0.85rem;
            }

            .landing-shell .tile-icon {
                width: 48px;
                height: 48px;
                font-size: 1.4rem;
            }

            .landing-shell .tile-card .expand-link {
                font-size: 0.75rem;
            }

            .landing-shell .tile-card .tile-top {
                min-height: 14px;
                padding: 10px 16px;
            }


        }
