/*=====================================================
        Dr. Babasaheb Ambedkar Multistate
        Modern Banking Website 2026
======================================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

/*================ CHAIRMAN =================*/

.chairman-section{

padding:80px 20px;

background:#f8f9fc;

}

.chairman-card{

max-width:1000px;

margin:auto;

background:#fff;

border-radius:30px;

padding:50px;

text-align:center;

box-shadow:0 15px 45px rgba(0,0,0,.10);

transition:.4s;

}

.chairman-card:hover{

transform:translateY(-10px);

box-shadow:0 25px 60px rgba(0,0,0,.18);

}

.chairman-image{

display:flex;

justify-content:center;

margin-bottom:30px;

}

.chairman-image img{

width:230px;

height:230px;

border-radius:50%;

object-fit:cover;

border:8px solid #FDB913;

transition:.5s;

}

.chairman-card:hover .chairman-image img{

transform:scale(1.08) rotate(2deg);

box-shadow:0 15px 40px rgba(253,185,19,.45);

}

.designation{

display:inline-block;

background:#FDB913;

align-items: center;
color:#003B8E;

padding:10px 30px;

border-radius:50px;

font-size:18px;

font-weight:700;

margin-bottom:20px;

}

.designation i{

margin-right:8px;

}

.chairman-info h2{

font-size:38px;

color:#003B8E;

margin-top:15px;

margin-bottom:10px;

}

.chairman-info h4{

font-size:20px;

color:#666;

font-weight:500;

margin-bottom:25px;

}

.chairman-info p{

max-width:850px;

margin:auto;

font-size:17px;

line-height:32px;

color:#555;

}

.leader-details{

display:flex;

justify-content:center;

gap:25px;

flex-wrap:wrap;

margin:40px 0;

}

.detail-box{

width:220px;

background:#fff;

padding:25px;

border-radius:18px;

box-shadow:0 8px 20px rgba(0,0,0,.08);

transition:.4s;

}

.detail-box:hover{

background:#003B8E;

color:#fff;

transform:translateY(-10px);

}

.detail-box i{

font-size:34px;

color:#FDB913;

margin-bottom:15px;

}

.detail-box:hover i{

transform:scale(1.2);

}

.profile-btn{

display:inline-block;

padding:16px 40px;

background:#003B8E;

color:#fff;

border-radius:40px;

font-size:18px;

text-decoration:none;

font-weight:600;

transition:.4s;

}

.profile-btn:hover{

background:#FDB913;

color:#003B8E;

transform:scale(1.05);

}

@media(max-width:768px){

.chairman-card{

padding:30px 20px;

}

.chairman-image img{

width:180px;

height:180px;

}

.chairman-info h2{

font-size:28px;

}

.chairman-info h4{

font-size:17px;

}

.chairman-info p{

font-size:15px;

line-height:28px;

}

.detail-box{

width:100%;

}

}

:root{

--primary:#0A4FB5;
--secondary:#FFC107;
--dark:#0b1f4d;
--light:#f7f9fc;
--white:#ffffff;
--text:#444;
--shadow:0 10px 30px rgba(0,0,0,.15);

}

*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

html{

scroll-behavior:smooth;

}

body{

background:#f5f7fb;
color:#333;
overflow-x:hidden;

}

a{

text-decoration:none;

}

ul{

list-style:none;

}

.container{
    width:100%;
    max-width:1280px;
    margin:0 auto;
    padding:0 20px;
    box-sizing:border-box;
}

/*==================================
        TOP HEADER
===================================*/

