/* Custom CSS that layers on top of Tailwind utility classes.
   Only things Tailwind can't cleanly express live here:
   gradients, keyframe animations, multi-layer backgrounds, pseudo-elements. */
@layer utilities {
    .bg-brand-gradient {
        background-image: linear-gradient(135deg, rgba(13, 90, 141, 1) 0%, rgba(9, 90, 141, 1) 69%, rgba(98, 169, 69, 1) 100%);
    }
}
body {
    font-family: 'Kumbh Sans', sans-serif;
    font-weight: 400;
}

.btn-gradient-brand {
    background-image: linear-gradient(107deg, #0D5A8E 51%, #62A845 81%);
}
.btn-gradient-brand:hover {
    filter:brightness(1.08);
}
.stat-num {
    line-height: normal;
    margin-top: 0;
}
/* solution cards: circuit-line hover decoration */
.sol-card {
    position: relative;
    overflow: hidden;
    transition: 0.2s ease;
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.16);
}
.sol-card:hover {
    transform: translateY(-4px);
  
    border-color: transparent;
}
.sol-card::after {
       background-image: url(images/service-item-shape.png);
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    background-size: contain;
    width: 95%;
    height: 95px;
    background-repeat: no-repeat;
    background-position: right;
    transition: all 400ms;
    opacity: 0;
    visibility: hidden;
    z-index: -1;
}
.sol-card:hover:after{
	opacity:1;
	visibility:visible;
	height:101px;
}
nav ul li a{
    font-size: 1rem;
    font-weight: 500;
}
.top-menu a {
    font-size: 15px;
}
.hover\:text-\[\#62a945\]:hover {
    --tw-text-opacity: 1;
    color: #fff !important; 
}
/* contact section: dark diagonal background + toggle-switch icon */
.contact-section {
    position: relative;
    overflow: hidden;
    background: linear-gradient(120deg, #0a1830 0%, #123356 55%, #1c4a78 100%);
}
.contact-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 46%;
    height: 70%;
    background: rgba(255,255,255,.05);
    clip-path: polygon(0 0, 100% 0, 0 100%);
}
.toggle-eyebrow .switch {
    width: 34px;
    height: 18px;
    border-radius: 20px;
    background: #1b2433;
    position: relative;
    display: inline-block;
}
.toggle-eyebrow .switch::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
}

/* testimonial carousel */
.t-swiper .swiper-slide {
    height: auto;
}

