@import "https://stanleymedicalcollege.ac.in/assets/css/font-awesome.min.css";

body{
    margin:0;
    padding:0;
    font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif !important;
    box-sizing:border-box;
    line-height: 1.7!important;
    font-size: 16px!important;
}
ul{
    margin:0;
    padding:0;
    list-style:none
}
a:focus, a:hover {
    color: unset!important;
    text-decoration: none !important;
}
.top-strip{
    background:#06154a;
    padding:5px 20px 0 0;
    display:flex;
    justify-content:right;
    align-items:center;
    flex-wrap:wrap;
    gap:15px;
    position:relative;
    z-index:100
}
#google_translate_element{
    z-index:9999;
    position:relative
}
#google_translate_element .goog-te-gadget{
    font-family:inherit!important
}
#google_translate_element select{
    padding:5px 10px;
    border-radius:4px;
    border:none;
    font-size:14px;
    cursor:pointer
}
.goog-te-banner-frame,.goog-te-menu-frame{
    z-index:99999!important
}
.skiptranslate{
    z-index:9999!important;
    position:relative
}
body>.skiptranslate>.goog-te-gadget{
    z-index:9999!important
}
.nav-menu a{
    text-decoration:none;
    color:#fff
}
.nav-menu a:hover{
    text-decoration:none;
    color:#ffe205
}
.top-links{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:20px;
    color:#fff;
    font-size:14px
}
.btn{
    background:orange;
    padding:5px 10px;
    border-radius:5px;
    cursor:pointer
}
.btn.alt{
    background:#f4a261
}
.logo-section{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:15px 20px;
    background:#fff
}
.logo-section img{
    max-width:100%;
    width:90%;
    height:auto;
    object-fit:contain;
    transition:transform .3s ease,opacity .3s ease
}
.logo-section a:hover img{
    transform:scale(1.03);
    opacity:.9
}
.logo-text h2{
    margin:5px 0;
    font-size:22px
}
.logo-text p{
    margin:0;
    color:#2f6f3e;
    font-weight:600
}
.mobile-menu-toggle{
    display:none
}
@media(max-width:992px){
    .logo-section{
        justify-content:space-between;
        padding:12px 15px
    }
    .logo-section img{
        width:70%
    }
    .mobile-menu-toggle{
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        gap:5px;
        width:40px;
        height:40px;
        cursor:pointer;
        padding:5px;
        border-radius:5px;
        background:transparent;
        transition:background .3s ease
    }
    .mobile-menu-toggle:hover{
        background:#0000000d
    }
    .mobile-menu-toggle span{
        width:26px;
        height:3px;
        background:#2d6f3f;
        border-radius:2px;
        transition:all .3s ease
    }
}
@media(max-width:576px){
    .logo-section{
        padding:10px 12px
    }
    .logo-section img{
        width:80%
    }
    .mobile-menu-toggle{
        width:36px;
        height:36px
    }
    .mobile-menu-toggle span{
        width:22px;
        height:2.5px
    }
}
@media(max-width:400px){
    .logo-section img{
        width:95%
    }
}
.slider{
    position:relative;
    width:100%;
    margin:auto;
    overflow:hidden
}
.slider-image{
    width:100%;
    height:100%;
    object-fit:cover;
    animation:fade .6s ease-in-out
}
@keyframes fade{
    0%{
        opacity:.6;
        transform:scale(1.03)
    }
    to{
        opacity:1;
        transform:scale(1)
    }
}
.slider-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    background:#0000008c;
    color:#fff;
    border:none;
    font-size:28px;
    width:48px;
    height:48px;
    border-radius:50%;
    cursor:pointer;
    transition:all .3s ease
}
.slider-arrow:hover{
    background:#ffb703;
    color:#000
}
.slider-arrow.left{
    left:18px
}
.slider-arrow.right{
    right:18px
}
@media(max-width:768px){
    .slider{
        height:auto
    }
    .slider-arrow{
        width:40px;
        height:40px;
        font-size:22px
    }
}
.about-section{
    background:#f3f7fd;
    padding:20px
}
.about-container{
    max-width:1200px;
    margin:auto;
    display:flex;
    align-items:center;
    gap:40px
}
.about-image img{
    width:100%;
    max-width:450px;
    border-radius:18px;
    transition:transform .6s ease,box-shadow .6s ease
}
.about-image img:hover{
    transform:scale(1.05);
    box-shadow:0 20px 40px #00000026
}
.about-content{
    flex:1;
    animation:fadeUp 1s ease forwards
}
.about-tag{
    display:inline-block;
    background:#e6f0ff;
    color:#3559e0;
    padding:6px 14px;
    border-radius:20px;
    font-size:14px;
    margin-bottom:12px
}
.about-title{
    color:#b24535;
    font-size:25px;
    margin-bottom:15px
}
.about-content p{
    color:#333;
    line-height:1.7;
    margin-bottom:15px
}
.about-btn{
    margin-top:10px;
    background:#b24535;
    color:#fff;
    border:none;
    padding:12px 26px;
    border-radius:30px;
    font-size:15px;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
    transition:all .4s ease
}
.about-btn span{
    transition:transform .4s ease
}
.about-btn:hover{
    background:#2e7d32;
    box-shadow:0 10px 25px #1b5e2066
}
.about-btn:hover span{
    transform:translate(6px)
}
@keyframes fadeUp{
    0%{
        opacity:0;
        transform:translateY(40px)
    }
    to{
        opacity:1;
        transform:translateY(0)
    }
}
@media(max-width:992px){
    .about-container{
        flex-direction:column;
        text-align:left
    }
    .about-image img{
        max-width:400px
    }
    .about-title{
        font-size:24px
    }
}
@media(max-width:576px){
    .about-section{
        padding:50px 15px
    }
    .about-title{
        font-size:16px
    }
    .about-content p {
        font-size:13px
        
    }
}
.nav-bar{
    background:#ad3928
}
.nav-menu{
    display:flex;
    justify-content:center;
    gap:25px;
    list-style:none;
    padding:15px 40px;
    margin:0
}
.nav-menu>li{
    color:#fff;
    position:relative;
    cursor:pointer;
    font-size:15px;
    font-weight:600
}
.nav-menu ul>li a{
    color:#000;
    cursor:pointer;
    font-size:15px;
    font-weight:600
}
.nav-menu ul>li a:hover{
    color:#8b0909;
    position:relative;
    cursor:pointer;
    font-size:15px;
    font-weight:600
}
.has-submenu{
    position:relative
}
.nav-bar .submenu{
    position:absolute;
    top:110%;
    left:0;
    background:#fff;
    list-style:none;
    padding:8px 0;
    min-width:220px;
    border-radius:8px;
    box-shadow:0 12px 30px #0000002e;
    opacity:0;
    visibility:hidden;
    transform:translateY(12px);
    transition:all .35s ease;
    z-index:999
}
.nav-bar .submenu li{
    padding:12px 18px;
    color:#0b2c5f;
    font-size:14px;
    font-weight:500;
    transition:all .3s ease
}
.nav-bar .submenu li:not(:last-child){
    border-bottom:1px solid #f1f1f1
}
.nav-bar .submenu li:hover{
    background:#f3f6fb;
    color:#2d6f3f;
    padding-left:22px
}
.has-submenu:hover .submenu{
    opacity:1;
    visibility:visible;
    transform:translateY(0)
}
.mobile-menu-toggle,.mobile-menu.sidebar,.mobile-menu.overlay{
    display:none
}
@media(max-width:991px){
    .logo-section{
        display:flex;
        align-items:center;
        justify-content:space-between;
        padding:10px 15px
    }
    .nav-bar{
        display:none
    }
    .mobile-menu-toggle{
        display:flex;
        flex-direction:column;
        gap:5px;
        cursor:pointer
    }
    .mobile-menu-toggle span{
        width:26px;
        height:3px;
        background:#2d6f3f
    }
    .mobile-menu.sidebar{
        display:block;
        position:fixed;
        top:0;
        left:-340px;
        width:280px;
        height:100vh;
        background:#fff;
        z-index:1001;
        padding:20px;
        transition:left .35s ease;
        overflow-y:auto
    }
    .mobile-menu.sidebar.open{
        left:0
    }
    .mobile-menu.close-icon{
        font-size:24px;
        text-align:right;
        cursor:pointer;
        color:#2d6f3f;
        margin-bottom:15px
    }
    .mobile-menu.list{
        list-style:none;
        padding:0;
        margin:0
    }
    .mobile-menu.list>li{
        padding:12px 0;
        border-bottom:1px solid #eee;
        color:#0b2c5f;
        font-size:15px;
        font-weight:500;
        cursor:pointer
    }
    .mobile-menu-title{
        display:flex;
        justify-content:space-between;
        align-items:center
    }
    .mobile-menu.submenu{
        list-style:none;
        padding-left:15px;
        margin-top:6px
    }
    .mobile-menu.submenu li{
        font-size:14px;
        padding:8px 0;
        color:#444;
        font-weight:400
    }
    .mobile-menu.submenu li:hover{
        color:#2d6f3f
    }
    .mobile-menu.overlay{
        display:block;
        position:fixed;
        inset:0;
        background:#00000073;
        z-index:1000
    }
}
*{
    -webkit-tap-highlight-color:transparent
}
li,a,button,div{
    outline:none
}
li:focus,li:active,a:focus,a:active{
    background-color:transparent
}
.mobile-menu.list li{
    -webkit-tap-highlight-color:transparent
}
.mobile-menu.list li:active{
    background:transparent
}
.mobile-menu.list li:active{
    background:#f3f6fb
}
.sr-current-info{
    padding:10px 20px;
    background:#f8f9fb
}
.sr-title{
    font-size:28px;
    color:#ae4c39;
    text-align:center;
    font-weight:700;
    margin-bottom:30px
}
.sr-box-wrapper{
    display:flex;
    gap:30px;
    justify-content:center;
    flex-wrap:wrap
}
.sr-box{
    width:100%;
    max-width:520px;
    background:#fff;
    border:2px solid #c54b2c;
    border-radius:20px;
    padding:25px
}
.sr-box-title{
    color:#0b5e3c;
    text-align:center;
    margin-bottom:20px;
    font-weight:700
}
.sr-marquee{
    height:25vh;
    overflow:hidden;
    text-align: center;
}
marquee{
    height:25vh
}
.sr-text{
    text-align:center;
    font-weight:600;
    margin-bottom:10px
}
.sr-link{
    display:block;
    text-align:center;
    color:#c54b2c;
    font-weight:600;
    text-decoration:underline;
    margin-top:10px
}
.sr-image{
    width:100%;
    max-width:220px;
    display:block;
    margin:0 auto 15px;
    border:1px solid #ddd
}
@media(max-width:768px){
    .sr-box{
        max-width:100%
    }
    .sr-marquee{
        height:21vh
    }
    marquee{
        height:21vh
    }
}
.sr-leadership{
    padding:10px 20px;
    background:#f6f7fb
}
.sr-leadership-wrapper{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px;
    max-width:1200px;
    margin:auto
}
.sr-card{
    background:#fff;
    display:flex;
    flex-direction:column;
    border-radius:10px;
    overflow:hidden;
    height:100%;
    box-shadow:0 8px 20px #00000014
}
.sr-card-img{
    width:100%;
    height:280px;
    object-fit:cover
}
.sr-card-body{
    flex-grow:1
}
.sr-card-body h3{
    margin-bottom:10px;
    color:#fff;
    padding:10px
}
.sr-card-one h3{
    background:#8b2f2f
}
.sr-card-two h3{
    background:#2f5c8b
}
.sr-card-three h3{
    background:#2f8b5c
}
.sr-name{
    font-weight:600;
    margin-bottom:10px
}
@media(max-width:992px){
    .sr-leadership-wrapper{
        grid-template-columns:repeat(2,1fr)
    }
}
@media(max-width:576px){
    .sr-leadership-wrapper{
        grid-template-columns:1fr
    }
    .sr-card-img{
        height:220px
    }
}
.ar-institution{
    background:#e6ecec;
    padding:20px 5%;
    font-family:Poppins,sans-serif
}
.ar-container{
    max-width:1300px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:60px
}
.ar-content{
    flex:1
}
.ar-title{
    font-size:48px;
    font-weight:800;
    color:#b24535;
    letter-spacing:1px;
    margin-bottom:25px
}
.ar-subtitle{
    color:#0c6a44;
    font-weight:600;
    margin-bottom:15px
}
.ar-description{
    text-align:justify;
    color:#555;
    line-height:1.7;
    max-width:500px
}
.ar-cards{
    flex:1.2;
    display:flex;
    gap:40px;
    justify-content:center
}
.ar-card{
    background:#156e42;
    border-radius:25px;
    padding:35px 25px;
    text-align:center;
    width:280px;
    transition:.4s ease;
    box-shadow:0 10px 25px #0000000d
}
.ar-card:hover{
    transform:translateY(-10px);
    box-shadow:0 15px 35px #0000001a
}
.ar-image{
    width:140px;
    height:160px;
    object-fit:cover;
    border-radius:15px;
    margin-bottom:20px
}
.ar-card h4{
    font-size:16px;
    font-weight:700;
    margin-bottom:10px;
    color:#ebebeb
}
.ar-card p{
    font-size:14px;
    color:#fffa56;
    line-height:1.5
}
@media(max-width:1024px){
    .ar-container{
        flex-direction:column;
        text-align:center
    }
    .ar-content{
        margin-bottom:40px
    }
    .ar-cards{
        flex-wrap:wrap
    }
}
@media(max-width:600px){
    .ar-title{
        font-size:32px
    }
    .ar-card{
        width:100%;
        max-width:320px
    }
}
.ar-footer{
    background:linear-gradient(108deg,#560014,#600400);
    color:#fff;
    padding:10px 5% 0;
    font-family:Poppins,sans-serif
}
.ar-footer-container{
    max-width:1400px;
    margin:auto;
    display:grid;
    grid-template-columns:1.2fr 1fr 2fr;
    gap:60px
}
.ar-footer-about p{
    font-size:14px;
    line-height:1.8;
    margin:10px 0;
    color:#e0f2e9
}
.btn-green{
    background:#2e7d32;
    padding:5px 10px;
    margin-bottom:10px;
    border:none;
    border-radius:5px
}
.btn-green:hover{
    background:#6e861d;
   }
.btn-green a{
    text-decoration:none;
    color:#fff
}
.ar-footer-logo{
    width:120px
}
.ar-social{
    display:flex;
    gap:15px
}
.ar-social a{
    background:#ffffff1a;
    padding:10px;
    border-radius:8px;
    color:#fff;
    transition:.3s
}
.ar-social a:hover{
    background:#fff;
    color:#0b5e3b
}
.ar-footer-about h3,.ar-footer-links h3,.ar-footer-dept h3{
    color:#f0ff9c;
    margin-bottom:20px;
    font-weight:600
}
.ar-footer-links ul{
    list-style:none;
    padding:0
}
.ar-footer-links li{
    margin-bottom:10px;
    font-size:14px;
    cursor:pointer;
    color:#e0f2e9;
    transition:.3s
}
.ar-footer-links li:hover{
    color:#fff;
    padding-left:5px
}
.ar-footer-links li a{
    
    color:#e0f2e9;
}
.ar-footer-links li a:hover{
    color:yellow;
    } 
.ar-dept-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:10px 30px
}
.ar-dept-item{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:14px;
    color:#e0f2e9
}
.ar-dept-item a{
   
    color:#e0f2e9
}
.ar-dept-item  a:hover{
    color:yellow;
    } 