.topbar{

background:linear-gradient(90deg,#082c6c,#0A4FB5);

color:#fff;

padding:10px 0;

font-size:14px;

}

.topbar .container{

display:flex;

justify-content:space-between;

align-items:center;

}

.topbar .left i{

color:#FFC107;

margin-right:6px;

}

.topbar .right a{

color:#fff;

margin-left:15px;

font-weight:500;

transition:.4s;

}

.topbar .right a:hover{

color:#FFC107;

}

/*==================================
         HEADER
===================================*/

header{

background:#fff;

padding:18px 0;

box-shadow:0 5px 20px rgba(0,0,0,.08);

}

.header{

display:flex;

justify-content:space-between;

align-items:center;

}

.logo img{

width:95px;

transition:.5s;

}

.logo img:hover{

transform:rotate(5deg) scale(1.05);

}

.title{

flex:1;

padding-left:20px;

}

.title h1{

font-size:36px;

font-weight:800;

color:#0A4FB5;

line-height:42px;

}

.title h2{

font-size:22px;

font-weight:600;

color:#082c6c;

margin-top:5px;

}

.title p{

margin-top:8px;

color:#777;

font-size:15px;

letter-spacing:1px;

}

/*==================================
         HEADER BUTTONS
===================================*/

.buttons{

display:flex;

gap:15px;

}

.buttons a{

padding:12px 22px;

border-radius:50px;

font-weight:600;

transition:.4s;

box-shadow:var(--shadow);

}

.login{

background:#0A4FB5;

color:#fff;

}

.login:hover{

background:#082c6c;

transform:translateY(-3px);

}

.mobile{

background:#FFC107;

color:#222;

}

.mobile:hover{

background:#ffb300;

transform:translateY(-3px);

}

/*==================================
          NAVIGATION
===================================*/

nav{

background:#0A4FB5;

position:sticky;

top:0;

z-index:9999;

transition:.4s;

}

nav.sticky{

box-shadow:0 5px 25px rgba(0,0,0,.25);

}

nav ul{

display:flex;

justify-content:center;

align-items:center;

}

nav ul li{

position:relative;

}

nav ul li a{

display:block;

padding:18px 24px;

color:#fff;

font-size:16px;

font-weight:600;

transition:.4s;

}

nav ul li:hover{

background:#082c6c;

}

nav ul li::after{

content:"";

position:absolute;

left:0;

bottom:0;

width:0;

height:3px;

background:#FFC107;

transition:.4s;

}

nav ul li:hover::after{

width:100%;

}

/*==================================
         SWIPER SLIDER
===================================*/

.mySwiper{

width:100%;

height:650px;

overflow:hidden;

}

.swiper-slide{

position:relative;

}

.swiper-slide img{

width:100%;

height:650px;

object-fit:cover;

animation:zoomImage 10s linear infinite;

}

@keyframes zoomImage{

0%{

transform:scale(1);

}

100%{

transform:scale(1.08);

}

}

.caption{

position:absolute;

left:8%;

top:50%;

transform:translateY(-50%);

background:rgba(0,0,0,.45);

padding:40px;

border-left:6px solid #FFC107;

max-width:650px;

border-radius:12px;

animation:slideText 1.2s;

}

@keyframes slideText{

from{

opacity:0;

transform:translate(-60px,-50%);

}

to{

opacity:1;

transform:translate(0,-50%);

}

}

.caption h2{

font-size:50px;

font-weight:700;

color:#fff;

margin-bottom:15px;

}

.caption p{

font-size:22px;

color:#fff;

line-height:34px;

}

.swiper-button-next,
.swiper-button-prev{

color:#fff;

background:rgba(0,0,0,.35);

width:55px;

height:55px;

border-radius:50%;

transition:.4s;

}

.swiper-button-next:hover,
.swiper-button-prev:hover{

background:#FFC107;

color:#222;

}

.swiper-pagination-bullet{

background:#fff;

opacity:.8;

}

.swiper-pagination-bullet-active{

background:#FFC107;

}

/*==================================
      WELCOME SECTION
===================================*/

.welcome{

padding:80px 0;

background:#fff;

text-align:center;

}

.welcome h2{

color:#FFC107;

font-size:24px;

margin-bottom:10px;

}

.welcome h1{

font-size:42px;

color:#0A4FB5;

margin-bottom:20px;

font-weight:700;

}

.welcome p{

max-width:900px;

margin:auto;

font-size:18px;

line-height:34px;

color:#666;

}
/*=====================================================
                OUR SERVICES
======================================================*/

.services{

padding:90px 0;

background:#f8fbff;

}

.services h2{

text-align:center;

font-size:42px;

color:#0A4FB5;

margin-bottom:60px;

font-weight:700;

position:relative;

}

.services h2::after{

content:"";

width:120px;

height:4px;

background:#FFC107;

display:block;

margin:15px auto;

border-radius:5px;

}

.cards{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:30px;

}

.card{

background:#fff;

padding:35px;

border-radius:20px;

text-align:center;

box-shadow:0 12px 35px rgba(0,0,0,.08);

transition:.4s;

position:relative;

overflow:hidden;

}

.card::before{

content:"";

position:absolute;

top:-100%;

left:0;

width:100%;

height:100%;

background:linear-gradient(135deg,#0A4FB5,#082c6c);

transition:.5s;

z-index:0;

}

.card:hover::before{

top:0;

}

.card>*{

position:relative;

z-index:2;

}

.card i{

font-size:55px;

color:#0A4FB5;

margin-bottom:25px;

transition:.4s;

}

.card h3{

font-size:24px;

margin-bottom:15px;

color:#222;

transition:.4s;

}

.card p{

font-size:16px;

line-height:28px;

color:#666;

transition:.4s;

}

.card:hover{

transform:translateY(-12px);

}

.card:hover i,

.card:hover h3,

.card:hover p{

color:#fff;

}


/*=====================================================
             BUSINESS COUNTER
======================================================*/

.counter-section{

padding:90px 0;

background:linear-gradient(rgba(10,79,181,.90),rgba(8,44,108,.90)),

url("../images/counter-bg.jpg");

background-size:cover;

background-position:center;

}

.counter-section .container{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

gap:35px;

}

.counter-box{

background:rgba(255,255,255,.10);

backdrop-filter:blur(10px);

padding:35px;

text-align:center;

border-radius:20px;

border:1px solid rgba(255,255,255,.25);

transition:.4s;

}

.counter-box:hover{

transform:translateY(-10px);

background:rgba(255,255,255,.18);

}

.counter-box i{

font-size:55px;

color:#FFC107;

margin-bottom:20px;

}

.counter-box h2{

font-size:48px;

font-weight:700;

color:#fff;

margin-bottom:10px;

}

.counter-box p{

font-size:18px;

color:#fff;

}


/*=====================================================
           CHAIRMAN MESSAGE
======================================================*/

.chairman{

padding:100px 0;

background:#fff;

}

.chairman .container{

display:grid;

grid-template-columns:350px 1fr;

gap:60px;

align-items:center;

}

.chairman-left img{

width:100%;

border-radius:20px;

box-shadow:0 20px 40px rgba(0,0,0,.20);

transition:.5s;

}

.chairman-left img:hover{

transform:scale(1.04);

}

.chairman-right h2{

font-size:40px;

color:#0A4FB5;

margin-bottom:10px;

}

.chairman-right h3{

font-size:26px;

color:#FFC107;

margin-bottom:20px;

}

.chairman-right p{

font-size:17px;

line-height:34px;

color:#666;

margin-bottom:25px;

}

.readmore{

display:inline-block;

padding:14px 35px;

background:#0A4FB5;

color:#fff;

border-radius:50px;

font-weight:600;

transition:.4s;

}

.readmore:hover{

background:#FFC107;

color:#222;

}


/*=====================================================
            BANKING SERVICES
======================================================*/

.bank-services{

padding:100px 0;

background:#f7f9fc;

}

.section-title{

text-align:center;

font-size:42px;

color:#0A4FB5;

margin-bottom:60px;

}

.service-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:30px;

}

.service-card{

background:#fff;

padding:35px;

text-align:center;

border-radius:18px;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.4s;

}

.service-card:hover{

background:#0A4FB5;

transform:translateY(-8px);

}

.service-card i{

font-size:55px;

color:#FFC107;

margin-bottom:20px;

}

.service-card h3{

font-size:24px;

margin-bottom:15px;

color:#0A4FB5;

transition:.4s;

}

.service-card p{

font-size:16px;

color:#666;

transition:.4s;

}

.service-card:hover h3,

.service-card:hover p{

color:#fff;

}
/*=====================================================
            NOTICE & NEWS SECTION
======================================================*/

.notice{

padding:90px 0;

background:#ffffff;

}

.notice .container{

display:grid;

grid-template-columns:1fr 1fr;

gap:40px;

}

.notice-left,
.notice-right{

background:#fff;

border-radius:20px;

padding:35px;

box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.notice h2{

font-size:34px;

color:#0A4FB5;

margin-bottom:25px;

border-left:6px solid #FFC107;

padding-left:15px;

}

.notice-left ul{

padding-left:20px;

}

.notice-left ul li{

font-size:17px;

line-height:34px;

color:#555;

margin-bottom:10px;

transition:.3s;

}

.notice-left ul li:hover{

color:#0A4FB5;

padding-left:8px;

}

.notice-right marquee{

font-size:17px;

line-height:30px;

color:#444;

}

.notice-right hr{

margin:15px 0;

border:0;

border-top:1px solid #ddd;

}


/*=====================================================
                 DOWNLOADS
======================================================*/

.downloads{

padding:90px 0;

background:#f8fbff;

}

.downloads h2{

text-align:center;

font-size:40px;

color:#0A4FB5;

margin-bottom:50px;

}

.download-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

gap:30px;

}

.download-grid a{

background:#fff;

padding:25px;

border-radius:18px;

text-align:center;

font-size:18px;

font-weight:600;

color:#0A4FB5;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.4s;

display:block;

}

.download-grid a i{

font-size:42px;

display:block;

margin-bottom:15px;

color:#d32f2f;

}

.download-grid a:hover{

background:#0A4FB5;

color:#fff;

transform:translateY(-8px);

}

.download-grid a:hover i{

color:#FFC107;

}


/*=====================================================
               PHOTO GALLERY
======================================================*/

.gallery{

padding:90px 0;

background:#fff;

}

.gallery h2{

text-align:center;

font-size:40px;

color:#0A4FB5;

margin-bottom:50px;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:25px;

}

.gallery-grid img{

width:100%;

height:220px;

object-fit:cover;

border-radius:15px;

cursor:pointer;

transition:.5s;

box-shadow:0 10px 25px rgba(0,0,0,.10);

}

.gallery-grid img:hover{

transform:scale(1.08);

box-shadow:0 18px 40px rgba(0,0,0,.25);

}


/*=====================================================
               BRANCHES
======================================================*/

.branches{

padding:90px 0;

background:linear-gradient(135deg,#0A4FB5,#082c6c);

}

.branches h2{

text-align:center;

font-size:40px;

color:#fff;

margin-bottom:35px;

}

.branch-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(240px,1fr));

gap:30px;

}