/* features section: radial dark background + icon badge + corner triangle hover */
.features-section {
   background-color: #3A3737;
    background-image: url(images/offer-shadow-shape-1.png);
    background-position: center center;
    background-repeat: no-repeat;
}
.feat-icon-badge {
    position: absolute;
    top: -30px;
    left: 0%;
    right: 0%;
      transform: rotateY(345deg);
    transition: 1s ease;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #2f4a72, #0d1120 75%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 6px rgba(255,255,255,.03);
    margin:0 auto;
}
.feat-icon-badge svg {
    width: 26px;
    height: 26px;
    color: #fff;
}
.feat-card {
    transition: 0.3s ease;
}
.feat-card:hover {
    border-color: rgba(255,255,255,.35);
}
.feat-corner {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    transition: 0.3s ease;
}
.feat-corner.tr {
   width: 50px;
    height: 50px;
    background-size: cover;
    content: "";
    position: absolute;
    opacity:0;
	visibility:hidden;
        top: 50%;
    right: 50%;
	transition: all 0.3s ease-in-out;
    background-image: url(images/offter-item-shape-top.png);
}
.feat-corner.bl {
    width: 50px;
    height: 50px;
    background-size: cover;
    content: "";
    position: absolute;
    opacity:0;
	visibility:hidden;
        bottom: 50%;
    left: 50%;
	transition: all 0.3s ease-in-out;
   
   background-image: url(images/offter-item-shape-bottom.png);
}
.feat-card:hover .feat-corner {
    opacity: 1;
}
.feat-card:hover .feat-corner.bl{
	
    bottom: -1px;
    left: -1px;
    opacity: 1;
    visibility: visible;
}
.feat-card:hover .feat-corner.tr{
	    top: -1px;
    right: -1px;
    opacity: 1;
    visibility: visible;
}
.feat-card:hover .feat-icon-badge {
    background: linear-gradient(90deg, #0d5a8d -10.59%, #00060c 300.59%);
  transform: rotateY(0deg);
}


/* success mantra: rotating dashed circle + bobbing arrow */
.mantra-circle {
    position: relative;
    width: 151px;
    height: 151px;
    margin: 0 auto 28px;
}
.mantra-circle img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}
.mantra-circle::after {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    border: 1px dashed #62A945;
    animation: mantra-spin 14s linear infinite;
}
.mantra-arrow img {
   animation: bobble 3s ease-in-out infinite alternate;
}
@keyframes bobble {
  0% {
    transform: translateY(0) scale(1);
  }
  100% {
    transform: translateY(-20px) scale(1.1);
  }
}
@keyframes mantra-spin {
    to {
        transform: rotate(360deg);
    }
}
.mantra-arrow {
    align-items: flex-start;
    justify-content: center;
    height: 180px;
}
.mantra-arrow svg {
    color: #c9d3f5;
    animation: mantra-bob 1.8s ease-in-out infinite;
}
@keyframes mantra-bob {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}
@media (prefers-reduced-motion: reduce) {
    .mantra-arrow svg,
    .mantra-circle::after {
        animation: none;
    }
}
li.has-dropdown ul li a:hover {
    background: #0c5a8c;
    color: #fff;
    border-radius: 0;
}
.elementor-widget-container p {
    margin-bottom: 1.6rem;
    display: block;
    font-size: 18px;
    text-align: justify;
    font-weight: 400;
    color: #585858;
}
.elementor-widget-container p a{
    text-decoration: underline;
    color: #060097;
}
/* deploy section images */
.deploy-card {
    display: block;
    border-radius: 0.6rem;
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
}
p{
    font-size: 1rem;
    line-height: 28px;
}
/* footer social icon box */
.footer-social {
    width: 38px;
    height: 38px;
    border: 1px solid #7a7a7a;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}
.footer-social:hover {
    border-color: #62A945;
    color: #62A945;
}

/* reusable inner-page hero (used across all inner pages) */
.inner-hero {
    position: relative;
    overflow: hidden;
    padding: 70px 0;
    min-height: 446px;
    display: flex;
    align-items: center;
        background-position: center right;
    background-repeat: no-repeat;
    background-size: cover;
}
.inner-hero .breadcrumb-custom .sep {
    color: #fff;
    font-weight: 700;
}

/* "designed to" feature strip (solutions page) */
.designed-icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: #fff;
   padding: 13px;
    box-shadow: 0 4px 9px #b9b9b9;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}
.designed-icon svg {
    width: 48px;
    height: 48px;
    color: #62A945;
}

/* core banking feature blocks */
.cb-icon-box {
        display: flex !important;
    width: 138px !important;
    height: 129px;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    border: 1px solid #62a945;
    padding: 9px 11px;
}
.cb-icon-box img {
    width: 158px;
    height: 144px;
    color: #10172A;
    max-width: 158px;
}

/* Software Management Systems: bordered icon-image box */
.sms-icon-box {
    width: 150px;
    height: 129px;
    border: 1px solid #62A945;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 9px 11px;
    overflow: hidden;
}

/* nav dropdown: JS-driven hover-intent (with a short close delay) so the
   menu doesn't snap shut while moving the mouse from the trigger into it */
.has-dropdown > ul {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 0;
    padding-top: 14px;
    margin-top: 25px;
    /* the extra padding-top above acts as a hoverable bridge, no visual gap */
}
.has-dropdown.dropdown-open > ul {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}


.has-dropdown.dropdown-open > ul{
  opacity:1 !important;
  visibility:visible !important;
  transform:translateY(0) !important;
  
  }
 
/* header "Submit A Query" gradient button background */
.bg-brand-gradient{
  background:linear-gradient(135deg, rgba(13,90,141,1) 0%, rgba(9,90,141,1) 69%, rgba(98,169,69,1) 100%);
}
.bg-brand-gradient:hover{ filter:brightness(1.08); }
 
/* mobile nav accordion (Solutions dropdown, click-to-expand on small screens) */
.has-dropdown.mobile-open > div{
  background:#095A8D;
}
.has-dropdown.mobile-open > div .dropdown-link,
.has-dropdown.mobile-open > div .dropdown-arrow-btn{
  color:#fff;
}
.has-dropdown.mobile-open .dropdown-chevron{
  transform:rotate(180deg);
}
 footer ul li a {
    font-size: 15px;
    color: #aaa;
    font-weight: 400;
}
footer a{
    font-weight: 400;
}
footer p{
  font-size: 14px;
  color: #aaa;
  font-weight: 400;
}
p{
    text-align: justify;
}
svg.e-font-icon-svg.e-fab-linkedin path {
    fill: #0F0D1D;
}
/* full-screen mobile nav overlay: sits below the fixed/sticky header */
@media (max-width: 1023px){
  #mainNav.mobile-menu-open{ display:flex; flex-direction:column; }

    .top-menu{
        display: none;
    }
  .has-dropdown > ul{

  position:static !important;
  margin-top:0;
  padding-top:0px;
  padding-left:0px;
  }
  button.dropdown-arrow-btn.px-6.lg\:px-2.py-4.lg\:py-2.flex.items-center svg {
    width: 16px;
    height: 22px;
}
}