.ar-check{
    color:#4dd0a7;
    font-size:12px
}
.ar-footer-bottom{
    display:flex;
    justify-content:space-around;
    flex-wrap:wrap;
    text-align:center;
    padding:20px;
    margin-top:30px;
    background:#06154a;
    font-size:14px
}
.ar-footer-credit a{
    color:#f0ff9c;
    font-weight:400;
    text-decoration:none
}
@media(max-width:1024px){
    .ar-footer-container{
        grid-template-columns:1fr 1fr
    }
    .ar-footer-dept{
        grid-column:span 2
    }
}
@media(max-width:768px){
    .ar-footer-container{
        grid-template-columns:1fr;
        text-align:center
    }
    .ar-dept-grid{
        grid-template-columns:1fr
    }
    .ar-social{
        justify-content:center
    }
}
.ar-contact{
    padding:35px 5%;
    background:#f4f7f6;
    font-family:Poppins,sans-serif
}
.ar-contact-container{
    max-width:1200px;
    margin:auto;
    display:flex;
    gap:60px;
    align-items:flex-start
}
.ar-contact-info{
    flex:1
}
.ar-contact-info h2{
    font-size:36px;
    margin-bottom:20px;
    color:#0b5e3b
}
.ar-contact-info p{
    color:#555;
    line-height:1.7;
    margin-bottom:30px
}
.ar-contact-details h4{
    margin-bottom:5px;
    color:#222
}
.ar-contact-details p{
    margin-bottom:20px;
    color:#666
}
.ar-contact-form{
    flex:1;
    background:#fff;
    border-radius:15px
}
.ar-contact-form form{
    display:flex;
    flex-direction:column;
    gap:20px
}
.ar-contact-form input,.ar-contact-form textarea{
    padding:12px 15px;
    border:1px solid #ddd;
    border-radius:8px;
    font-size:14px;
    outline:none;
    transition:.3s
}
.ar-contact-form input:focus,.ar-contact-form textarea:focus{
    border-color:#0b5e3b
}
.ar-contact-form button{
    background:#0b5e3b;
    color:#fff;
    padding:12px;
    border:none;
    border-radius:8px;
    cursor:pointer;
    font-weight:600;
    transition:.3s
}
.ar-contact-form button:hover{
    background:#08452c
}
@media(max-width:992px){
    .ar-contact-container{
        flex-direction:column
    }
}
.ar-contact-form iframe{
    width:100%;
    height:55vh;
    min-height:300px;
    border-radius:12px;
    box-shadow:0 4px 15px #0000001a
}
@media(max-width:576px){
    .ar-contact-form iframe{
        min-height:250px;
        border-radius:8px
    }
}
@media(max-width:400px){
    .ar-contact-form iframe{
        min-height:220px
    }
}
.inner-banner{
    position:relative;
    background:url(../images/stanley-common-banner.webp) no-repeat center center/cover;
    height:350px;
    display:flex;
    align-items:center;
    justify-content:center
}
.inner-banner .overlay{
    position:absolute;
    width:100%;
    height:100%;
    background:#00000080;
    top:0;
    left:0
}
.banner-content{
    position:relative;
    color:#fff;
    text-align:center;
    z-index:2
}
.banner-content h1{
    font-size:42px;
    font-weight:600
}
@media(max-width:768px){
    .inner-banner{
        height:220px
    }
    .banner-content h1{
        font-size:28px
    }
}
.dept-section{
    padding:80px 20px;
    background:#f4f4f4
}
.dept-container{
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:25px
}
.dept-card{
    background:#0b5e3c;
    border:2px solid #2c3e70;
    border-radius:6px;
    padding:25px 15px;
    text-align:center;
    font-size:15px;
    font-weight:500;
    color:#fff;
    letter-spacing:.5px;
    text-decoration:none;
    box-shadow:0 4px 8px #00000026;
    transition:all .3s ease
}
.dept-card:hover{
    background:#fff;
    color:#2c3e70;
    transform:translateY(-5px);
    box-shadow:0 8px 18px #00000040
}
.dept-card:active{
    transform:scale(.98)
}
@media(max-width:992px){
    .dept-container{
        grid-template-columns:repeat(3,1fr)
    }
}
@media(max-width:600px){
    .dept-container{
        grid-template-columns:repeat(2,1fr)
    }
    .dept-card{
        font-size:14px;
        padding:20px 10px
    }
}
@media(max-width:400px){
    .dept-container{
        grid-template-columns:1fr
    }
}
body{
    top:0!important
}
body>.skiptranslate,.goog-logo-link,.gskiptranslate,.goog-te-gadget span,.goog-te-banner-frame,#goog-gt-tt,.goog-te-balloon-frame,div#goog-gt-{
    display:none!important
}
.goog-te-gadget{
    color:transparent!important;
    font-size:0px
}
.goog-text-highlight{
    background:none!important;
    box-shadow:none!important
}
#google_translate_element select{
    background:#017850;
    color:#fff4e4;
    border:none;
    font-weight:700;
    border-radius:3px;
    padding:8px 12px
}
/* --- styles moved from React inline styles --- */
 .mobile-menu-link{
    text-decoration:none;
    color:#000
}
 .dept-detail{
    padding:60px 20px;
    max-width:1200px;
    margin:0 auto
}
 .dept-detail-block{
    margin-bottom:40px
}
 .dept-detail h2{
    font-size:28px;
    margin-bottom:20px;
    color:#333
}
 .dept-detail p{
    font-size:16px;
    line-height:1.8;
    color:#555
}
 .dept-facilities{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
    gap:15px;
    list-style:none;
    padding:0
}
 .dept-facilities li{
    padding:10px 15px;
    background:#f5f5f5;
    border-radius:5px;
    font-size:15px
}
 .dept-faculty{
    list-style:none;
    padding:0
}
 .dept-faculty li{
    padding:12px 15px;
    border-bottom:1px solid #eee;
    font-size:16px;
    color:#555
}
 .sr-card-body h3{
    margin:0
}
 .sr-card-body .sr-name,.sr-card-body p{
    padding:0 10px
}
 .ar-who-title{
    text-align:left
}
 .ar-footer-about .about-text{
    text-align:justify;
    font-size:16px
}
 .mobile-menu .submenu-hidden{
    display:none
}
 .mobile-menu-title{
    cursor:pointer
}
 .nav-menu a,.nav-bar .submenu a{
    display:block
}
 .nav-bar .submenu li{
    padding:0
}
 .nav-bar .submenu li a{
    padding:12px 18px;
    color:#0b2c5f
}
 .nav-bar .submenu li a:hover{
    color:#2d6f3f
}
 .top-links a{
    color:#fff;
    text-decoration:none
}
 .about-btn{
    text-decoration:none
}
 /*.ar-footer a{
    color:inherit;
    text-decoration:none
}*/
 .btn-green a{
    color:#fff
}
 .slider .slider-image{
    display:none
}
 .slider .slider-image.active{
    display:block
}
.sr-leadership .sr-card-body h3 {
    background-color: #8b2e2e;
    color: #ffffff;
  }
  
  /* Or a different color per card (like the blue and green sample) */
  .sr-leadership-wrapper .sr-card:nth-child(1) .sr-card-body h3 { background-color: #8b2e2e; }
  .sr-leadership-wrapper .sr-card:nth-child(2) .sr-card-body h3 { background-color: #2f5d8c; }
  .sr-leadership-wrapper .sr-card:nth-child(3) .sr-card-body h3 { background-color: #2e8b57; }
  
    /* Add text alignment classes if needed for the images */
    .tal {
        text-align: left;
    }

    .tac {
        text-align: center;
    }

    .tar {
        text-align: right;
    }

    .gk-img-card-section {
        padding: 60px 20px;
        background: #f9f9f9;
    }

    .gk-img-card-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }

    /* Card */
    .gk-img-card {
        position: relative;
        overflow: hidden;
        border-radius: 10px;
        cursor: pointer;
    }

    /* Image */
    .gk-img-card img {
        width: 100%;
        height: 247px;
        object-fit: cover;
        display: block;
        transition: 0.4s;
    }

    /* Hover Zoom */
    .gk-img-card:hover img {
        transform: scale(1.1);
    }

    /* Title */
    .gk-img-card-title {
        position: absolute;
        bottom: 0;
        width: 100%;
        padding: 12px;
        background: rgba(162, 51, 46, 0.85);
        color: #fff;
        font-size: 16px;
        text-align: center;
        font-weight: 600;
    }

    /* Responsive */
    @media (max-width: 992px) {
        .gk-img-card-grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media (max-width: 576px) {
        .gk-img-card-grid {
            grid-template-columns: 1fr;
        }
    }

    /*EVENTS START*/
    .am-event {
        width: 100%;
        position: relative;
    }

    .am-event-title {
        text-align: center;
        margin-bottom: 50px;
    }

    .am-event-title h2 {
        font-size: 42px;
        color: #ab272a;
        font-weight: 700;
        margin-bottom: 10px;
        letter-spacing: 1px;
    }

    .am-event-title p {
        color: #025132;
        font-size: 16px;
        font-weight: 500;
    }

    /* =========================
           GRID
        ========================== */

    .am-event-container {
        max-width: 1250px;
        margin: auto;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 35px;
    }

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

    .am-event-card {
        background: #fff;
        border-radius: 28px;
        overflow: hidden;
        position: relative;
        transition: 0.5s ease;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
        border: 2px solid transparent;
    }

    .am-event-card:hover {
        transform: translateY(-12px);
        border-color: #ab272a;
        box-shadow: 0 20px 45px rgba(171, 39, 42, 0.25);
    }

    /* =========================
           IMAGE
        ========================== */

    .am-event-image-box {
        position: relative;
        overflow: hidden;
    }

    .am-event-image-box img {
        width: 100%;
        display: block;
        transition: 0.6s ease;
    }

    .am-event-card:hover img {
        transform: scale(1.08);
    }

    /* Overlay */

    .am-event-overlay {
        position: absolute;
        inset: 0;
        background: linear-gradient(to top,
                rgba(171, 39, 42, 0.75),
                rgba(2, 81, 50, 0.15));
        opacity: 0;
        transition: 0.5s ease;
    }

    .am-event-card:hover .am-event-overlay {
        opacity: 1;
    }

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

    .am-event-btn-box {
        padding: 22px;
        text-align: center;
    }

    .am-event-btn {
        display: inline-block;
        padding: 13px 32px;
        background: linear-gradient(135deg, #ab272a, #025132);
        color: #fff;
        text-decoration: none;
        border-radius: 50px;
        font-size: 15px;
        font-weight: 600;
        transition: 0.4s ease;
        letter-spacing: 0.5px;
    }

    .am-event-btn:hover {
        background: linear-gradient(135deg, #025132, #ab272a);
        transform: scale(1.06);
    }

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

    @media(max-width:1024px) {

        .am-event-container {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media(max-width:768px) {

        .am-event {
            padding: 60px 15px;
        }

        .am-event-title h2 {
            font-size: 30px;
        }

        .am-event-title p {
            font-size: 14px;
        }

        .am-event-container {
            grid-template-columns: 1fr;
            gap: 25px;
        }
    }

    @media(max-width:480px) {

        .am-event-title h2 {
            font-size: 24px;
        }

        .am-event-btn {
            width: 100%;
            padding: 12px;
            font-size: 14px;
        }
    }
    .page-banner {
        background: url(../images/about.jpg) no-repeat;
        -webkit-background-size: cover;
        background-size: cover;
        padding-top: 80px;
        padding-bottom: 80px;
        position: relative;
    }
    
    .page-banner .overlay {
        background: #2795d0;
        opacity: 0.7;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }
    
    .page-banner-single {
        background: #333 !important;
        padding-top: 40px;
        padding-bottom: 40px;
    }
    
    .banner-text {
        text-align: center;
    }
    
    .banner-text h1 {
        font-family: 'Roboto', sans-serif;
        font-size: 30px;
        color: #fff;
        margin-bottom: 20px;
        font-weight: 700;
    }
    
    .banner-text ul {
        margin-bottom: 0;
        text-align: center;
    }
    
    .banner-text ul li {
        font-family: 'Roboto', sans-serif;
        display: inline-block;
        list-style-type: none;
        font-style: italic;
        color: #d8d8d8;
        font-weight: 700;
        margin-right: 5px;
        font-size: 14px;
    }
    
    .banner-text ul li a {
        color: #d8d8d8;
    }
    
    .table-container {
        max-width: 100%;
        overflow-x: auto;
    }
    
    .responsive-table {
        width: 100%;
        border-collapse: collapse;
        margin: 20px 0;
        background-color: #fff;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    }
    
    .responsive-table th,
    .responsive-table td {
        padding: 12px 15px;
        text-align: left;
        border: 1px solid #ddd;
    }
    
    .responsive-table th {
        background-color: #2e2e72;
        color: white;
    }
    
    .responsive-table tbody tr:nth-child(even) {
        background-color: #f9f9f9;
    }
     
    .table-container {
	max-width: 100%;
	overflow-x: auto;
}

.responsive-table {
	width: 100%;
	border-collapse: collapse;
	margin: 20px 0;
	background-color: #fff;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.responsive-table th,
.responsive-table td {
	padding: 12px 15px;
	text-align: left;
	border: 1px solid #ddd;
}

.responsive-table th {
	background-color: #2e2e72;
	color: white;
}

.responsive-table tbody tr:nth-child(even) {
	background-color: #f9f9f9;
}

/*grid start*/


.grid-container1 {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	/* 5 items per row on desktop */
	gap: 20px;
	width: 100%;
	max-width: 1400px;
}

/* .grid-item1 {
  border: 2px solid #9E9E9E;

  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 90px;
  text-align: center;
  font-size: 1em;
  border-radius: 10px;
  transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
  box-shadow: 0 5px 5px rgb(0 0 0 / 20%);
  font-weight: 500;
  font-size: 17px;
} */

.grid-item1 {
	border: 2px solid #0d3559;
	background-color: #ffffff;
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 90px;
	text-align: center;
	font-size: 1em;
	border-radius: 5px;
	transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
	box-shadow: 0 5px 5px rgb(0 0 0 / 20%);
	font-weight: 500;
	font-size: 17px;
}

.grid-item1:hover {
	transform: scale(1.05);
	/* Slight zoom on hover */
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.5);
	/* Stronger shadow on hover */
	background-color: #0b93ff4a;
	border: 2px solid #4c7efd;
}

/* Responsive behavior */
@media(max-width: 1200px) {
	.grid-container1 {
		grid-template-columns: repeat(3, 1fr);
		/* 3 items per row on larger tablets/laptops */
	}
}

@media(max-width: 900px) {
	.grid-container1 {
		grid-template-columns: repeat(2, 1fr);
		/* 2 items per row on smaller tablets */
	}
}

@media(max-width: 600px) {
	.grid-container1 {
		grid-template-columns: repeat(1, 1fr);
		/* 1 item per row on mobile (iPhone view) */
	}

	.grid-item1 {
		font-size: 0.9em;
		height: 120px;
		/* Reduced height for mobile */
	}
}

/*grid end*/

@media (max-width: 1920px) and (min-width:600px) {
	.twr {
		max-width: 60%;
	}
}

@media (max-width: 600px) and (min-width: 0px) {
	.twr {
		max-width: 100%;
	}
}

/* 3 COLUMN GRID */
.gk-news-container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

/* NEWS CARD */
.gk-news-card {
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

/* CLICK THE IMAGE */
.gk-news-card h5 {
	margin: 0 0 12px;
	font-size: 20px;
	line-height: 1.4;
	font-weight: 600;
	color: #017850;
}

/* IMAGE */
.gk-news-card a {
	display: block;
	width: 100%;
}

.gk-news-card img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	border: 2px solid #2e2e72;
	box-sizing: border-box;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* HOVER */
.gk-news-card a:hover img {
	transform: scale(1.02);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
}

/* ================================ TABLET ================================ */
@media (max-width: 991px) {
	.gk-news-container {
		grid-template-columns: repeat(2, 1fr);
		gap: 25px;
	}

	.gk-news-title h1 {
		font-size: 30px;
	}
}

/* ================================ MOBILE ================================ */
@media (max-width: 600px) {
	.gk-news-section {
		padding: 15px 12px 30px;
	}

	.gk-news-container {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.gk-news-title {
		margin-bottom: 25px;
	}

	.gk-news-title h1 {
		font-size: 26px;
	}

	.gk-news-card h5 {
		font-size: 18px;
		margin-bottom: 10px;
	}
}

/**
 * ---------------------------------------------------
 * About - Version 2
 * ---------------------------------------------------
 */
.about-v2 {
	padding-top: 30px;
	padding-bottom: 30px;
	background: #fff;
}

.about-v2 h2 {
	color: #333;
	font-size: 20px;
	font-weight: 600;
}

.about-v2 p {
	font-size: 15px;
}

.about-v2 p.button {
	margin-top: 20px;
}

.about-v2 p.button a {
	font-size: 14px;
	-webkit-transition: all 0.4s ease 0s;
	-moz-transition: all 0.4s ease 0s;
	-o-transition: all 0.4s ease 0s;
	transition: all 0.4s ease 0s;
	background: #2795d0;
	color: #ffffff;
	padding: 8px 16px 12px;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-box-shadow: inset 0 -5px rgba(0, 0, 0, .2);
	-moz-box-shadow: inset 0 -5px rgba(0, 0, 0, .2);
	box-shadow: inset 0 -5px rgba(0, 0, 0, .2);
}

.about-v2 p.button a:hover {
	background: #656464;
}
.page-banner .overlay {
    background: #06154a !important;
}

.archer-style {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 6px 20px;
    justify-content: center;
}

.a-btn {
    background-color: #007BFF;
    /* button color */
    color: #fff;
    padding: 7px 16px;
    border-radius: 5px;
    font-weight: bold;
    white-space: nowrap;
    font-size: 16px;
    text-align: center;
}
.a-btn a{
    color: #fff;
    
}
@media (max-width: 600px) {
    .archer-style {
        flex-direction: column;
        align-items: flex-start;
    }

    .a-btn {
        width: 100%;
        text-align: left;
    }
}
.archer-gallery-sr {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 15px;
    padding: 20px;
    max-width: 1500px;
    /* optional for layout control */
    margin: 0 auto;
    /* centers the grid */
}

.archer-gallery-sr img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 5px;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    cursor: pointer;
}

.archer-gallery-sr img:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 30px rgba(255, 255, 255, 0.2);
}

/* Popup Styles */
.archer-gallery-sr-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.85);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.archer-gallery-sr-popup.active {
    visibility: visible;
    opacity: 1;
}

.popup-content {
    position: relative;
    max-width: 90%;
    max-height: 90%;
}

.popup-content img {
    max-width: 100%;
    max-height: 80vh;
    border-radius: 10px;
    animation: zoomIn 0.4s ease;
}

@keyframes zoomIn {
    0% {
        transform: scale(0.8);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.popup-controls {
    position: absolute;
    top: 50%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
}

.popup-btn {
    background: rgb(0 0 0 / 34%);
    border: none;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 24px;
    color: white;
    transition: background 0.3s ease;
}

.popup-btn:hover {
    background: rgba(255, 255, 255, 0.4);
}

.close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    background: red;
    border: none;
    border-radius: 50%;
    color: white;
    width: 35px;
    height: 35px;
    font-size: 18px;
    cursor: pointer;
}
.gallery-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background-color: #070772;
}

.image-title {
    text-align: center;
    margin: 10px;
    font-size: 16px;
    color: #fff;
    font-weight: 500;
}


/* ===== Footer responsive fixes ===== */
@media(max-width:1024px){
    .ar-footer-container{
        gap:40px
    }
}
@media(max-width:768px){
    .ar-footer-container{
        gap:30px
    }
    /* the 1024px rule spans this over 2 columns, which re-creates a 2nd column in the 1-column grid */
    .ar-footer-dept{
        grid-column:auto
    }
    /* later .ar-footer-about .about-text rule forced justify + 16px; keep it centred like the rest */
    .ar-footer-about .about-text{
      
        font-size:14px
    }
    .ar-dept-grid{
        grid-template-columns:repeat(2,1fr);
        gap:10px 16px;
        text-align:left
    }
    .ar-footer-bottom{
        flex-direction:column;
        gap:6px;
        padding:16px
    }
}
@media(max-width:480px){
    .ar-dept-grid{
        grid-template-columns:1fr;
        max-width:260px;
        margin:0 auto
    }
}
  /*DATE START*/
        /* =========================================
   DAILY DOCTORS DUTY ROSTER
========================================= */

.duty-roster-box {
    width: 100%;
    max-width: 1100px;
    margin: 30px auto;

    display: grid;
    grid-template-columns: 320px 1fr;

    background: #ffffff;
    /* border: 1px solid #e2e4ec; */
    border: 1px solid #22268a;
    border-radius: 16px;
    overflow: hidden;

    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
}


/* =========================================
LEFT SIDE
========================================= */

.duty-roster-info {
    position: relative;

    padding: 40px 30px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    text-align: center;

    background: #22268a;
    color: #ffffff;

    overflow: hidden;
}

/* Decorative circle */

.duty-roster-info::before {
    content: "";
    position: absolute;

    width: 190px;
    height: 190px;

    border: 35px solid rgba(255, 255, 255, 0.06);
    border-radius: 50%;

    top: -90px;
    left: -80px;
}

.duty-roster-info::after {
    content: "";
    position: absolute;

    width: 160px;
    height: 160px;

    border: 30px solid rgba(255, 255, 255, 0.05);
    border-radius: 50%;

    right: -70px;
    bottom: -70px;
}


/* LOGO */

.duty-roster-logo {
    position: relative;
    z-index: 2;

    width: 105px;
    height: 105px;

    padding: 10px;

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

    background: #ffffff;
    border-radius: 12px;

    margin-bottom: 22px;

    box-sizing: border-box;
}

.duty-roster-logo img {
    width: 100%;
    height: 100%;

    object-fit: contain;

    display: block;
}


/* TITLE */

.duty-roster-info h2 {
    position: relative;
    z-index: 2;
    color: white;
    margin: 0;
    font-size: 27px;
    line-height: 1.3;
    font-weight: 700;
}

.duty-roster-info p {
    position: relative;
    z-index: 2;
    color: white;
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 1.6;
    opacity: 0.85;
}


/* =========================================
RIGHT SIDE
========================================= */

.duty-roster-list {
    padding: 30px;

    background: #ffffff;
}


/* HEADING */

.duty-roster-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    padding-bottom: 18px;
    margin-bottom: 5px;

    border-bottom: 1px solid #eeeeee;
}

.duty-roster-heading h3 {
    margin: 0;

    color: #22268a;

    font-size: 22px;
    font-weight: 700;
}

.duty-roster-heading span {
    color: #888888;

    font-size: 12px;
}


/* =========================================
DATE ITEM
========================================= */

.duty-roster-item {
    width: 100%;
    min-height: 64px;

    margin-top: 12px;
    padding: 10px 12px;

    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    text-decoration: none;

    background: #fafbff;

    border: 1px solid #e2e4ec;
    border-left: 4px solid #22268a;

    border-radius: 8px;

    transition: all 0.25s ease;
}

.duty-roster-item:hover {
    background: #ffffff;

    border-left-color: #eb1b3b;

    transform: translateX(3px);

    box-shadow: 0 5px 15px rgba(34, 38, 138, 0.10);
}


/* DATE */

.duty-roster-date {
    display: flex;
    align-items: center;

    gap: 10px;

    color: #22268a;

    font-size: 15px;
    font-weight: 600;
}

.duty-roster-icon {
    width: 35px;
    height: 35px;

    flex: 0 0 35px;

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

    background: #22268a;

    color: #ffffff;

    border-radius: 7px;

    font-size: 14px;
}


/* PDF BUTTON */

.duty-roster-pdf {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 7px;

    padding: 9px 13px;

    background: #22268a;

    color: #ffffff;

    border-radius: 6px;

    font-size: 12px;
    font-weight: 600;

    white-space: nowrap;

    transition: 0.25s ease;
}

.duty-roster-item:hover .duty-roster-pdf {
    background: #eb1b3b;
}


/* =========================================
LAPTOP
========================================= */

@media (max-width: 1199px) {

    .duty-roster-box {
        grid-template-columns: 280px 1fr;
    }

    .duty-roster-info {
        padding: 35px 20px;
    }

    .duty-roster-list {
        padding: 25px;
    }

}


/* =========================================
TABLET
========================================= */

@media (max-width: 991px) {

    .duty-roster-box {
        grid-template-columns: 240px 1fr;
    }

    .duty-roster-info h2 {
        font-size: 22px;
    }

    .duty-roster-logo {
        width: 85px;
        height: 85px;
    }

    .duty-roster-list {
        padding: 20px;
    }

    .duty-roster-heading {
        display: block;
    }

    .duty-roster-heading span {
        display: block;
        margin-top: 5px;
    }

}


/* =========================================
MOBILE
========================================= */

@media (max-width: 767px) {

    .duty-roster-box {
        display: block;

        width: 100%;

        margin: 20px auto;

        border-radius: 12px;
    }

    .duty-roster-info {
        padding: 30px 15px;
    }

    .duty-roster-logo {
        width: 80px;
        height: 80px;

        margin-bottom: 15px;
    }

    .duty-roster-info h2 {
        font-size: 22px;
    }

    .duty-roster-info p {
        font-size: 12px;
    }

    .duty-roster-list {
        padding: 15px;
    }

    .duty-roster-heading h3 {
        font-size: 19px;
    }

    .duty-roster-item {
        min-height: 60px;
        padding: 8px;
    }

    .duty-roster-date {
        font-size: 14px;
    }

}


/* =========================================
SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .duty-roster-list {
        padding: 12px;
    }

    .duty-roster-item {
        gap: 8px;
    }

    .duty-roster-icon {
        width: 31px;
        height: 31px;

        flex-basis: 31px;
    }

    .duty-roster-date {
        gap: 7px;
        font-size: 13px;
    }

    .duty-roster-pdf {
        padding: 8px 9px;
        font-size: 11px;
    }

}


/* ===== Top bar () ===== */
.top-strip {
  width: 100%;
  height: 41px;
  display: flex;
  align-items: center;          /* vertical center */
  justify-content: flex-end;    /* push to the right */
  padding: 0;
  margin: 0;
}

.top-strip .top-links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  height: 100%;
  padding: 0 65px 0 0;          /* gap from right edge */
  margin: 0;
}

#google_translate_element {
  display: flex;
  align-items: center;
  height: 100%;
  margin: 0;
  padding: 0;
  text-align: right;
}

/* Remove "Powered by Google" text and spacing */
#google_translate_element .goog-te-gadget {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
  color: transparent;
}
#google_translate_element .goog-te-gadget span,
#google_translate_element .goog-te-gadget a {
  display: none !important;
}
#google_translate_element .goog-te-gadget > div {
  display: flex !important;
  align-items: center;
  margin: 0;
}


/* Stop Google's banner from pushing the page down */
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame { display: none !important; }
body { top: 0 !important; }

/* Mobile */
@media (max-width: 768px) {
  .top-strip .top-links { padding-right: 12px; }
  #google_translate_element select.goog-te-combo {
    min-width: 130px;
    font-size: 13px;
  }
}