.branch{

background:rgba(255,255,255,.12);

backdrop-filter:blur(8px);

padding:35px;

border-radius:18px;

text-align:center;

color:#fff;

transition:.4s;

border:1px solid rgba(255,255,255,.20);

}

.branch:hover{

transform:translateY(-10px);

background:rgba(255,255,255,.22);

}

.branch h3{

font-size:26px;

margin-bottom:12px;

color:#FFC107;

}

.branch p{

font-size:17px;

line-height:28px;

}


/*=====================================================
              SECTION SPACING
======================================================*/

section{

position:relative;

overflow:hidden;

}

section::before{

content:"";

position:absolute;

width:120px;

height:120px;

background:rgba(255,193,7,.08);

border-radius:50%;

top:-30px;

right:-30px;

}

section::after{

content:"";

position:absolute;

width:80px;

height:80px;

background:rgba(10,79,181,.05);

border-radius:50%;

bottom:-20px;

left:-20px;

}
/*=====================================================
                CONTACT SECTION
======================================================*/

.contact-section{
padding:90px 0;
background:#f8fbff;
}

.contact-section .container{
display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
align-items:start;
}

.contact-left h2,
.contact-right h2{
font-size:36px;
color:#0A4FB5;
margin-bottom:25px;
}

.contact-left p{
font-size:17px;
line-height:32px;
margin-bottom:18px;
color:#555;
}

.contact-left i{
color:#FFC107;
margin-right:10px;
width:22px;
}

.contact-right form{
background:#fff;
padding:35px;
border-radius:20px;
box-shadow:0 10px 30px rgba(0,0,0,.10);
}

.contact-right input,
.contact-right textarea{

width:100%;
padding:15px 20px;
margin-bottom:18px;
border:1px solid #ddd;
border-radius:10px;
font-size:16px;
outline:none;
transition:.3s;

}

.contact-right input:focus,
.contact-right textarea:focus{

border-color:#0A4FB5;

box-shadow:0 0 8px rgba(10,79,181,.25);

}

.contact-right button{

background:#0A4FB5;

color:#fff;

padding:15px 40px;

border:none;

border-radius:40px;

font-size:17px;

cursor:pointer;

transition:.4s;

}

.contact-right button:hover{

background:#FFC107;

color:#222;

}

.social{

margin-top:25px;

}

.social a{

display:inline-flex;

justify-content:center;

align-items:center;

width:45px;

height:45px;

margin-right:10px;

background:#0A4FB5;

color:#fff;

border-radius:50%;

transition:.4s;

font-size:18px;

}

.social a:hover{

background:#FFC107;

color:#222;

transform:translateY(-5px);

}


/*=====================================================
                  GOOGLE MAP
======================================================*/

.map iframe{

width:100%;

height:450px;

border:0;

display:block;

}


/*=====================================================
                    FOOTER
======================================================*/

footer{

background:#082c6c;

color:#fff;

padding-top:70px;

}

.footer-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

gap:40px;

padding-bottom:40px;

}

.footer-logo{

width:90px;

margin-bottom:20px;

}

footer h3{

color:#FFC107;

margin-bottom:18px;

font-size:24px;

}

footer p,
footer li{

line-height:30px;

color:#ddd;

font-size:16px;

}

footer ul{

padding:0;

}

footer ul li{

list-style:none;

margin-bottom:10px;

}

footer ul li a{

color:#ddd;

transition:.3s;

}

footer ul li a:hover{

color:#FFC107;

padding-left:6px;

}

.copyright{

text-align:center;

padding:18px;

background:#06183c;

font-size:15px;

color:#ccc;

}


/*=====================================================
                WHATSAPP BUTTON
======================================================*/

.whatsapp{

position:fixed;

right:25px;

bottom:25px;

width:60px;

height:60px;

background:#25D366;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

color:#fff;

font-size:32px;

box-shadow:0 10px 25px rgba(0,0,0,.25);

z-index:99999;

transition:.4s;

}

.whatsapp:hover{

transform:scale(1.15);

}


/*=====================================================
             SCROLL TO TOP BUTTON
======================================================*/

#topBtn{

position:fixed;

bottom:100px;

right:28px;

width:50px;

height:50px;

border:none;

border-radius:50%;

background:#FFC107;

color:#222;

font-size:20px;

cursor:pointer;

display:none;

box-shadow:0 10px 25px rgba(0,0,0,.25);

transition:.4s;

z-index:99999;

}

#topBtn:hover{

background:#0A4FB5;

color:#fff;

}


/*=====================================================
                  RESPONSIVE
======================================================*/

@media(max-width:992px){

.header{

flex-direction:column;

text-align:center;

gap:20px;

}

.title{

padding-left:0;

}

.contact-section .container,
.notice .container,
.chairman .container{

grid-template-columns:1fr;

}

nav ul{

flex-wrap:wrap;

}

nav ul li a{

padding:15px;

font-size:15px;

}

.mySwiper{

height:450px;

}

.swiper-slide img{

height:450px;

}

.caption{

max-width:90%;

padding:25px;

}

.caption h2{

font-size:34px;

}

.caption p{

font-size:18px;

}

}

@media(max-width:768px){

.topbar .container{

flex-direction:column;

gap:10px;

text-align:center;

}

.title h1{

font-size:26px;

}

.title h2{

font-size:18px;

}

.buttons{

flex-direction:column;

width:100%;

}

.buttons a{

width:100%;

text-align:center;

}

.mySwiper{

height:320px;

}

.swiper-slide img{

height:320px;

}

.caption{

padding:20px;

}

.caption h2{

font-size:24px;

}

.caption p{

font-size:15px;

line-height:24px;

}

.welcome h1,
.services h2,
.section-title,
.gallery h2,
.downloads h2,
.notice h2,
.branches h2{

font-size:30px;

}

.cards,
.service-grid,
.download-grid,
.gallery-grid,
.branch-grid{

grid-template-columns:1fr;

}

.footer-grid{

grid-template-columns:1fr;

text-align:center;

}

.social{

text-align:center;

}

.whatsapp{

width:55px;

height:55px;

font-size:28px;

}

}

@media(max-width:480px){

.container{

width:95%;

}

.title h1{

font-size:22px;

line-height:30px;

}

.title h2{

font-size:16px;

}

.contact-right form{

padding:20px;

}

.counter-box h2{

font-size:34px;

}

}

/*==========================================
        PREMIUM PAGE BANNER - 2026
==========================================*/

.page-banner{

    position: relative;
    width: 100%;
    height: 380px;

    background:
    linear-gradient(
    135deg,
    rgba(140,15,77,.92),
    rgba(177,20,104,.88),
    rgba(0,0,0,.55)
    ),
    url("images/banner.jpg") center center/cover no-repeat;

    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;

    overflow:hidden;
}

/* Decorative Glow */

.page-banner::before{

    content:"";

    position:absolute;

    width:550px;
    height:550px;

    background:rgba(253,185,19,.12);

    border-radius:50%;

    top:-220px;
    right:-180px;

    filter:blur(80px);

}

/* Second Glow */

.page-banner::after{

    content:"";

    position:absolute;

    width:400px;
    height:400px;

    background:rgba(255,255,255,.05);

    border-radius:50%;

    bottom:-180px;
    left:-120px;

    filter:blur(80px);

}

.page-banner .overlay{

    position:relative;
    z-index:2;
}

.page-banner h1{

    color:#fff;
    font-size:58px;
    font-weight:700;
    letter-spacing:1px;
    margin-bottom:15px;
    text-shadow:0 10px 25px rgba(0,0,0,.35);

}

.page-banner p{

    color:#fff;
    font-size:18px;
    opacity:.95;

}

.page-banner p a{

    color:#FDB913;
    text-decoration:none;
    font-weight:600;

}

.page-banner p a:hover{

    color:#fff;

}

/* Optional Bottom Wave */

.page-banner svg{

    position:absolute;
    bottom:0;
    left:0;
    width:100%;

}

/* Animation */

.page-banner h1{

    animation:fadeUp 1s ease;

}

.page-banner p{

    animation:fadeUp 1.4s ease;

}

@keyframes fadeUp{

    from{

        opacity:0;
        transform:translateY(40px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}

/* Responsive */

@media(max-width:768px){

.page-banner{

height:250px;

}

.page-banner h1{

font-size:36px;

}

.page-banner p{

font-size:15px;

}

}

}

.page-banner h1{

font-size:50px;

font-weight:700;

margin-bottom:15px;

}

.page-banner p{

font-size:18px;

}

.chairman-section{

padding:80px 0;

background:#fff;

}

.chairman-section .container{

display:grid;

grid-template-columns:350px 1fr;

gap:50px;

align-items:center;

}

.chairman-image img{

width:100%;

border-radius:20px;

box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.chairman-content h2{

color:#003399;

font-size:38px;

}

.chairman-content h3{

margin-top:15px;

font-size:30px;

color:#f4a300;

}

.chairman-content h4{

margin-bottom:20px;

font-size:20px;

color:#555;

}

.chairman-content p{

line-height:32px;

font-size:17px;

text-align:justify;

}

.management-body{

padding:80px 0;

background:#f8f9fb;

}

.management-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

gap:30px;

margin-top:40px;

}

.member-card{

background:#fff;

padding:25px;

text-align:center;

border-radius:15px;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.4s;

}

.member-card:hover{

transform:translateY(-10px);

}

.member-card img{

width:150px;

height:150px;

border-radius:50%;

object-fit:cover;

margin-bottom:20px;

border:6px solid #003399;

}

.member-card h3{

color:#003399;

font-size:22px;

}

.member-card p{

color:#777;

font-weight:600;

margin-top:10px;

}

.values-section{

padding:80px 0;

background:#fff;

}

.value-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

margin-top:40px;

}

.value-box{

background:#003399;

color:#fff;

padding:35px;

text-align:center;

border-radius:15px;

transition:.4s;

}

.value-box:hover{

background:#f4a300;

color:#222;

transform:translateY(-10px);

}

.value-box i{

font-size:55px;

margin-bottom:20px;

}

.value-box h3{

margin-bottom:15px;

}

@media(max-width:768px){

.chairman-section .container{

grid-template-columns:1fr;

}

.value-grid{

grid-template-columns:1fr;

}

}

.home-float{

position:fixed;

top:100px;

left:20px;

width:60px;
height:60px;

background:linear-gradient(135deg,#003399,#0056d6);

color:#fff;

border-radius:50%;

display:flex;

justify-content:center;
align-items:center;

font-size:24px;

text-decoration:none;

box-shadow:0 10px 30px rgba(0,0,0,.30);

transition:.4s;

z-index:99999;

}

.home-float:hover{

background:#FDB913;

color:#003399;

transform:scale(1.12) rotate(360deg);

}
.director-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:30px;

margin-top:40px;

}

.director-card{

background:#fff;

border-radius:20px;

padding:25px;

text-align:center;

box-shadow:0 10px 30px rgba(0,0,0,.10);

transition:.4s;

}

.director-card:hover{

transform:translateY(-10px);

}

.director-card img{

width:170px;

height:170px;

border-radius:50%;

object-fit:cover;

border:5px solid #FDB913;

margin-bottom:20px;

}

.director-card h3{

color:#003399;

font-size:22px;

margin-bottom:10px;

}

.director-card p{

font-weight:bold;

color:#777;

}

.leader-card{
    max-width:1100px;
    margin:60px auto;
    background:#fff;
    border-radius:25px;
    padding:40px;
    display:flex;
    align-items:center;
    gap:40px;
    box-shadow:0 15px 40px rgba(0,0,0,.12);
    transition:.4s;
}

.leader-card:hover{
    transform:translateY(-8px);
}

.leader-image{
    flex:0 0 300px;
    text-align:center;
}

.leader-image img{
    width:260px;
    height:260px;
    border-radius:50%;
    object-fit:cover;
    border:8px solid #FDB913;
    box-shadow:0 10px 30px rgba(0,0,0,.2);
}

.leader-info{
    flex:1;
}

.designation{
    display:inline-block;
    background:linear-gradient(135deg,#FDB913,#ffcf40);
    color:#003B8E;
    padding:8px 18px;
    border-radius:30px;
    font-weight:700;
    margin-bottom:15px;
}

.designation i{
    margin-right:8px;
}

.leader-info h2{
    color:#003B8E;
    font-size:34px;
    margin-bottom:8px;
}

.leader-info h4{
    color:#666;
    margin-bottom:20px;
    font-weight:500;
}

.leader-info p{
    line-height:30px;
    color:#555;
    text-align:justify;
}

.leader-details{
    display:flex;
    gap:15px;
    flex-wrap:wrap;
    margin:30px 0;
}

.detail-box{
    background:#f5f8ff;
    padding:12px 18px;
    border-radius:10px;
    font-weight:600;
    color:#003B8E;
}

.detail-box i{
    color:#FDB913;
    margin-right:8px;
}

.profile-btn{
    display:inline-block;
    background:#003B8E;
    color:#fff;
    padding:14px 28px;
    border-radius:40px;
    text-decoration:none;
    transition:.3s;
}

.profile-btn:hover{
    background:#FDB913;
    color:#003B8E;
}

@media(max-width:768px){

.leader-card{
    flex-direction:column;
    text-align:center;
}

.leader-info p{
    text-align:center;
}

.leader-details{
    justify-content:center;
}

}

.branch-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:25px;

margin-top:40px;

}

.branch-card{

background:#fff;

border-radius:15px;

overflow:hidden;

box-shadow:0 8px 25px rgba(0,0,0,.12);

transition:.3s;

}

.branch-card:hover{

transform:translateY(-5px);

}

.branch-header{

background:#003399;

color:#fff;

padding:18px 20px;

cursor:pointer;

display:flex;

justify-content:space-between;

align-items:center;

font-size:20px;

font-weight:bold;

}

.branch-header span{

font-size:28px;

transition:.3s;

}

.branch-content{

 max-height:0;

    overflow:hidden;

    transition:max-height .5s ease;

}

.branch-content ul{

list-style:none;

padding:15px 20px;

margin:0;

}

.branch-content li{

padding:10px 0;

border-bottom:1px solid #ddd;

}

.branch-card.active .branch-content{

max-height:300px;

}

.branch-card.active .branch-header span{

transform:rotate(45deg);

}

.service-card{

background:#fff;

border-radius:20px;

padding:30px;

box-shadow:0 15px 35px rgba(0,0,0,.08);

transition:.4s;

overflow:hidden;

}

.service-card:hover{

transform:translateY(-10px);

}

.service-header{

text-align:center;

}

.service-header i{

font-size:55px;

color:#FDB913;

margin-bottom:20px;

}

.service-header h3{

color:#003B8E;

font-size:28px;

}

.view-btn{

margin-top:20px;

background:#003B8E;

color:#fff;

padding:12px 30px;

border:none;

border-radius:40px;

cursor:pointer;

}

.service-details{

display:none;

margin-top:30px;

border-top:1px solid #ddd;

padding-top:25px;

animation:fade .4s;

}

.service-details ul{

padding-left:20px;

line-height:35px;

}

@keyframes fade{

from{

opacity:0;

transform:translateY(20px);

}

to{

opacity:1;

transform:translateY(0);

}
}

/*=================================
OFFICE LOGIN
=================================*/

.login-section{

padding:80px 0;

background:#f4f7fc;

}

.login-box{

width:420px;

margin:auto;

background:#fff;

padding:45px;

border-radius:20px;

box-shadow:0 20px 45px rgba(0,0,0,.12);

text-align:center;

}

.login-icon{

font-size:60px;

color:#003B8E;

margin-bottom:20px;

}

.login-box h2{

color:#003B8E;

margin-bottom:10px;

}

.input-group{

position:relative;

margin-bottom:20px;

}

.input-group input{

width:100%;

padding:15px 45px;

border:1px solid #ddd;

border-radius:50px;

font-size:16px;

}

.input-group i:first-child{

position:absolute;

left:18px;

top:17px;

color:#003B8E;

}

.toggle-password{

position:absolute;

right:18px;

top:17px;

cursor:pointer;

color:#888;

}

.login-btn{

width:100%;

padding:15px;

background:#003B8E;

color:#fff;

border:none;

border-radius:50px;

font-size:17px;

font-weight:bold;

cursor:pointer;

transition:.4s;

}

.login-btn:hover{

background:#FDB913;

color:#003B8E;

}

.error{

background:#ffe0e0;

color:red;

padding:10px;

margin-bottom:20px;

border-radius:8px;

}
/*==========================================
        OFFICE DASHBOARD
==========================================*/

.dashboard-section{
    padding:80px 0;
    background:#f5f8fc;
}

.dashboard-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:40px;
}

.dashboard-heading{
    color:#003B8E;
    margin:40px 0 25px;
    border-left:6px solid #FDB913;
    padding-left:15px;
}

.dashboard-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:25px;
}

.dashboard-card{

    background:#fff;

    border-radius:18px;

    padding:35px;

    text-align:center;

    box-shadow:0 15px 40px rgba(0,0,0,.08);

    transition:.4s;

}

.dashboard-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 45px rgba(0,59,142,.18);

}

.dashboard-card i{

    font-size:55px;

    color:#FDB913;

    margin-bottom:20px;

}

.dashboard-card h4{

    color:#003B8E;

    margin-bottom:20px;

}

.dashboard-card a{

    display:inline-block;

    padding:12px 25px;

    background:#003B8E;

    color:#fff;

    text-decoration:none;

    border-radius:40px;

    font-weight:600;

    transition:.3s;

}

.dashboard-card a:hover{

    background:#FDB913;

    color:#003B8E;

}

.logout-btn{

    background:#dc3545;

    color:#fff;

    padding:12px 25px;

    text-decoration:none;

    border-radius:40px;

    font-weight:bold;

}

.logout-btn:hover{

    background:#b02a37;

}

@media(max-width:768px){

.dashboard-top{

flex-direction:column;

gap:20px;

}

}

/*=========================
OFFICE REGISTER
==========================*/

.register-section{

padding:80px 0;

background:#f7f9fd;

}

.register-box{

width:520px;

margin:auto;

background:#fff;

padding:40px;

border-radius:20px;

box-shadow:0 20px 45px rgba(0,0,0,.12);

text-align:center;

}

.register-icon{

font-size:60px;

color:#003B8E;

margin-bottom:20px;

}

.register-box h2{

color:#003B8E;

margin-bottom:10px;

}

.form-row{

margin-bottom:18px;

}

.form-row input{

width:100%;

padding:15px;

border-radius:40px;

border:1px solid #ddd;

font-size:16px;

}

.register-btn{

width:100%;

padding:15px;

background:#003B8E;

color:#fff;

border:none;

border-radius:40px;

font-size:17px;

font-weight:bold;

cursor:pointer;

transition:.3s;

}

.register-btn:hover{

background:#FDB913;

color:#003B8E;

}

@media(max-width:600px){

.register-box{

width:95%;

padding:25px;

}

}

.downloads-page{
padding:80px 0;
background:#f4f8fc;
}

.download-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
margin-top:40px;
}

.download-card{

background:#fff;

padding:35px;

text-align:center;

border-radius:20px;

box-shadow:0 10px 30px rgba(0,0,0,.08);

transition:.4s;

}

.download-card:hover{

transform:translateY(-10px);

}

.download-card i{

font-size:60px;

color:#d62828;

margin-bottom:20px;

}

.download-card h3{

margin-bottom:20px;

color:#003B8E;

}

.download-card a{

display:inline-block;

padding:12px 30px;

background:#003B8E;

color:#fff;

text-decoration:none;

border-radius:40px;

font-weight:600;

transition:.3s;

}

.download-card a:hover{

background:#FDB913;

color:#003B8E;

}

.download-buttons{

text-align:center;

margin-top:50px;

}

.download-buttons a{

display:inline-block;

margin:10px;

padding:15px 35px;

border-radius:50px;

text-decoration:none;

font-weight:bold;

}

.login-btn{

background:#003B8E;

color:#fff;

}

.login-btn:hover{

background:#FDB913;

color:#003B8E;

}

.register-btn{

background:#28a745;

color:#fff;

}

.register-btn:hover{

background:#1d7f33;

}

.error-box{

background:#ffe6e6;

color:#d10000;

padding:12px;

border-radius:8px;

margin-bottom:20px;

font-weight:600;

}

.login-btn{

width:100%;

padding:15px;

background:linear-gradient(135deg,#003B8E,#0057D8);

border:none;

border-radius:50px;

color:#fff;

font-size:17px;

font-weight:bold;

cursor:pointer;

transition:.3s;

}

.login-btn:hover{

background:linear-gradient(135deg,#FDB913,#ffdb70);

color:#003B8E;

transform:translateY(-3px);

}

.group-intro{

padding:80px 0;

text-align:center;

background:#f8fbff;

}

.group-intro h2{

font-size:42px;

color:#003B8E;

margin-bottom:20px;

}

.group-intro p{

max-width:950px;

margin:auto;

line-height:32px;

font-size:18px;

}

.company-box{

padding:80px 0;

}

.company-box.light{

background:#f7f9fc;

}

.company-box .container{

display:grid;

grid-template-columns:1fr 1fr;

gap:50px;

align-items:center;

}

.company-image img{

width:100%;

border-radius:20px;

box-shadow:0 15px 40px rgba(0,0,0,.15);

transition:.5s;

}

.company-image img:hover{

transform:scale(1.03);

}

.company-content h2{

font-size:34px;

color:#003B8E;

margin-bottom:10px;

}

.company-content h4{

color:#FDB913;

margin-bottom:20px;

}

.company-content p{

line-height:30px;

margin-bottom:18px;

text-align:justify;

}

/*================ CHAIRMAN CARD =================*/

.leader-card.chairman{
    background:#fff;
    border-radius:25px;
    padding:40px;
    text-align:center;
    box-shadow:0 15px 40px rgba(0,0,0,.10);
    border:1px solid #eee;
    transition:all .4s ease;
}

.leader-card.chairman:hover{
    transform:translateY(-10px);
    box-shadow:0 25px 60px rgba(0,59,142,.18);
}

.leader-card.chairman .leader-image img{
    width:220px;
    height:220px;
    border-radius:50%;
    object-fit:cover;
    border:8px solid #FDB913;
    transition:.4s;
}

.leader-card.chairman:hover .leader-image img{
    transform:scale(1.08);
}

.group-achievement{

padding:80px 0;

background:linear-gradient(135deg,#003B8E,#0054c7);

color:#fff;

text-align:center;

}

.achievement-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

margin-top:40px;

}

.achievement-grid h1{

font-size:60px;

color:#FDB913;

}

.achievement-grid p{

font-size:18px;

}

@media(max-width:768px){

.company-box .container{

grid-template-columns:1fr;

}

.achievement-grid{

grid-template-columns:repeat(2,1fr);

}

}

.breaking-news{
background:#003B8E;
color:#fff;
padding:15px 0;
}

.breaking-title{
font-size:20px;
font-weight:700;
margin-bottom:10px;
color:#FDB913;
}

.featured-news{
padding:80px 0;
background:#f8fbff;
}

.news-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
}

.news-card{
background:#fff;
border-radius:18px;
overflow:hidden;
box-shadow:0 15px 40px rgba(0,0,0,.12);
transition:.4s;
}

.news-card:hover{
transform:translateY(-10px);
}

.news-card img{
width:100%;
height:240px;
object-fit:cover;
}

.news-content{
padding:25px;
}

.news-date{
color:#FDB913;
font-weight:600;
}

.news-content h3{
margin:15px 0;
color:#003B8E;
}

.read-btn{
display:inline-block;
margin-top:15px;
padding:10px 25px;
background:#003B8E;
color:#fff;
border-radius:30px;
text-decoration:none;
}

.events-timeline{
padding:80px 0;
}

.timeline-item{
display:flex;
margin-bottom:40px;
align-items:flex-start;
}

.timeline-icon{
width:70px;
height:70px;
background:#003B8E;
color:#fff;
display:flex;
justify-content:center;
align-items:center;
border-radius:50%;
font-size:28px;
margin-right:25px;
}

.timeline-content{
background:#fff;
padding:25px;
border-left:5px solid #FDB913;
box-shadow:0 8px 25px rgba(0,0,0,.08);
width:100%;
}

.timeline-content span{
color:#888;
font-size:14px;
}

.announcement-section{
padding:80px 0;
background:#f7f9fc;
}

.announcement-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
}

.announcement-card{
background:#fff;
padding:40px;
text-align:center;
border-radius:20px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
transition:.3s;
}

.announcement-card:hover{
transform:translateY(-8px);
}

.announcement-card i{
font-size:45px;
color:#003B8E;
margin-bottom:20px;
}

@media(max-width:768px){

.news-grid,
.announcement-grid{
grid-template-columns:1fr;
}

.timeline-item{
flex-direction:column;
}

.timeline-icon{
margin-bottom:20px;
}

}



/* Chairman Card */

.leader-card.chairman{
    background:#ffffff;
    border-radius:25px;
    padding:50px;
    box-shadow:0 15px 40px rgba(0,0,0,0.10);
    transition:all .4s ease;
    border:1px solid #e9ecef;
}

/* Hover Effect */

.leader-card.chairman:hover{
    transform:translateY(-10px);
    box-shadow:0 25px 60px rgba(0,59,142,0.18);
}

/* Chairman Image Animation */

.leader-card.chairman .leader-image img{
    transition:.4s ease;
}

.leader-card.chairman:hover .leader-image img{
    transform:scale(1.08);
}

/* Button Hover */

.leader-card.chairman .profile-btn{
    transition:.3s;
}

.leader-card.chairman:hover .profile-btn{
    background:#FDB913;
    color:#003B8E;
}

.chairman-hero{

padding:100px 0;

background:linear-gradient(135deg,#042b67,#003b8e,#0b5ed7);

color:#fff;

}

.hero-image{

position:relative;

width:360px;
height:360px;

margin:auto;

border-radius:50%;

padding:10px;

background:linear-gradient(135deg,#FFD700,#FDB913,#FFB000,#FFD700);

box-shadow:
0 15px 40px rgba(0,0,0,.18),
0 0 30px rgba(253,185,19,.35);

transition:.5s ease;

overflow:visible;

}

/* White Frame */

.hero-image::before{

content:"";

position:absolute;

top:10px;
left:10px;
right:10px;
bottom:10px;

background:#fff;

border-radius:50%;

z-index:0;

}

/* Chairman Image */

.hero-image img{

position:relative;

z-index:2;

width:100%;
height:100%;

object-fit:cover;

border-radius:50%;

transition:.5s;

}

/* Golden Ring */

.hero-image::after{

content:"";

position:absolute;

top:-12px;
left:-12px;

width:calc(100% + 24px);
height:calc(100% + 24px);

border:2px dashed rgba(253,185,19,.8);

border-radius:50%;

animation:rotateRing 18s linear infinite;

}

/* Hover */

.hero-image:hover{

transform:translateY(-12px) scale(1.03);

box-shadow:

0 25px 60px rgba(0,0,0,.22),

0 0 40px rgba(253,185,19,.55);

}

.hero-image:hover img{

transform:scale(1.08);

}

/* Floating Animation */

@keyframes floatImage{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0px);

}

}

/* Ring Rotation */

@keyframes rotateRing{

from{

transform:rotate(0deg);

}

to{

transform:rotate(360deg);

}

}

.hero-image{

animation:floatImage 5s ease-in-out infinite;

}

/* Mobile */

@media(max-width:768px){

.hero-image{

width:160px;
height:160px;
align-content: ;

}

}

.profile-card{

background:#fff;

border-radius:20px;

box-shadow:0 15px 45px rgba(0,0,0,.12);

padding:35px;

transition:.4s;

}

.profile-card:hover{

transform:translateY(-10px);

box-shadow:0 25px 60px rgba(0,0,0,.18);

}

.info-card{

background:rgba(255,255,255,.9);

backdrop-filter:blur(15px);

border-radius:20px;

padding:30px;

transition:.4s;

}

.info-card:hover{

background:#003b8e;

color:#fff;

transform:translateY(-8px);

}

.timeline-item{

border-left:5px solid #FDB913;

padding-left:30px;

margin-bottom:35px;

position:relative;

}

.timeline-item::before{

content:"";

width:18px;

height:18px;

background:#FDB913;

border-radius:50%;

position:absolute;

left:-11px;

top:5px;

}

/*================ GALLERY PAGE =================*/

.gallery-page{

padding:80px 0;

background:#f7f9fc;

}

.section-heading{

text-align:center;

margin-bottom:50px;

}

.section-heading span{

color:#FDB913;

font-weight:600;

letter-spacing:2px;

text-transform:uppercase;

}

.section-heading h2{

font-size:42px;

color:#003B8E;

margin:15px 0;

}

.section-heading p{

max-width:800px;

margin:auto;

color:#666;

line-height:30px;

}

.gallery-menu{

display:flex;

justify-content:center;

flex-wrap:wrap;

gap:15px;

margin-bottom:50px;

}

.gallery-menu button{

padding:12px 30px;

border:none;

border-radius:50px;

background:#fff;

color:#003B8E;

font-weight:600;

cursor:pointer;

transition:.4s;

box-shadow:0 8px 20px rgba(0,0,0,.08);

}

.gallery-menu button:hover,

.gallery-menu .active{

background:#003B8E;

color:#fff;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(320px,1fr));

gap:30px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:18px;

background:#fff;

box-shadow:0 15px 40px rgba(0,0,0,.10);

transition:.4s;

}

.gallery-item img{

width:100%;

height:280px;

object-fit:cover;

transition:.6s;

display:block;

}

.gallery-overlay{

position:absolute;

left:0;

top:0;

width:100%;

height:100%;

background:linear-gradient(to top,rgba(0,59,142,.92),rgba(0,0,0,.15));

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

opacity:0;

transition:.4s;

color:#fff;

}

.gallery-overlay i{

font-size:40px;

margin-bottom:15px;

}

.gallery-overlay h4{

font-size:24px;

font-weight:600;

}

.gallery-item:hover img{

transform:scale(1.12);

}

.gallery-item:hover{

transform:translateY(-12px);

}

.gallery-item:hover .gallery-overlay{

opacity:1;

}

/*==========================
 Chairman Header
==========================*/

.chairman-header{

text-align:center;

padding:60px 20px;

}

/*==========================
 Chairman Photo
==========================*/

.chairman-photo{

display:flex;

justify-content:center;

align-items:center;

margin:0 auto 25px;

width:260px;

height:260px;

}

.chairman-photo img{

width:250px;

height:250px;

border-radius:50%;

object-fit:cover;

border:8px solid #FDB913;

background:#fff;

padding:6px;

box-shadow:0 15px 40px rgba(0,0,0,.18);

transition:0.4s ease;

}

/* Hover Effect */

.chairman-photo img:hover{

transform:scale(1.06);

box-shadow:0 20px 50px rgba(253,185,19,.45);

}

/* Chairman Badge */

.chairman-badge{

display:inline-block;

background:#FDB913;

color:#003B8E;

padding:10px 30px;

border-radius:50px;

font-size:16px;

font-weight:600;

margin-bottom:20px;

box-shadow:0 8px 20px rgba(253,185,19,.30);

}

.chairman-badge i{

margin-right:8px;

}

/* Name */

.chairman-header h1{

font-size:42px;

font-weight:700;

color:#003B8E;

margin:15px 0 10px;

}

/* Designation */

.chairman-header h3{

font-size:22px;

font-weight:500;

color:#666;

line-height:34px;

}

/* Responsive */

@media(max-width:768px){

.chairman-photo{

width:210px;

height:210px;

}

.chairman-photo img{

width:200px;

height:200px;

}

.chairman-header h1{

font-size:30px;

}

.chairman-header h3{

font-size:18px;

line-height:28px;

}

}

/* internet Banking page */

/*=========================
 INTERNET BANKING
=========================*/

.internet-banking{

padding:80px 0;

background:#f7f9fc;

}

.banking-card{

max-width:850px;

margin:auto;

background:#fff;

padding:60px;

border-radius:20px;

text-align:center;

box-shadow:0 15px 40px rgba(0,0,0,.08);

transition:.4s;

}

.banking-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.bank-icon{

width:120px;

height:120px;

margin:auto;

border-radius:50%;

background:#003B8E;

display:flex;

justify-content:center;

align-items:center;

color:#fff;

font-size:55px;

margin-bottom:30px;

box-shadow:0 10px 30px rgba(0,59,142,.25);

}

.banking-card h2{

font-size:40px;

color:#003B8E;

margin-bottom:10px;

}

.banking-card h3{

color:#d32f2f;

font-size:28px;

margin-bottom:25px;

}

.banking-card p{

font-size:17px;

line-height:30px;

color:#555;

margin-bottom:20px;

}

.notice-box{

background:#FFF8E1;

border-left:5px solid #FDB913;

padding:20px;

border-radius:10px;

text-align:left;

margin:35px 0;

font-size:16px;

}

.notice-box i{

color:#FDB913;

margin-right:10px;

}

.mobile-banking-box{

background:#f5f8ff;

padding:35px;

border-radius:15px;

margin-top:30px;

}

.mobile-banking-box i.fa-mobile-screen-button{

font-size:60px;

color:#003B8E;

margin-bottom:15px;

}

.mobile-banking-box h3{

color:#003B8E;

margin-bottom:15px;

}

.mobile-banking-box ul{

list-style:none;

padding:0;

margin:25px 0;

}

.mobile-banking-box ul li{

padding:8px 0;

font-size:17px;

}

.mobile-banking-box ul li i{

color:#28a745;

margin-right:10px;

}

.download-btn{

display:inline-block;

padding:15px 35px;

background:#28a745;

color:#fff;

text-decoration:none;

border-radius:50px;

font-weight:600;

font-size:17px;

transition:.3s;

}

.download-btn:hover{

background:#1f8d38;

transform:translateY(-3px);

}

@media(max-width:768px){

.banking-card{

padding:35px 20px;

}

.banking-card h2{

font-size:30px;

}

.bank-icon{

width:90px;

height:90px;

font-size:40px;

}

}

.about-intro,
.achievement-section,
.services-section,
.loan-section,
.security-section,
.why-section,
.vision-section,
.saving-section{
padding:80px 0;
}

.about-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:center;
}

.about-image img{
width:100%;
border-radius:20px;
box-shadow:0 25px 50px rgba(0,0,0,.15);
}

.about-tag{
background:#8a0d48;
color:#fff;
padding:8px 20px;
border-radius:30px;
display:inline-block;
margin-bottom:15px;
}

.section-title{
text-align:center;
font-size:38px;
margin-bottom:50px;
color:#8a0d48;
font-weight:700;
}

.achievement-grid,
.service-grid,
.info-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:30px;
}

.achievement-box,
.service-card,
.info-card{
background:#fff;
padding:35px;
border-radius:18px;
box-shadow:0 10px 35px rgba(0,0,0,.08);
transition:.35s;
text-align:center;
}

.achievement-box:hover,
.service-card:hover,
.info-card:hover{
transform:translateY(-10px);
}

.achievement-box h1{
font-size:48px;
color:#8a0d48;
margin-bottom:10px;
}

.service-card i{
font-size:45px;
color:#8a0d48;
margin-bottom:20px;
}

.bg-light{
background:#f8f8fc;
}

.saving-box,
.vision-box{
background:linear-gradient(135deg,#8a0d48,#d81b60);
padding:60px;
color:#fff;
border-radius:20px;
text-align:center;
box-shadow:0 20px 40px rgba(0,0,0,.15);
}

.saving-box h2,
.vision-box h2{
font-size:38px;
margin-bottom:20px;
}

@media(max-width:991px){

.about-grid{
grid-template-columns:1fr;
}

.section-title{
font-size:30px;
}

}