@import url(https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap);

*,
body {
    padding: 0;
    margin: 0;
}

.close-btn,
.fixed-btns li a {
    display: flex;
    align-items: center
}

.banner-content h1,
.banner-content p {
    text-shadow: 0 2px 6px rgba(0, 0, 0, .5)
}

.circle-bg,
.circle-go {
    fill: rgba(255, 255, 255, 0)
}

.banner-item,
.members::after {
    background-repeat: no-repeat;
    background-size: cover
}

.choose-img img,
.tutoring-course::after {
    animation-name: zoomInOut;
    animation-duration: 10s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite
}

.header,
.tutoring-card {
    backdrop-filter: blur(10px)
}

.org-level-title,
.stat-label {
    letter-spacing: 1px;
    text-transform: uppercase
}

.access-btn,
.admin-email,
.book-ptm-btn,
.booking-btn,
.contact-link,
.direction-btn,
.doc-link-card,
.download-btn,
.download-full-btn,
.ebrochure-download-btn,
.footer-box ul li a,
.gallery-view-album,
.news-article-link,
.news-read-more,
.portal-btn,
.resource-btn,
.social-icon,
.video-tour-btn,
.view-all-btn,
a,
a:hover {
    text-decoration: none
}

:root {
    --primary-dark-green: #213018;
    --primary-light-green: #78a94e;
    --black: #000000;
    --gradient-green: linear-gradient(135deg, #213018 0%, #2d4a1f 100%);
    --gradient-light: linear-gradient(135deg, #78a94e 0%, #8bc052 100%)
}

* {
    box-sizing: border-box
}

body {
    font-family: 'Montserrat', sans-serif;
}

img {
    max-width: 100%;
    height: auto
}

a,
a:hover {
    color: inherit
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Playfair Display', serif;
}


.popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    z-index: 1000;
    display: flex
}

.popup-content,
.white-btn::after {
    background-color: #fff
}

.popup-content {
    position: relative;
    width: 400px;
    padding: 20px;
    text-align: center
}

.close-btn {
    position: absolute;
    top: -30px;
    right: 0;
    font-size: 14px;
    font-weight: 700;
    background-color: #78a94e;
    cursor: pointer;
    color: #fff;
    padding: 0;
    width: 30px;
    height: 30px;
    justify-content: center;
    transition: .3s
}

.read-btn,
.read-btn:hover span {
    position: relative;
    transition: .3s
}

.close-btn:hover i {
    transition: .3s;
    transform: rotate(90deg)
}

.close-btn i {
    transition: .3s;
    transform: rotate(-90deg)
}

.read-btn {
    border: 2px solid #78a94e;
    color: #78a94e;
    padding: 10px 25px;
    display: inline-block;
    font-weight: 600
}

.read-btn:hover span {
    z-index: 2;
    color: #fff
}

.read-btn:hover::after {
    width: 100%
}

.read-btn:hover {
    color: #fff;
    transition: .3s
}

.white-btn {
    border-color: #fff;
    color: #fff
}

.subsection h3 i,
.white-btn:hover span {
    color: #78a94e
}

.marquee-section {
    width: 100%;
    float: left;
    background-color: #78a94e;
    color: #fff;
    padding: 5px 0;
    font-size: 14px;
    font-weight: 500
}

.fixed-btns,
.fixed-btns li,
.footer-box ul li {
    margin: 0;
    padding: 0
}

.banner-slider,
.choose-us-section,
.footer,
.main-title,
.marquee,
.marquee marquee,
.member-slider,
.member-slider .item,
.members,
.online-tutoring,
.programs {
    width: 100%;
    float: left
}

.marquee-section a.blink-btn {
    font-weight: 600;
    text-decoration: underline;
    animation: 2s linear infinite blink
}

.fixed-btns {
    position: fixed;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    list-style: none;
    z-index: 99
}

.banner-content,
.slider-dots-box {
    transform: translate(-50%, -50%);
    left: 50%
}

.fixed-btns li a {
    width: 45px;
    height: 45px;
    color: #fff;
    justify-content: center;
    line-height: 50px;
    font-size: 18px;
    transition: .3s
}

.fixed-btns li a:hover {
    transform: scale(1.1);
    transition: .3s
}

.fixed-btns li:first-child a {
    background-color: #cb992c
}

.fixed-btns li:nth-child(2) a {
    background-color: #32bb46
}

.fixed-btns li:last-child a {
    background-color: #043851
}

.header {
    width: 100%;
    position: absolute;
    top: 31px;
    z-index: 999;
    background-color: rgba(255, 255, 255, .95);
    transition: .3s;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .1)
}

.banner-item,
.banner-section {
    position: relative;
    width: 100%;
    float: left
}

.innerHeader {
    top: 0;
    background-color: #fff
}

.header.fixed {
    position: fixed;
    top: 0;
    background-color: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .1)
}

.header .navbar {
    padding: 15px 0
}

.header.fixed .navbar {
    padding: 12px 0
}

.navbar-brand img {
    max-width: 140px;
    height: auto;
    transition: .3s
}

.header.fixed .navbar-brand img {
    max-width: 110px
}

.navbar-toggler {
    border: 2px solid #78a94e;
    border-radius: 5px;
    padding: 8px 12px
}

.navbar-toggler:focus {
    box-shadow: none;
    outline: 0
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2845, 74, 31, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}

.navbar-nav {
    align-items: center
}

.slider-dots,
.slider-dots-box {
    justify-content: center;
    display: flex
}

.header .navbar .nav-item {
    margin-left: 5px
}

.header .navbar a.nav-link {
    padding: 10px 8px !important;
    font-weight: 600;
    font-size: 15px;
    color: #2d4a1f;
    transition: color .3s;
    border-radius: 5px
}

.header .navbar a.nav-link:hover {
    color: #78a94e;
    background-color: rgba(120, 169, 78, .1)
}

.header .navbar-nav .dropdown-toggle.active,
.header .navbar-nav .nav-link.active {
    color: #78a94e;
    background-color: rgba(120, 169, 78, .15);
    font-weight: 700
}

.nav-link.dropdown-toggle::after {
    margin-left: 6px;
    transition: transform .3s
}

.faq-item.active .faq-toggle,
.nav-item.dropdown:hover .dropdown-toggle::after,
.nav-link.dropdown-toggle.show::after {
    transform: rotate(180deg)
}

.header .dropdown-menu {
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 8px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .1);
    padding: 8px 0;
    margin-top: 8px;
    min-width: 220px
}

.header .dropdown-item {
    padding: 10px 20px;
    font-weight: 500;
    font-size: 14px;
    color: #2d4a1f;
    transition: .3s
}

.header .dropdown-item:hover {
    background-color: #78a94e;
    color: #fff;
    padding-left: 25px
}

.header .dropdown-item.active,
.header .dropdown-item:active {
    background-color: #78a94e;
    color: #fff;
    font-weight: 600
}

.header .navbar-nav .nav-item a.nav-link.read-btn {
    padding: 10px 25px !important;
    background-color: #78a94e;
    color: #fff !important;
    border-radius: 50px;
    font-weight: 700;
    margin-left: 10px;
    transition: .3s
}

.nav-item a.nav-link.read-btn:hover {
    background-color: #2d4a1f;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(120, 169, 78, .3)
}

html {
    scroll-padding-top: 100px
}

.banner-item {
    height: calc(100vh - 31px);
    background-position: top center
}

.banner-content {
    position: absolute;
    top: 50%;
    color: #fff;
    text-align: center;
    z-index: 2
}

.banner-content p {
    font-size: 18px;
    margin-bottom: 10px;
    font-weight: 500
}

.banner-content h1 {
    font-size: 48px;
    font-weight: 700
}

ul.slick-dots {
    position: absolute;
    right: 5%;
    bottom: 5%;
    list-style: none;
    margin: 0;
    padding: 0
}

.slider-dots-box {
    align-items: center;
    position: absolute;
    bottom: 0
}

.slider-dots {
    align-items: center;
    min-height: 40px;
    margin-bottom: 0;
    list-style: none;
    padding: 0
}

.slider-dots button {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    border: 0;
    background-color: transparent;
    margin: 0 10px;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 0;
    transition: .3s;
    position: relative;
    z-index: 0
}

.slider-dots-box .slick-active button {
    width: 40px;
    height: 40px
}

.slider-dots button:after {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fff
}

.slider-dots-box .slick-active button:after {
    content: none;
    display: none
}

.slider-dots-box .slick-active button:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
    border: 2px solid rgba(0, 0, 0, .05);
    border-radius: 50%
}

.circle-bg {
    stroke: rgba(0, 0, 0, 0.05);
    stroke-width: 2;
    stroke-linecap: butt
}

.circle-go {
    stroke: #fff;
    stroke-width: 2;
    stroke-linecap: round;
    animation: 18s progress;
    stroke-dasharray: 360px;
    stroke-dashoffset: 360
}

.circle-tx {
    fill: #fff;
    stroke-width: 1;
    text-anchor: middle
}

.pd-80 {
    padding-top: 80px;
    padding-bottom: 80px
}

.choose-us-item {
    width: 100%;
    float: left;
    box-shadow: 1px 2px 6px rgba(0, 0, 0, .1);
    padding: 20px 15px;
    text-align: center;
    position: relative;
    margin: 10px 0;
    transition: .5s
}

.choose-img:hover::after,
.choose-us-item:hover:after {
    height: 100%;
    transition: .5s
}

.choose-us-item:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #78a94e;
    z-index: -1;
    transition: .5s
}

.choose-us-item i {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    font-size: 24px;
    border-radius: 50%;
    background-color: #78a94e;
    color: #fff;
    text-align: center;
    margin: 0 auto 10px;
    transition: .5s
}

.choose-us-item h3 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #78a94e;
    transition: .5s
}

.choose-us-item:hover h3,
.choose-us-item:hover p {
    color: #fff;
    transition: .5s
}

.choose-us-item p {
    font-size: 14px;
    color: #000;
    line-height: 1.6;
    transition: .5s
}

.choose-img {
    width: 100%;
    float: left;
    transition: .5s;
    overflow: hidden;
    position: relative
}

.choose-img::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    background-color: #79a94e41;
    z-index: 1;
    transition: .5s
}

.members::after {
    width: 100%;
    height: 350px;
    content: "";
    background-image: url(../images/bg-banner.jpg);
    background-position: center center;
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    background-attachment: fixed
}

.courses::after,
.courses::before {
    content: "";
    position: absolute;
    background-image: url(../images/dots.png);
    background-repeat: no-repeat;
    background-size: 400px;
    width: 400px;
    height: 320px
}

.choose-card:hover h3,
.color-white,
.framework-section .section-title h2,
.framework-section .section-title p,
.meeting-card:hover h3,
.member-img a,
.org-box.primary h5,
.org-box.primary p,
.resources-section .section-title h2,
.resources-section .section-title p,
.tutoring-section .section-title h2,
.tutoring-section .section-title p {
    color: #fff
}

.color-white h2 {
    color: #fff !important
}

.main-title h2 {
    font-size: 40px;
    color: #78a94e
}

.member-img {
    width: 100%;
    float: left;
    z-index: 4;
    margin-bottom: 50px
}

.courses,
.image-zoom {
    overflow: hidden;
    width: 100%;
    float: left
}

.image-zoom img {
    transform: scale(1);
    transition: .5s
}

.image-zoom:hover img {
    transform: scale(1.1);
    transition: .5s
}

.member-content {
    width: 86%;
    height: 180px;
    position: absolute;
    bottom: -9%;
    left: 7%;
    background: #78a94ef0;
    z-index: 2;
    padding: 0 10px;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center
}

.program-card-inner,
.program-icon {
    align-items: center;
    position: relative
}

.member-content h3 {
    font-size: 30px
}

.member-content h5 {
    font-size: 16px;
    text-decoration: underline
}

.member-content p {
    margin: 10px 0 0;
    font-size: 14px
}

.courses::after {
    top: 0;
    left: -80px
}

.courses::before {
    bottom: 0;
    right: -80px
}

.special-programs-section::after,
.special-programs-section::before {
    background: radial-gradient(circle, rgba(120, 169, 78, .05) 0, transparent 70%);
    border-radius: 50%;
    content: '';
    position: absolute
}

.main-title h5,
.member-img h4 {
    font-size: 18px
}

.choose-section,
.special-programs-section {
    padding: 100px 0;
    background: linear-gradient(135deg, #f8fdf4 0, #fff 50%, #f8fdf4 100%);
    position: relative;
    overflow: hidden;
    width: 100%
}

.special-programs-section::before {
    top: -50%;
    right: -10%;
    width: 500px;
    height: 500px
}

.special-programs-section::after {
    bottom: -30%;
    left: -10%;
    width: 400px;
    height: 400px
}

.special-programs-header {
    text-align: center;
    margin-bottom: 60px;
    position: relative;
    z-index: 2
}

.special-programs-header h2 {
    color: var(--primary-dark-green);
    font-weight: 800;
    font-size: 2.8rem;
    margin-bottom: 15px;
    position: relative;
    display: inline-block
}

.special-programs-header h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: var(--gradient-light);
    border-radius: 2px
}

.special-programs-header p {
    color: #666;
    font-size: 1.2rem;
    margin-top: 20px;
    margin-bottom: 0
}

.special-programs-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    position: relative;
    z-index: 2
}

.program-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .06);
    transition: .4s cubic-bezier(.4, 0, .2, 1);
    cursor: pointer
}

.program-card:hover {
    transform: translateY(-12px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .12)
}

.program-card-inner {
    width: 100%;
    height: 200px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    display: flex;
    justify-content: center;
    overflow: hidden
}

.program-icon {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 40px;
    z-index: 2;
    transition: .4s
}

.program-icon img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: .4s;
    filter: grayscale(0%)
}

.program-card:hover .program-icon img {
    transform: scale(1.1);
    filter: brightness(0) invert(1)
}

.program-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, var(--primary-dark-green) 0, var(--primary-light-green) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: scale(.8);
    transition: .4s cubic-bezier(.4, 0, .2, 1);
    z-index: 1
}

.program-card:hover .program-overlay {
    opacity: 1;
    transform: scale(1)
}

.program-overlay i {
    color: #fff;
    font-size: 3rem;
    animation: 1.5s ease-in-out infinite pulse
}

.program-name {
    padding: 20px;
    text-align: center;
    background: #fff;
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.1rem;
    border-top: 3px solid transparent;
    transition: .4s
}

.program-card:hover .program-name {
    border-top-color: var(--primary-light-green);
    background: linear-gradient(to bottom, #f8fdf4 0, #fff 100%)
}

.tutoring-course {
    width: 100%;
    float: left;
    position: relative;
    height: 450px;
    overflow: hidden;
    display: flex;
    align-items: flex-end
}

.tutoring-course::after {
    position: absolute;
    height: 100%;
    width: 100%;
    bottom: 0;
    left: 0;
    background-image: url(../images/tutor-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    content: ""
}

.contact .choose-us-item,
.course-box,
.events-timeline,
.footer-box form,
.program-image {
    position: relative
}

.course-box {
    width: 31.33%;
    float: left;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    color: #fff;
    text-align: center;
    z-index: 2;
    justify-content: center;
    transition: .5s;
    padding: 25px 15px;
    margin: 0 1%;
    background: #79a94edc
}

.contact,
.contact .choose-us-item {
    align-items: center;
    display: flex;
    color: #fff
}

.course-box h3 {
    margin: 0 0 10px;
    padding: 0
}

.course-box p {
    font-size: 16px;
    margin: 0;
    transition: .5s
}

.contact {
    width: 100%;
    float: left;
    background-image: url(../images/contact-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: left center;
    height: 90vh
}

.big-text {
    font-size: 50px !important;
    font-weight: 700
}

.contact .choose-us-item {
    background-color: transparent;
    border: 1px solid #fff;
    height: 250px;
    justify-content: center;
    margin: 10px 0;
    box-shadow: 1px 2px 6px rgba(0, 0, 0, .1);
    transition: .5s
}

.contact .choose-us-item h3 {
    margin: 0;
    color: #fff;
    position: relative;
    z-index: 4
}

.contact .choose-us-item:hover::after {
    height: 100%;
    transition: .5s;
    border: 1px solid #78a94e
}

.contact .choose-us-item::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background-color: #78a94e;
    z-index: 2;
    transition: .5s
}

.top-footer {
    width: 100%;
    float: left;
    background-color: #e6e6e6
}

.footer-box {
    width: 100%;
    float: left;
    margin: 0 0 30px
}

img.footer-logo {
    width: 120px;
    height: auto;
    margin: 0 0 20px
}

.footer-box p {
    color: #202020;
    font-size: 14px
}

.assessment-info-card ul,
.component-list,
.dates-list,
.development-card ul,
.ebrochure-content-list,
.footer-box ul,
.guideline-card ul,
.hostel-amenity-list,
.hostel-rule-points,
.infra-card ul,
.kg-curriculum-list,
.lab-features ul,
.prebooking-terms-list,
.report-section ul,
.safety-card ul,
.stream-subjects,
.structure-card ul,
.topics-list {
    padding: 0;
    margin: 0;
    list-style: none
}

.footer-box input {
    width: 100%;
    height: 50px;
    padding: 0 10px;
    color: #888
}

.footer-box button.read-btn {
    height: 40px;
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 9;
    padding: 0 15px;
    background-color: transparent
}

.footer-contact li {
    float: left;
    padding: 0 10px 0 0 !important
}

.footer-contact li:last-child {
    padding: 0 !important
}

.footer-contact li a {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #78a94e;
    color: #78a94e;
    font-size: 18px !important
}

.footer-contact li a:hover {
    color: #fff;
    background-color: #78a94e;
    transition: .5s;
    background: var(--primary-dark-green);
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(33, 48, 24, .4)
}

.bottom-footer {
    width: 100%;
    float: left;
    background-color: #c4c4c4;
    font-size: 14px
}

.academic-programs-section {
    padding: 100px 0;
    background: #fff;
    width: 100%;
    overflow: hidden
}

.section-title h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #78a94e 0, #a8d576 100%);
    border-radius: 2px
}

.view-all-btn {
    display: inline-block;
    padding: 12px 35px;
    background: #fff;
    color: #2d4a1f;
    font-weight: 700;
    border-radius: 50px;
    transition: .4s;
    margin-bottom: 40px
}

.view-all-btn:hover {
    background: #ffd93d;
    color: #2d4a1f;
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(255, 255, 255, .3)
}

.program-card-academic {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .08);
    transition: .4s;
    margin-bottom: 30px
}

.program-card-academic:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .15)
}

.program-image {
    overflow: hidden;
    height: 250px
}

.leader-image-wrapper img,
.program-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s
}

.activities-category-card:hover .activities-category-image img,
.awards-achievement-box:hover .awards-achievement-photo img,
.choose-image:hover img,
.gallery-album-card:hover .gallery-album-cover img,
.news-article-card:hover .news-article-thumb img,
.program-card-academic:hover .program-image img,
.video-card-item:hover .video-card-thumbnail img {
    transform: scale(1.1)
}

.program-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background: linear-gradient(135deg, #ffd93d 0, orange 100%);
    color: #2d4a1f;
    padding: 8px 20px;
    border-radius: 20px;
    font-size: .9rem;
    font-weight: 700;
    box-shadow: 0 5px 15px rgba(0, 0, 0, .2)
}

.activities-achievement-data,
.activities-category-content,
.activities-club-text,
.awards-achievement-body,
.gallery-album-info,
.news-article-body,
.program-info-academic,
.project-content {
    padding: 25px
}

.program-info-academic h4 {
    font-size: 1.4rem;
    font-weight: 700;
    color: #2d4a1f;
    margin-bottom: 10px
}

.program-info-academic p,
.ptm-date-card p {
    color: #666;
    font-size: .95rem;
    margin: 0
}

.tutoring-section {
    padding: 100px 0;
    background: linear-gradient(135deg, #2d4a1f 0, #78a94e 100%)
}

.tutoring-card {
    background: rgba(255, 255, 255, .15);
    border: 2px solid rgba(255, 255, 255, .2);
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    color: #fff;
    transition: .4s;
    margin-bottom: 30px
}

.tutoring-card:hover {
    background: rgba(255, 255, 255, .25);
    transform: translateY(-10px);
    border-color: rgba(255, 255, 255, .5)
}

.tutoring-icon {
    width: 80px;
    height: 80px;
    background: rgba(255, 255, 255, .2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2rem;
    transition: .4s
}

.choose-icon,
.meeting-icon {
    align-items: center;
    color: #fff;
    transition: .4s;
    position: relative;
    z-index: 2
}

.choose-card:hover .choose-icon,
.meeting-card:hover .meeting-icon,
.tutoring-card:hover .tutoring-icon {
    background: #fff;
    color: #78a94e;
    transform: rotate(360deg)
}

.tutoring-card h3 {
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 15px
}

.tutoring-card p {
    font-size: 1.1rem;
    margin: 0;
    opacity: .9;
    line-height: 1.7
}

.activities-calendar-section,
.activities-cultural-section,
.activities-events-section,
.awards-recognition-section,
.awards-timeline-section,
.descriptors-section,
.ebrochure-main-section,
.electives-section,
.extra-programs-section,
.holidays-section,
.hostel-amenities-section,
.hostel-rules-section,
.kg-features-section,
.location-section,
.meeting-section,
.outcomes-section,
.planner-section,
.policies-section,
.prebooking-benefits-section,
.qualifications-section,
.schedule-section,
.tips-section,
.values-section,
.video-playlist-section {
    padding: 100px 0;
    background: linear-gradient(135deg, #f8fdf4 0, #fff 100%)
}

.meeting-card {
    background: #fff;
    border-radius: 20px;
    padding: 50px 40px;
    text-align: center;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .08);
    transition: .4s;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden
}

.meeting-card::before,
.meeting-icon {
    background: linear-gradient(135deg, #78a94e 0, #a8d576 100%)
}

.meeting-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    transition: .5s;
    z-index: 0
}

.activities-gallery-photo.tall img,
.choose-card:hover::before,
.meeting-card:hover::before {
    height: 100%
}

.choose-card:hover,
.meeting-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(120, 169, 78, .25)
}

.meeting-icon {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    margin: 0 auto 25px;
    font-size: 2.5rem;
    box-shadow: 0 10px 30px rgba(120, 169, 78, .3)
}

.card-icon,
.choose-icon {
    display: flex;
    font-size: 2rem
}

.meeting-card h3 {
    font-size: 1.8rem;
    font-weight: 700;
    color: #2d4a1f;
    position: relative;
    z-index: 2;
    transition: .4s
}

.section-title h2 {
    color: #2d4a1f;
    position: relative;
    display: inline-block
}

.section-title p {
    margin-top: 25px
}

.choose-card {
    background: #fff;
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .08);
    margin-bottom: 30px;
    transition: .4s;
    position: relative;
    overflow: hidden
}

.choose-card::before,
.choose-icon {
    background: linear-gradient(135deg, #78a94e 0, #a8d576 100%)
}

.choose-card::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    transition: .5s;
    z-index: 0
}

.choose-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    justify-content: center;
    margin: 0 auto 20px;
    box-shadow: 0 8px 20px rgba(120, 169, 78, .3)
}

.choose-card h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #2d4a1f;
    margin-bottom: 15px;
    position: relative;
    z-index: 2;
    transition: .4s
}

.choose-card p {
    color: #666;
    line-height: 1.7;
    margin: 0;
    position: relative;
    z-index: 2;
    transition: .4s
}

.choose-card:hover p {
    color: rgba(255, 255, 255, .95)
}

.choose-image {
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .15);
    border: 8px solid #fff;
    position: relative
}

.choose-image img {
    width: 100%;
    transition: transform .8s
}

.hero-section {
    background: var(--gradient-green);
    padding: 250px 0 230px;
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center
}

.hero-section::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--black);
    top: 0;
    right: 0;
    opacity: .7
}

.hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    animation: 1s fadeInUp
}

.hero-section h1 {
    color: #fff;
    font-size: 4rem;
    font-weight: 800;
    margin-bottom: 20px;
    letter-spacing: -1px
}

.hero-section .highlight {
    background: var(--gradient-light);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text
}

.hero-section p {
    color: rgba(255, 255, 255, .9);
    font-size: 1.4rem;
    font-weight: 300;
    letter-spacing: .5px
}

.stats-section.aboutSection {
    background: #fff;
    padding: 60px 0;
    margin-top: -40px;
    position: relative;
    z-index: 3
}

.stats-container {
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .1);
    padding: 40px
}

.activities-sport-details,
.gallery-caption,
.stat-item {
    text-align: center;
    padding: 20px
}

.stat-number {
    background: var(--gradient-light);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 10px
}

.about-section,
.activities-achievements-section,
.activities-categories-section,
.activities-clubs-section,
.assessment-types-section,
.assignment-types-section,
.awards-category-section,
.cocurricular-section,
.curriculum-section,
.department-section,
.digital-resources-section,
.ebrochure-request-section,
.exam-structure-section,
.facilities-section,
.faq-section,
.framework-section,
.gallery-albums-section,
.guidelines-section,
.highlights-section,
.hostel-dining-section,
.hostel-staff-section,
.hostel-types-section,
.kg-admission-section,
.learning-section,
.methodology-section,
.news-latest-section,
.online-access-section,
.parent-section,
.recognition-section,
.report-structure-section,
.transport-section,
.why-choose-section {
    padding: 100px 0;
    background: #fafafa
}

.about-section h2 {
    color: var(--primary-dark-green);
    font-weight: 800;
    font-size: 2.8rem;
    margin-bottom: 30px;
    line-height: 1.2
}

.about-section p {
    color: #555;
    line-height: 1.9;
    font-size: 1.1rem;
    font-weight: 400;
    margin-bottom: 20px
}

.about-section .lead-text,
.activities-intro-text .activities-subtitle,
.hostel-intro-content .hostel-subtitle,
.intro-content .subtitle,
.intro-text .lead,
.intro-text .subtitle,
.kg-overview-text .kg-subtitle,
.overview-text .tagline {
    font-size: 1.3rem;
    color: var(--primary-light-green);
    font-weight: 600;
    margin-bottom: 25px
}

.about-image-wrapper {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 25px 50px rgba(0, 0, 0, .15);
    transition: transform .5s
}

.about-image-wrapper:hover {
    transform: scale(1.02)
}

.about-image-wrapper img {
    width: 100%;
    display: block;
    height: 650px;
    object-fit: cover
}

.about-image-wrapper::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(45deg, transparent, rgba(255, 255, 255, .1), transparent);
    transform: rotate(45deg);
    transition: .5s
}

.about-image-wrapper:hover::before {
    left: 100%
}

.academic-overview-section,
.achievements-intro-section,
.achievements-section,
.activities-gallery-section,
.activities-sports-section,
.activities-testimonials-section,
.activities-welcome-section,
.admin-section,
.assessment-info-section,
.assessment-intro-section,
.assessment-section,
.awards-fame-section,
.awards-recent-section,
.board-results-section,
.calendar-intro-section,
.calendar-section,
.campus-intro-section,
.co-scholastic-section,
.curriculum-intro-section,
.development-section,
.ebrochure-content-section,
.faculty-intro-section,
.gallery-highlights-section,
.gallery-section,
.grading-section,
.hall-of-fame-section,
.homework-intro-section,
.hostel-accommodation-section,
.hostel-admission-section,
.hostel-fees-section,
.hostel-safety-section,
.hostel-welcome-section,
.important-dates-section,
.indicators-section,
.infrastructure-section,
.kg-curriculum-section,
.kg-overview-section,
.labs-section,
.leadership-section,
.lesson-plan-section,
.library-section,
.methodology-section,
.mission-vision-section,
.news-blog-section,
.news-featured-section,
.objectives-section,
.portal-section,
.prebooking-form-section,
.prebooking-intro-section,
.profile-intro-section,
.programs-section,
.progress-intro-section,
.projects-section,
.ptm-section,
.report-card-section,
.resources-intro-section,
.resources-section,
.safety-section,
.sample-report-section,
.streams-section,
.subjects-overview-section,
.subjects-section,
.syllabus-intro-section,
.timeline-section,
.tips-section,
.video-featured-section,
.video-tour-section {
    padding: 100px 0;
    background: #fff
}

.section-title {
    text-align: center;
    margin-bottom: 70px
}

.section-title h2 {
    color: var(--primary-dark-green);
    font-weight: 800;
    font-size: 2.8rem;
    margin-bottom: 15px
}

.section-title p {
    color: #666;
    font-size: 1.1rem
}

.modern-card {
    background: #fff;
    border-radius: 20px;
    padding: 50px 40px;
    height: 100%;
    border: 1px solid #eee;
    transition: .4s cubic-bezier(.4, 0, .2, 1);
    position: relative;
    overflow: hidden
}

.card-icon,
.modern-card::before,
.team-image-wrapper::before {
    background: var(--gradient-light)
}

.modern-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .4s
}

.modern-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 30px 60px rgba(0, 0, 0, .12)
}

.curriculum-card:hover::before,
.fame-card:hover::before,
.framework-pillar:hover::before,
.highlight-card:hover::before,
.modern-card:hover::before,
.value-card:hover::after {
    transform: scaleX(1)
}

.card-icon {
    width: 70px;
    height: 70px;
    border-radius: 15px;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
    color: #fff
}

.leader-position,
.modern-btn {
    font-size: 1.1rem;
    font-weight: 600
}

.modern-card h3 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.8rem;
    margin-bottom: 20px
}

.modern-card p {
    color: #666;
    line-height: 1.8;
    font-size: 1.05rem
}

.org-section,
.team-section {
    padding: 100px 0;
    background: linear-gradient(180deg, #fafafa 0, #fff 100%)
}

.team-card {
    background: #fff;
    border-radius: 20px;
    padding: 30px;
    text-align: center;
    transition: .4s;
    border: 1px solid #f0f0f0;
    height: 100%;
    margin-bottom: 30px
}

.team-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .1);
    border-color: var(--primary-light-green)
}

.team-image-wrapper {
    position: relative;
    width: 150px;
    height: 150px;
    margin: 0 auto 25px
}

.team-image-wrapper img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid #f0f0f0;
    transition: .4s
}

.team-card:hover .team-image-wrapper img {
    border-color: var(--primary-light-green);
    transform: scale(1.05)
}

.team-image-wrapper::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    opacity: 0;
    transition: opacity .4s;
    z-index: -1
}

.team-card:hover .team-image-wrapper::before {
    opacity: .2;
    transform: scale(1.1)
}

.awards-category-info h5,
.fame-card h5,
.gallery-album-info h5,
.kg-step-content h5,
.team-card h4,
.timeline-content h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: 8px
}

.team-card p {
    color: var(--primary-light-green);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0
}

.cta-section {
    background: var(--gradient-green);
    padding: 100px 0;
    position: relative;
    overflow: hidden
}

.cta-section::before {
    content: "";
    position: absolute;
    width: 600px;
    height: 600px;
    background: var(--primary-light-green);
    border-radius: 50%;
    top: -300px;
    right: -200px;
    opacity: .08
}

.cta-content {
    position: relative;
    z-index: 2;
    text-align: center
}

.cta-section h2 {
    color: #fff;
    font-weight: 800;
    font-size: 3rem;
    margin-bottom: 20px
}

.cta-section p {
    color: rgba(255, 255, 255, .9);
    font-size: 1.3rem;
    margin-bottom: 40px;
    font-weight: 300
}

.modern-btn {
    background: var(--gradient-light);
    color: #fff;
    padding: 18px 50px;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    transition: .3s;
    box-shadow: 0 10px 30px rgba(120, 169, 78, .3);
    display: inline-flex;
    align-items: center;
    gap: 10px
}

.leader-position,
.social-icon {
    color: var(--primary-light-green)
}

.modern-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 40px rgba(120, 169, 78, .4)
}

.modern-btn i {
    transition: transform .3s
}

.modern-btn:hover i {
    transform: translateX(5px)
}

.leader-card {
    background: #fff;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .08);
    margin-bottom: 40px
}

.leader-card:hover {
    box-shadow: 0 20px 50px rgba(0, 0, 0, .12)
}

.leader-image-wrapper {
    position: relative;
    height: 400px;
    overflow: hidden
}

.activities-sport-item:hover .activities-sport-photo img,
.leader-card:hover .leader-image-wrapper img {
    transform: scale(1.05)
}

.leader-social {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
    opacity: 0;
    transition: opacity .3s
}

.activities-gallery-photo:hover .activities-gallery-caption,
.gallery-photo-item:hover .gallery-photo-overlay,
.gallery-photo-item:hover .gallery-photo-zoom,
.leader-card:hover .leader-social {
    opacity: 1
}

.social-icon {
    width: 40px;
    height: 40px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s
}

.social-icon:hover {
    background: var(--primary-light-green);
    color: #fff;
    transform: translateY(-3px)
}

.leader-content,
.type-body {
    padding: 35px
}

.leader-content h3 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.8rem;
    margin-bottom: 8px
}

.leader-position {
    margin-bottom: 20px;
    display: block
}

.activities-intro-text p,
.hostel-intro-content p,
.intro-content p,
.intro-text p,
.kg-overview-text p,
.leader-bio,
.overview-text p {
    color: #666;
    line-height: 1.8;
    margin-bottom: 20px
}

.credential-badge,
.dept-info h4 {
    color: var(--primary-dark-green)
}

.leader-credentials {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px
}

.credential-badge {
    background: #f8fdf4;
    padding: 6px 15px;
    border-radius: 20px;
    font-size: .85rem;
    font-weight: 500;
    border: 1px solid #e8f5e1
}

.leader-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    padding-top: 20px;
    border-top: 2px solid #f0f0f0
}

.admin-card,
.department-card {
    padding: 30px;
    background: #fff
}

.ebrochure-info,
.ebrochure-stat,
.stat-item {
    text-align: center
}

.stat-number {
    color: var(--primary-light-green);
    font-weight: 700;
    font-size: 1.5rem;
    display: block
}

.stat-label,
.stat-sublabel {
    color: #888;
    font-size: .85rem;
    margin-top: 5px
}

.department-card {
    border-radius: 16px;
    display: flex;
    align-items: center;
    gap: 25px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .06);
    transition: .3s;
    margin-bottom: 25px;
    height: 100%
}

.department-card:hover {
    transform: translateX(5px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, .1)
}

.dept-image {
    width: 120px;
    height: 120px;
    border-radius: 15px;
    overflow: hidden;
    flex-shrink: 0;
    border: 3px solid #f0f0f0;
    transition: border-color .3s
}

.admin-card:hover .admin-avatar,
.department-card:hover .dept-image,
.faq-item:hover,
.timeline-content:hover {
    border-color: var(--primary-light-green)
}

.activities-achievement-img img,
.activities-club-visual img,
.activities-cultural-banner img,
.activities-event-picture img,
.activities-testimonial-photo img,
.admin-avatar img,
.dept-image img,
.faculty-image img,
.gallery-highlight-banner img,
.news-blog-image img,
.news-featured-image img,
.video-featured-frame img,
.video-playlist-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.activities-intro-pic,
.activities-intro-text,
.activities-testimonial-content,
.awards-category-info,
.content-spacer,
.dept-info,
.event-details,
.hostel-intro-content,
.hostel-intro-image,
.intro-content,
.intro-image,
.intro-text,
.intro-visual,
.kg-overview-image,
.kg-overview-text,
.news-blog-text,
.overview-text {
    flex: 1
}

.dept-info h4 {
    font-weight: 600;
    font-size: 1.3rem;
    margin-bottom: 5px
}

.dept-role {
    color: var(--primary-light-green);
    font-weight: 600;
    font-size: .95rem;
    margin-bottom: 12px;
    display: block
}

.dept-info p {
    color: #666;
    font-size: .95rem;
    line-height: 1.6;
    margin-bottom: 10px
}

.dept-contact {
    display: flex;
    gap: 15px;
    margin-top: 15px
}

.contact-link {
    color: #888;
    font-size: .9rem;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: color .3s
}

.achievement-year,
.activities-club-meta i,
.admin-designation,
.admin-email:hover,
.co-area-item i,
.component-item h5 i,
.contact-link:hover,
.faq-question h5 i,
.gallery-album-meta i,
.meta-item i,
.month-header h4 i,
.news-blog-author i,
.news-featured-meta i,
.performance-summary h5 i,
.program-highlights h4 i,
.report-section h5 i,
.subject-item h5 i,
.subject-topics h5 i,
.teacher-remarks h5 i,
.topics-section h5 i,
.toppers-list h5 i,
.type-components h5 i,
.video-card-stats i,
.video-featured-meta i,
.video-playlist-info i {
    color: var(--primary-light-green)
}

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

.admin-card {
    border: 2px solid #f0f0f0;
    border-radius: 16px;
    text-align: center;
    transition: .3s
}

.admin-card:hover,
.descriptor-card:hover,
.elective-card:hover,
.extra-program-card:hover,
.hostel-staff-member:hover,
.overview-stat:hover {
    border-color: var(--primary-light-green);
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, .08)
}

.admin-avatar {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin: 0 auto 20px;
    overflow: hidden;
    border: 3px solid #f0f0f0;
    transition: border-color .3s
}

.admin-card h5 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.15rem;
    margin-bottom: 5px
}

.admin-designation {
    font-weight: 500;
    font-size: .9rem;
    margin-bottom: 15px;
    display: block
}

.admin-email {
    color: #888;
    font-size: .85rem;
    display: block
}

.grading-container,
.org-chart {
    max-width: 1000px;
    margin: 0 auto
}

.org-level {
    margin-bottom: 40px
}

.org-level-title {
    text-align: center;
    color: var(--primary-light-green);
    font-weight: 600;
    font-size: .9rem;
    margin-bottom: 25px
}

.activities-cta-buttons,
.download-buttons,
.hostel-cta-buttons,
.kg-cta-buttons,
.org-row,
.resource-buttons,
.tour-buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap
}

.org-box {
    background: #fff;
    border: 2px solid var(--primary-light-green);
    border-radius: 12px;
    padding: 20px 25px;
    text-align: center;
    min-width: 200px;
    position: relative;
    transition: .3s
}

.org-box.primary,
.quote-section {
    background: var(--gradient-green)
}

.org-box:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 30px rgba(120, 169, 78, .2)
}

.org-box.primary {
    border-color: var(--primary-dark-green)
}

.activities-calendar-details h6,
.activities-testimonial-author,
.org-box h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.1rem;
    margin-bottom: 5px
}

.activities-calendar-details p,
.activities-sport-details p,
.awards-recognition-card p,
.hostel-staff-member p,
.org-box p,
.resource-card p {
    color: #666;
    font-size: .9rem;
    margin: 0
}

.quote-section {
    padding: 80px 0;
    position: relative;
    overflow: hidden
}

.quote-section::before {
    content: "";
    position: absolute;
    width: 400px;
    height: 400px;
    background: rgba(255, 255, 255, .05);
    border-radius: 50%;
    top: -200px;
    right: -100px
}

.quote-container {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 2
}

.quote-icon {
    font-size: 4rem;
    color: rgba(255, 255, 255, .2);
    margin-bottom: 20px
}

.quote-text {
    color: #fff;
    font-size: 1.5rem;
    line-height: 1.8;
    font-weight: 300;
    font-style: italic;
    margin-bottom: 25px
}

.info-table,
.method-step:last-child {
    margin-bottom: 0
}

.quote-author {
    color: #fff;
    font-weight: 600;
    font-size: 1.1rem
}

.quote-position {
    color: rgba(255, 255, 255, .8);
    font-size: .95rem
}

.disclosure-section {
    padding: 80px 0;
    background: #fff
}

.disclosure-section:nth-child(2n) {
    background: #fafafa
}

.disclosure-header {
    background: var(--gradient-green);
    color: #fff;
    padding: 20px 30px;
    border-radius: 12px 12px 0 0;
    display: flex;
    align-items: center;
    gap: 15px
}

.disclosure-header-icon {
    width: 50px;
    height: 50px;
    background: rgba(255, 255, 255, .2);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem
}

.document-links,
.stats-cards {
    display: grid;
    margin-top: 20px;
    gap: 20px
}

.disclosure-header h3 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700
}

.disclosure-content {
    background: #fff;
    padding: 40px;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .08)
}

.info-table {
    width: 100%
}

.info-table tbody tr {
    border-bottom: 1px solid #f0f0f0
}

.assessment-info-card ul li:last-child,
.component-list li:last-child,
.dates-list li:last-child,
.development-card li:last-child,
.grading-table tbody tr:last-child td,
.guideline-card li:last-child,
.hostel-amenity-list li:last-child,
.hostel-rule-points li:last-child,
.info-row:last-child,
.info-table tbody tr:last-child,
.infra-card li:last-child,
.kg-curriculum-list li:last-child,
.lab-features li:last-child,
.prebooking-terms-list li:last-child,
.report-section li:last-child,
.safety-card li:last-child,
.schedule-table tbody tr:last-child td,
.stream-subjects li:last-child,
.structure-card li:last-child,
.topics-list li:last-child,
.topper-item:last-child {
    border-bottom: none
}

.doc-link-card:hover,
.stat-card:hover {
    border-color: var(--primary-light-green)
}

.info-table tbody td {
    padding: 18px 20px;
    vertical-align: middle
}

.info-table tbody td:first-child {
    font-weight: 600;
    color: var(--primary-dark-green);
    width: 40%
}

.info-table tbody td:last-child {
    color: #666
}

.stats-cards {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr))
}

.stat-card:hover {
    box-shadow: 0 8px 20px rgba(0, 0, 0, .08)
}

.library-stat h4,
.stat-value {
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary-light-green);
    margin-bottom: 8px
}

.doc-info h4,
.stat-label {
    color: var(--primary-dark-green)
}

.stat-label {
    letter-spacing: .5px
}

.document-links {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr))
}

.doc-link-card {
    background: #fff;
    border: 2px solid #f0f0f0;
    border-radius: 12px;
    padding: 25px;
    display: flex;
    align-items: center;
    gap: 20px;
    transition: .3s
}

.doc-link-card:hover {
    transform: translateX(5px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, .08)
}

.doc-icon {
    width: 60px;
    height: 60px;
    background: var(--gradient-light);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    color: #fff;
    flex-shrink: 0
}

.doc-info h4 {
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 5px
}

.doc-info p {
    color: #888;
    font-size: .85rem;
    margin: 0
}

.doc-arrow {
    margin-left: auto;
    color: var(--primary-light-green);
    font-size: 1.5rem
}

.download-full-btn,
.infra-item h5 {
    color: var(--primary-dark-green);
    font-weight: 600
}

.infrastructure-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px
}

.infra-item {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-left: 4px solid var(--primary-light-green);
    border-radius: 10px;
    padding: 20px;
    transition: .3s
}

.infra-item:hover {
    transform: translateX(5px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, .08)
}

.infra-item h5 {
    font-size: 1rem;
    margin-bottom: 10px
}

.infra-item p {
    color: var(--primary-light-green);
    font-weight: 700;
    font-size: 1.3rem;
    margin: 0
}

.infra-item span {
    color: #888;
    font-size: .85rem;
    font-weight: 400
}

.download-section {
    text-align: center;
    background: var(--gradient-green)
}

.download-section h3 {
    color: #fff;
    font-weight: 700;
    font-size: 1.8rem;
    margin-bottom: 20px
}

.download-section p {
    color: rgba(255, 255, 255, .9);
    margin-bottom: 30px
}

.download-full-btn {
    background: #fff;
    padding: 15px 40px;
    border: none;
    border-radius: 10px;
    font-size: 1.1rem;
    cursor: pointer;
    transition: .3s;
    display: inline-flex;
    align-items: center;
    gap: 10px
}

.download-btn:hover,
.download-full-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2)
}

.note-section {
    background: #fff9e6;
    border-left: 4px solid #ffc107;
    padding: 20px 25px;
    border-radius: 8px;
    margin-top: 30px
}

.note-section i {
    color: #ffc107;
    font-size: 1.3rem;
    margin-right: 10px
}

.note-section p {
    color: #666;
    margin: 0;
    display: inline;
    line-height: 1.6
}

.profile-intro-content {
    display: flex;
    align-items: center;
    gap: 50px
}

.intro-image,
.overview-image {
    flex: 1;
    position: relative
}

.hostel-intro-image img,
.intro-image img,
.intro-visual img,
.overview-image img {
    width: 100%;
    border-radius: 20px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .1)
}

.intro-badge {
    position: absolute;
    bottom: 30px;
    left: 30px;
    background: var(--gradient-green);
    color: #fff;
    padding: 20px 30px;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2)
}

.timeline-dot,
.timeline-line {
    left: 50%;
    transform: translateX(-50%)
}

.intro-badge h4 {
    font-size: 2rem;
    font-weight: 800;
    margin: 0 0 5px
}

.intro-badge p {
    margin: 0;
    font-size: .9rem;
    opacity: .9
}

.activities-intro-text h2,
.hostel-intro-content h2,
.intro-content h2,
.intro-text h2,
.kg-overview-text h2,
.overview-text h2 {
    color: var(--primary-dark-green);
    font-weight: 800;
    font-size: 2.8rem;
    margin-bottom: 20px;
    line-height: 1.2
}

.achievement-carousel,
.highlight-grid,
.values-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
    gap: 30px;
    margin-top: 40px
}

.highlight-card {
    background: #fff;
    border-radius: 16px;
    padding: 35px 25px;
    text-align: center;
    border: 2px solid #f0f0f0;
    transition: .3s;
    position: relative;
    overflow: hidden
}

.highlight-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--gradient-light);
    transform: scaleX(0);
    transition: transform .3s
}

.curriculum-card::before,
.fame-card::before,
.value-card::after {
    width: 100%;
    height: 5px;
    transition: transform .3s;
    left: 0;
    content: ''
}

.access-card:hover,
.activities-achievement-box:hover,
.activities-club-card:hover,
.awards-achievement-box:hover,
.curriculum-card:hover,
.exam-card:hover,
.facility-card:hover,
.fame-card:hover,
.gallery-album-card:hover,
.highlight-card:hover,
.hostel-room-option:hover,
.kg-feature-card:hover,
.news-article-card:hover,
.prebooking-benefit-card:hover,
.resource-card:hover,
.type-card:hover,
.video-card-item:hover {
    border-color: var(--primary-light-green);
    transform: translateY(-8px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .1)
}

.highlight-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2rem;
    color: var(--primary-light-green)
}

.cocurricular-card h5,
.elective-card h5,
.highlight-card h4,
.hostel-safety-card h5,
.policy-card h5,
.transport-card h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.2rem;
    margin-bottom: 12px
}

.cocurricular-card p,
.extra-program-card p,
.fame-card p,
.highlight-card p,
.hostel-fee-note p,
.hostel-safety-card p,
.policy-card p,
.project-content p,
.tip-content p,
.transport-card p,
.why-choose-item p {
    color: #666;
    font-size: .95rem;
    line-height: 1.6;
    margin: 0
}

.methodology-timeline,
.timeline-wrapper {
    position: relative;
    max-width: 900px;
    margin: 50px auto 0
}

.timeline-line {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--primary-light-green) 0, var(--primary-dark-green) 100%)
}

.calendar-download,
.calendar-download p,
.curriculum-card,
.download-btn,
.framework-pillar,
.method-step,
.step-number-box,
.subject-header,
.subject-icon-large,
.subject-level,
.timeline-item,
.value-card {
    position: relative
}

.timeline-item {
    display: flex;
    justify-content: space-between
}

.awards-fame-item:nth-child(2n),
.timeline-item:nth-child(2n),
.timeline-item:nth-child(2n) {
    flex-direction: row-reverse
}

.timeline-content {
    box-shadow: 0 5px 20px rgba(0, 0, 0, .08)
}

.timeline-year {
    display: inline-block;
    background: var(--gradient-light);
    color: #fff;
    padding: 8px 20px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 15px
}

.timeline-content h4 {
    color: var(--primary-dark-green)
}

.activities-achievement-data p,
.activities-category-content p,
.facility-card p,
.hostel-room-option p,
.hostel-step-details p,
.kg-feature-card p,
.kg-step-content p,
.methodology-card p,
.prebooking-benefit-card p,
.qualification-card p,
.recognition-card p,
.timeline-content p,
.type-card p {
    color: #666;
    margin: 0;
    line-height: 1.6
}

.timeline-dot {
    background: var(--primary-light-green);
    box-shadow: 0 0 0 4px #e8f5e1
}

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

.value-card::after {
    position: absolute;
    bottom: 0;
    background: var(--gradient-light);
    transform: scaleX(0)
}

.value-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .12)
}

.value-number {
    font-size: 3rem;
    font-weight: 800;
    color: var(--primary-light-green);
    opacity: .2;
    margin-bottom: 15px
}

.hostel-safety-icon,
.value-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2rem;
    color: #fff
}

.curriculum-card h4,
.outcome-card h4,
.value-card h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.4rem;
    margin-bottom: 15px
}

.activities-event-description p,
.awards-fame-content p,
.component-item p,
.detail-card p,
.faq-answer p,
.framework-pillar p,
.indicator-card p,
.learning-card p,
.objective-card p,
.outcome-card p,
.parent-card p,
.step-content p,
.teacher-remarks p,
.timeline-content p,
.value-card p,
.video-featured-info p {
    color: #666;
    line-height: 1.7;
    margin: 0
}

.achievement-card,
.day-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 16px;
    padding: 30px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.achievement-card:hover,
.stream-block:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .1);
    border-color: var(--primary-light-green)
}

.achievement-badge {
    width: 60px;
    height: 60px;
    background: var(--gradient-light);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    font-size: 1.8rem;
    color: #fff
}

.achievement-card h5,
.activities-achievement-data h5,
.project-content h6 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.2rem;
    margin-bottom: 10px
}

.achievement-card p,
.activities-club-text p,
.event-description {
    color: #666;
    margin-bottom: 15px;
    line-height: 1.6
}

.activities-cta-section,
.activities-stats-section,
.affiliations-section,
.booking-section,
.campus-stats-section,
.download-section,
.faculty-stats-section,
.features-section,
.framework-section,
.hostel-cta-section,
.hostel-statistics-section,
.kg-cta-section,
.news-subscribe-section,
.philosophy-section,
.resources-section,
.stats-section,
.tour-section {
    padding: 80px 0;
    background: var(--gradient-green)
}

.affiliation-box,
.why-choose-item {
    background: #fff;
    padding: 25px;
    transition: .3s
}

.affiliation-logos {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px;
    flex-wrap: wrap;
    margin-top: 40px
}

.affiliation-box {
    width: 180px;
    height: 180px;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .15)
}

.affiliation-box:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .2)
}

.affiliation-box i {
    font-size: 3.5rem;
    color: var(--primary-light-green);
    margin-bottom: 15px
}

.affiliation-box h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1rem;
    text-align: center;
    margin: 0
}

.why-choose-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    margin-top: 40px
}

.why-choose-item {
    border-radius: 12px;
    display: flex;
    align-items: flex-start;
    gap: 20px;
    border: 2px solid #f0f0f0
}

.why-choose-item:hover {
    border-color: var(--primary-light-green);
    transform: translateX(5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, .08)
}

.why-icon {
    width: 50px;
    height: 50px;
    background: var(--gradient-light);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #fff;
    flex-shrink: 0
}

.why-choose-item h5 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 8px
}

.activities-intro-layout,
.hostel-intro-layout,
.intro-layout,
.kg-overview-layout,
.overview-content {
    display: flex;
    align-items: center;
    gap: 60px
}

.curriculum-grid,
.fame-grid,
.learning-methods {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
    gap: 30px;
    margin-top: 50px
}

.curriculum-card {
    background: #fff;
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    border: 2px solid #f0f0f0;
    transition: .3s;
    overflow: hidden
}

.curriculum-card::before,
.fame-card::before {
    position: absolute;
    top: 0;
    background: var(--gradient-light);
    transform: scaleX(0)
}

.curriculum-icon,
.exam-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    font-size: 2.2rem;
    color: var(--primary-light-green)
}

.achievement-description,
.activities-cultural-info p,
.assessment-card p,
.curriculum-card p,
.gallery-highlight-content p,
.lab-card p,
.news-blog-text p,
.video-playlist-details p {
    color: #666;
    line-height: 1.7;
    margin-bottom: 20px
}

.curriculum-badge {
    display: inline-block;
    background: var(--gradient-light);
    color: #fff;
    padding: 6px 15px;
    border-radius: 20px;
    font-size: .85rem;
    font-weight: 600
}

.program-tabs {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 50px;
    flex-wrap: wrap
}

.program-tab {
    background: #fff;
    border: 2px solid #e0e0e0;
    padding: 15px 35px;
    border-radius: 12px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: .3s
}

.awards-category-tab:hover,
.class-tab:hover,
.dept-tab:hover,
.filter-tab:hover,
.gallery-category-tab:hover,
.lab-tab:hover,
.program-tab:hover,
.term-tab:hover,
.video-category-filter:hover {
    border-color: var(--primary-light-green);
    color: var(--primary-dark-green)
}

.awards-category-tab.active,
.class-tab.active,
.dept-tab.active,
.filter-tab.active,
.gallery-category-tab.active,
.lab-tab.active,
.program-tab.active,
.term-tab.active,
.video-category-filter.active {
    background: var(--gradient-light);
    border-color: var(--primary-light-green);
    color: #fff
}

.achievement-container,
.class-container,
.faculty-container,
.footerSocial-media a::before,
.homework-container,
.lab-container,
.program-content,
.subjects-container,
.term-container,
input[type=file] {
    display: none
}

.achievement-container.active,
.class-container.active,
.faculty-container.active,
.homework-container.active,
.lab-container.active,
.program-content.active,
.subjects-container.active,
.term-container.active {
    display: block;
    animation: .5s fadeIn
}

.program-detail-card {
    background: #fff;
    border-radius: 20px;
    padding: 50px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .08)
}

.learning-card,
.outcome-card {
    box-shadow: 0 8px 25px rgba(0, 0, 0, .06)
}

.program-header {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 35px;
    padding-bottom: 25px;
    border-bottom: 3px solid #f0f0f0
}

.program-icon-large {
    width: 80px;
    height: 80px;
    background: var(--gradient-light);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    color: #fff
}

.program-header-text h3 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 2rem;
    margin-bottom: 5px
}

.program-header-text span {
    color: var(--primary-light-green);
    font-weight: 600;
    font-size: 1.1rem
}

.subjects-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 35px
}

.subject-box {
    background: linear-gradient(135deg, #f8fdf4 0, #fff 100%);
    padding: 20px;
    border-radius: 12px;
    border-left: 4px solid var(--primary-light-green);
    transition: .3s
}

.subject-box:hover,
.subject-item:hover {
    transform: translateX(8px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, .08)
}

.subject-box h5 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 10px
}

.assessment-info-card ul li i,
.equipment-item i,
.exam-weightage strong,
.subject-box h5 i,
.subject-name i {
    color: var(--primary-light-green);
    font-size: 1.2rem
}

.subject-box p {
    color: #666;
    font-size: .9rem;
    margin: 0;
    line-height: 1.5
}

.program-highlights {
    background: #f8fdf4;
    padding: 30px;
    border-radius: 12px;
    border: 2px solid #e8f5e1
}

.program-highlights h4 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.3rem;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px
}

.equipment-grid,
.highlights-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px
}

.highlight-item {
    display: flex;
    align-items: center;
    gap: 12px
}

.contact-item i,
.highlight-item i,
.hostel-feature-point i {
    color: var(--primary-light-green);
    font-size: 1.3rem
}

.date-name,
.equipment-item span,
.highlight-item span,
.hostel-feature-point span,
.topper-name {
    color: #555;
    font-weight: 500
}

.learning-card {
    background: #fff;
    border-radius: 16px;
    padding: 35px 30px;
    transition: .3s
}

.learning-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .1)
}

.learning-number {
    width: 45px;
    height: 45px;
    background: var(--gradient-light);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 20px
}

.learning-card h4,
.qualification-card h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: 15px
}

.activities-testimonial-slider,
.assessment-container,
.hostel-admission-steps,
.hostel-rules-container,
.kg-admission-container,
.objectives-container,
.planner-timeline,
.portal-container,
.ptm-container,
.sample-card-container,
.schedule-container,
.tips-container,
.video-tour-container {
    max-width: 1000px;
    margin: 50px auto 0
}

.assessment-types,
.awards-category-content,
.hostel-rules-grid,
.objectives-grid,
.report-sections {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px
}

.assessment-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 16px;
    padding: 35px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.assessment-card:hover,
.awards-recognition-card:hover,
.hostel-safety-card:hover,
.methodology-card:hover,
.policy-card:hover,
.qualification-card:hover,
.recognition-card:hover,
.stat-card:hover,
.transport-card:hover {
    border-color: var(--primary-light-green);
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .08)
}

.assessment-header,
.lab-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px
}

.assessment-icon,
.class-icon,
.ebrochure-content-icon,
.guideline-icon,
.hostel-amenity-symbol,
.hostel-rule-icon,
.indicator-icon,
.infra-icon,
.parent-icon,
.safety-icon,
.structure-icon {
    width: 60px;
    height: 60px;
    background: var(--gradient-light);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    color: #fff
}

.assessment-card h4,
.category-header h4,
.co-scholastic-card h4,
.day-name h5,
.development-card h4,
.ebrochure-content-card h5,
.guideline-card h4,
.hostel-amenity-block h4,
.hostel-rule-category h4,
.indicator-card h4,
.infra-card h4,
.lab-card h4,
.parent-card h4,
.safety-card h4,
.structure-card h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.4rem;
    margin: 0
}

.assessment-details,
.lab-features {
    background: #fff;
    padding: 20px;
    border-radius: 10px
}

.assessment-details ul {
    margin: 0;
    padding-left: 20px
}

.assessment-details li {
    color: #555;
    margin-bottom: 10px;
    line-height: 1.6
}

.extra-programs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
    gap: 25px;
    margin-top: 40px
}

.awards-recognition-card,
.cocurricular-card,
.elective-card,
.extra-program-card,
.hostel-staff-member,
.transport-card {
    background: #fff;
    border-radius: 16px;
    padding: 30px 25px;
    border: 2px solid #f0f0f0;
    transition: .3s;
    text-align: center
}

.extra-icon,
.policy-icon,
.transport-icon {
    width: 70px;
    height: 70px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2rem;
    color: var(--primary-light-green)
}

.extra-program-card h5 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.2rem;
    margin-bottom: 12px
}

.calendar-download {
    background: var(--gradient-green);
    border-radius: 20px;
    padding: 60px 50px;
    text-align: center;
    color: #fff;
    overflow: hidden
}

.calendar-download::before {
    content: '';
    position: absolute;
    width: 400px;
    height: 400px;
    background: rgba(255, 255, 255, .08);
    border-radius: 50%;
    top: -200px;
    right: -150px
}

.calendar-download h3 {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 15px;
    position: relative;
    z-index: 2
}

.calendar-download p {
    font-size: 1.1rem;
    margin-bottom: 30px;
    opacity: .95;
    z-index: 2
}

.download-btn {
    color: var(--primary-dark-green);
    display: inline-flex;
    align-items: center;
    z-index: 2
}

.ebrochure-stat-number,
.pillar-icon,
.stat-box h3 {
    font-size: 2.5rem;
    color: var(--primary-light-green)
}

.intro-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-top: 35px
}

.stat-box {
    padding: 20px;
    background: linear-gradient(135deg, #f8fdf4 0, #fff 100%);
    border-radius: 12px;
    border: 2px solid #e8f5e1
}

.ebrochure-stat-number,
.stat-box h3 {
    font-weight: 800;
    margin-bottom: 5px
}

.library-stat p,
.overview-stat p,
.stat-box p,
.stat-card p {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: .95rem;
    margin: 0
}

.category-header h3,
.framework-pillar h4 {
    font-weight: 700;
    color: var(--primary-dark-green)
}

.framework-container {
    max-width: 1100px;
    margin: 0 auto
}

.access-grid,
.activities-achievements-grid,
.activities-category-grid,
.activities-clubs-wrapper,
.awards-achievement-grid,
.exam-cards,
.facilities-grid,
.framework-section .framework-grid,
.gallery-albums-grid,
.hostel-room-grid,
.hostel-safety-features,
.kg-features-grid,
.methodology-grid,
.news-articles-grid,
.policies-grid,
.prebooking-benefits-grid,
.qualifications-grid,
.recognition-grid,
.resources-grid,
.stream-blocks,
.transport-grid,
.types-grid,
.video-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px
}

.framework-pillar {
    background: #fff;
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    border: 2px solid #f0f0f0;
    transition: .4s;
    overflow: hidden
}

.framework-pillar::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 6px;
    background: var(--gradient-light);
    transform: scaleX(0);
    transition: transform .4s
}

.framework-pillar:hover {
    border-color: var(--primary-light-green);
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .1)
}

.pillar-icon {
    width: 90px;
    height: 90px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px
}

.framework-pillar h4 {
    font-size: 1.5rem;
    margin-bottom: 15px
}

.subject-categories {
    margin-top: 50px
}

.category-block {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 40px;
    margin-bottom: 30px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.category-block:hover,
.day-card:hover,
.detail-card:hover {
    border-color: var(--primary-light-green);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .08)
}

.category-header {
    display: flex;
    align-items: center;
    gap: 20px
}

.category-icon-box,
.kg-curriculum-symbol,
.plan-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-light);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #fff
}

.category-header h3 {
    font-size: 1.8rem;
    margin: 0
}

.subject-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px
}

.subject-item {
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    border-left: 4px solid var(--primary-light-green);
    transition: .3s
}

.subject-item h5 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.15rem;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px
}

.awards-achievement-body p,
.elective-card p,
.news-article-body p,
.subject-item p {
    color: #666;
    font-size: .95rem;
    line-height: 1.6;
    margin-bottom: 15px
}

.subject-tags,
.topics-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.subject-tag {
    background: #f8fdf4;
    color: var(--primary-dark-green);
    padding: 4px 12px;
    border-radius: 15px;
    font-size: .8rem;
    font-weight: 500;
    border: 1px solid #e8f5e1
}

.co-scholastic-grid,
.dates-grid,
.development-cards,
.ebrochure-content-grid,
.guidelines-grid,
.hostel-amenity-blocks,
.indicators-grid,
.infrastructure-grid,
.labs-grid,
.outcomes-grid,
.parent-grid,
.safety-grid,
.structure-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 50px
}

.outcome-card {
    background: #fff;
    border-radius: 16px;
    padding: 35px;
    transition: .3s
}

.outcome-number,
.step-number-box {
    background: var(--gradient-light);
    display: flex;
    font-weight: 800;
    color: #fff
}

.outcome-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .1)
}

.outcome-number {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 20px
}

.method-step {
    display: flex;
    gap: 30px;
    margin-bottom: 50px
}

.step-number-box {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    flex-shrink: 0;
    box-shadow: 0 8px 20px rgba(120, 169, 78, .25);
    z-index: 2
}

.step-content {
    flex: 1;
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    padding: 30px;
    border-radius: 15px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.event-card:hover,
.step-content:hover {
    border-color: var(--primary-light-green);
    transform: translateX(5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, .08)
}

.exam-card h4,
.step-content h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.4rem;
    margin-bottom: 12px
}

.cocurricular-grid,
.electives-grid,
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
    gap: 25px;
    margin-top: 50px
}

.cocurricular-card:hover {
    border-color: var(--primary-light-green);
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .1)
}

.cocurricular-icon,
.qual-icon {
    width: 75px;
    height: 75px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2rem;
    color: var(--primary-light-green)
}

.assessment-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 35px;
    margin-top: 50px
}

.assessment-info-card,
.development-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.assessment-info-card:hover,
.co-scholastic-card:hover,
.development-card:hover,
.objective-card:hover {
    border-color: var(--primary-light-green);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .1)
}

.assessment-info-header,
.dev-header,
.indicator-header,
.parent-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px
}

.assessment-info-icon,
.dev-icon,
.lab-icon-box {
    width: 65px;
    height: 65px;
    background: var(--gradient-light);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #fff
}

.activities-cultural-info h4,
.assessment-info-card h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.5rem;
    margin: 0
}

.assessment-info-card ul li,
.development-card li,
.stream-subjects li {
    color: #666;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 12px
}

.lab-card:hover,
.topic-tag:hover {
    border-color: var(--primary-light-green)
}

.booking-container,
.download-container,
.resources-container {
    text-align: center;
    max-width: 800px;
    margin: 0 auto
}

.activities-cta-content h3,
.booking-container h3,
.download-container h3,
.hostel-cta-wrapper h3,
.kg-cta-wrapper h3,
.resources-container h3,
.tour-container h3 {
    color: #fff;
    font-weight: 700;
    font-size: 2.2rem;
    margin-bottom: 15px
}

.activities-cta-content p,
.booking-container p,
.download-container p,
.hostel-cta-wrapper p,
.kg-cta-wrapper p,
.news-subscribe-wrapper p,
.resources-container p,
.tour-container p {
    color: rgba(255, 255, 255, .95);
    font-size: 1.1rem;
    margin-bottom: 35px
}

.resource-btn {
    background: #fff;
    color: var(--primary-dark-green);
    padding: 15px 35px;
    border: none;
    border-radius: 10px;
    font-size: 1.05rem;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    display: inline-flex;
    align-items: center;
    gap: 10px
}

.download-btn:hover,
.resource-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .2)
}

.activities-sports-grid,
.awards-recognition-grid,
.hostel-staff-grid,
.overview-grid,
.resources-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin-top: 50px
}

.overview-stat {
    background: linear-gradient(135deg, #f8fdf4 0, #fff 100%);
    border: 2px solid #e8f5e1;
    border-radius: 16px;
    padding: 30px 20px;
    text-align: center;
    transition: .3s
}

.library-stat-icon,
.stat-icon {
    width: 60px;
    height: 60px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
    font-size: 1.8rem;
    color: #fff
}

.overview-stat h3,
.stat-card h3 {
    color: var(--primary-light-green);
    font-size: 2.5rem;
    font-weight: 800;
    margin-bottom: 8px
}

.class-tabs,
.department-tabs,
.filter-tabs,
.gallery-category-tabs,
.lab-tabs,
.term-tabs,
.video-category-filters {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap
}

.awards-category-tab,
.class-tab,
.filter-tab,
.lab-tab,
.video-category-filter {
    background: #fff;
    border: 2px solid #e0e0e0;
    padding: 12px 28px;
    border-radius: 25px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: .3s;
    font-size: .95rem
}

.achievements-grid-section,
.calendar-events-section,
.faculty-grid-section,
.labs-content-section,
.subjects-grid-section,
.syllabus-content-section {
    padding: 60px 0 100px;
    background: #fafafa
}

.achievements-grid,
.subjects-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 30px
}

.subject-icon-large,
.subject-topics h5 {
    margin-bottom: 15px;
    display: flex;
    align-items: center
}

.achievement-card,
.faculty-card,
.subject-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .08);
    transition: .4s;
    border: 2px solid transparent
}

.activities-category-card:hover,
.subject-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .12);
    border-color: var(--primary-light-green)
}

.subject-header {
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    overflow: hidden
}

.subject-header::before,
.type-header::before {
    content: '';
    position: absolute;
    width: 200px;
    height: 200px;
    background: rgba(255, 255, 255, .05);
    border-radius: 50%;
    top: -100px;
    right: -50px
}

.subject-icon-large {
    width: 70px;
    height: 70px;
    background: rgba(255, 255, 255, .15);
    border-radius: 15px;
    justify-content: center;
    font-size: 2.2rem;
    color: #fff;
    z-index: 2
}

.subject-level {
    color: var(--primary-light-green);
    font-weight: 600;
    font-size: .9rem;
    z-index: 2;
    display: none
}

.achievement-content,
.activities-cultural-info,
.gallery-highlight-content,
.subject-body,
.video-playlist-details {
    padding: 30px
}

.subject-description {
    color: #666;
    line-height: 1.7;
    margin-bottom: 25px;
    font-size: .98rem
}

.subject-topics h5,
.topic-tag {
    color: var(--primary-dark-green)
}

.prebooking-form-group,
.subject-info,
.subject-topics,
.topics-section,
.type-components {
    margin-bottom: 25px
}

.subject-topics h5 {
    font-weight: 600;
    font-size: 1.05rem;
    gap: 8px
}

.topic-tag {
    background: #f8fdf4;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: .85rem;
    font-weight: 500;
    border: 1px solid #e8f5e1;
    transition: .3s
}

.topic-tag:hover {
    background: var(--primary-light-green);
    color: #fff
}

.co-areas,
.subject-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .9rem;
    color: #555
}

.component-list li i,
.development-card li i,
.feature-item i,
.lab-features li i,
.stream-subjects li i {
    color: var(--primary-light-green);
    font-size: 1.1rem
}

.stream-block {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 40px 30px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.elective-icon,
.stream-icon {
    border-radius: 50%;
    align-items: center;
    display: flex
}

.stream-icon {
    width: 75px;
    height: 75px;
    background: var(--gradient-light);
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2.2rem;
    color: #fff
}

.elective-icon,
.stream-subtitle {
    color: var(--primary-light-green)
}

.stream-block h3 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.6rem;
    text-align: center;
    margin-bottom: 10px
}

.stream-subtitle {
    text-align: center;
    font-weight: 600;
    margin-bottom: 25px;
    font-size: .95rem
}

.elective-icon {
    width: 65px;
    height: 65px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 1.8rem
}

.availability-badge {
    display: inline-block;
    background: var(--gradient-light);
    color: #fff;
    padding: 5px 15px;
    border-radius: 15px;
    font-size: .8rem;
    font-weight: 600
}

.co-scholastic-card,
.date-category,
.ebrochure-content-card,
.indicator-card,
.infra-card,
.lab-card,
.objective-card,
.safety-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 35px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.lab-card:hover {
    box-shadow: 0 12px 30px rgba(0, 0, 0, .1)
}

.lab-features li {
    padding: 10px 0;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #555
}

.faculty-stats-section .stat-item h3,
.faculty-stats-section .stat-item p,
.footer-box input[type=text]::placeholder {
    color: var(--black)
}

.activities-stats-wrapper,
.awards-stats-grid,
.features-grid,
.hostel-stats-wrapper,
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px
}

.activities-stat-box,
.awards-stat-block,
.feature-box,
.framework-item,
.hostel-stat-item,
.philosophy-item,
.stat-box,
.stat-item {
    text-align: center;
    color: #fff
}

.stat-icon {
    background: rgba(255, 255, 255, .15);
    display: flex;
    align-items: center;
    justify-content: center
}

.faculty-image,
.faculty-placeholder {
    align-items: center;
    position: relative
}

.stat-item h3 {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 10px
}

.stat-item p {
    font-size: 1.05rem;
    opacity: .95;
    margin: 0
}

.class-filter-section,
.department-filter-section,
.filter-section,
.lab-filter-section,
.term-filter-section {
    padding: 60px 0 40px;
    background: #fafafa;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .05)
}

.dept-tab,
.filter-tab,
.term-tab {
    background: #fff;
    border: 2px solid #e0e0e0;
    padding: 12px 30px;
    border-radius: 25px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: .3s;
    font-size: .95rem
}

.faculty-name,
.leader-card h4 {
    font-weight: 700;
    margin-bottom: 8px
}

.faculty-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 30px
}

.achievement-card:hover,
.faculty-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .12);
    border-color: var(--primary-light-green)
}

.faculty-image {
    width: 100%;
    height: 280px;
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    display: flex;
    justify-content: center;
    overflow: hidden
}

.faculty-image::before {
    content: '';
    position: absolute;
    width: 200px;
    height: 200px;
    background: rgba(255, 255, 255, .05);
    border-radius: 50%;
    top: -50px;
    right: -50px
}

.faculty-placeholder {
    width: 120px;
    height: 120px;
    background: rgba(255, 255, 255, .15);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    font-size: 3.5rem;
    color: #fff;
    z-index: 2
}

.faculty-info {
    padding: 30px 25px
}

.faculty-name {
    color: var(--primary-dark-green);
    font-size: 1.4rem
}

.detail-item i,
.faculty-designation {
    color: var(--primary-light-green);
    font-size: 1rem
}

.faculty-designation {
    font-weight: 600;
    margin-bottom: 15px
}

.ebrochure-form-group,
.faculty-details {
    margin-bottom: 20px
}

.detail-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    color: #666;
    font-size: .9rem
}

.intro-content h2,
.leader-card h4,
.month-header h4,
.spec-tag {
    color: var(--primary-dark-green)
}

.faculty-specialization {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 15px
}

.spec-tag {
    background: #f8fdf4;
    padding: 5px 12px;
    border-radius: 15px;
    font-size: .8rem;
    font-weight: 500;
    border: 1px solid #e8f5e1
}

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

.leader-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    transition: .3s;
    text-align: center
}

.leader-card:hover {
    border-color: var(--primary-light-green);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .1);
    transform: translateY(-5px)
}

.leader-image {
    width: 150px;
    height: 150px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    font-size: 4rem;
    color: #fff;
    box-shadow: 0 10px 30px rgba(120, 169, 78, .25)
}

.leader-card h4 {
    font-size: 1.6rem
}

.leader-title {
    color: var(--primary-light-green);
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 20px
}

.leader-bio {
    color: #666;
    line-height: 1.7;
    font-size: .95rem
}

.methodology-card,
.qualification-card,
.recognition-card {
    background: #fff;
    border-radius: 16px;
    padding: 35px 30px;
    text-align: center;
    border: 2px solid #f0f0f0;
    transition: .3s
}

.activities-cta-content,
.download-container,
.hostel-cta-wrapper,
.intro-content,
.kg-cta-wrapper,
.tour-container {
    max-width: 900px;
    margin: 0 auto;
    text-align: center
}

.intro-content h2 {
    font-weight: 800;
    font-size: 2.8rem;
    margin-bottom: 20px
}

.calendar-year-badge {
    display: inline-block;
    background: var(--gradient-light);
    color: #fff;
    padding: 12px 35px;
    border-radius: 30px;
    font-size: 1.2rem;
    font-weight: 700;
    margin-top: 20px
}

.quick-stats-section {
    padding: 80px 0;
    background: linear-gradient(135deg, #f8fdf4 0, #fff 100%)
}

.framework-grid,
.lesson-grid .framework-grid,
.philosophy-grid,
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px
}

.policy-card,
.stat-card {
    background: #fff;
    border-radius: 16px;
    padding: 30px 25px;
    text-align: center;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.stat-icon {
    background: var(--gradient-light);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff
}

.class-header,
.homework-header,
.term-header {
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    color: #fff;
    padding: 40px;
    border-radius: 20px;
    margin-bottom: 40px;
    text-align: center;
    position: relative;
    overflow: hidden
}

.class-header::before,
.homework-header::before,
.term-header::before {
    content: '';
    position: absolute;
    width: 300px;
    height: 300px;
    background: rgba(255, 255, 255, .05);
    border-radius: 50%;
    top: -150px;
    right: -100px
}

.term-header h3 {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 10px;
    position: relative;
    z-index: 2
}

.term-duration {
    font-size: 1.1rem;
    opacity: .95;
    position: relative;
    z-index: 2
}

.month-section {
    margin-bottom: 50px
}

.month-header {
    background: #fff;
    padding: 20px 30px;
    border-radius: 15px;
    border-left: 5px solid var(--primary-light-green);
    box-shadow: 0 5px 15px rgba(0, 0, 0, .05)
}

.month-header h4 {
    font-weight: 700;
    font-size: 1.5rem;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 12px
}

.events-list {
    display: grid;
    gap: 20px
}

.event-card {
    background: #fff;
    border-radius: 16px;
    padding: 25px;
    display: flex;
    gap: 25px;
    border: 2px solid #f0f0f0;
    transition: .3s
}

.event-date-box {
    background: var(--gradient-light);
    color: #fff;
    border-radius: 12px;
    padding: 15px 20px;
    text-align: center;
    min-width: 80px;
    height: fit-content
}

.event-day {
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 5px
}

.event-month {
    font-size: .9rem;
    font-weight: 600;
    opacity: .95
}

.event-title,
.hostel-step-details h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: 10px
}

.event-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 15px
}

.category-header,
.meta-item {
    align-items: center;
    display: flex
}

.meta-item {
    gap: 8px
}

.event-tag {
    background: #f8fdf4;
    color: var(--primary-dark-green);
    padding: 5px 15px;
    border-radius: 15px;
    font-size: .85rem;
    font-weight: 600;
    border: 1px solid #e8f5e1
}

.event-tag.holiday {
    background: #fff3e0;
    color: #e65100;
    border-color: #ffe0b2
}

.event-tag.exam {
    background: #e3f2fd;
    color: #1565c0;
    border-color: #bbdefb
}

.event-tag.event {
    background: #f3e5f5;
    color: #6a1b9a;
    border-color: #e1bee7
}

.download-btn:hover,
.footer-box h4 {
    color: var(--black)
}

.awards-category-card:hover,
.date-category:hover,
.ebrochure-content-card:hover,
.guideline-card:hover,
.hostel-amenity-block:hover,
.hostel-rule-category:hover,
.indicator-card:hover,
.infra-card:hover,
.news-blog-post:hover,
.parent-card:hover,
.safety-card:hover,
.structure-card:hover {
    border-color: var(--primary-light-green);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .08)
}

.category-header {
    gap: 15px;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e8f5e1
}

.category-icon {
    width: 55px;
    height: 55px;
    background: var(--gradient-light);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    color: #fff
}

.dates-list li {
    padding: 15px 0;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.date-value {
    color: var(--primary-light-green);
    font-weight: 700
}

.activities-cta-btn,
.download-btn,
.download-btn-white,
.hostel-cta-btn,
.kg-cta-btn,
.tour-btn {
    background: #fff;
    color: var(--primary-dark-green);
    padding: 15px 35px;
    border: none;
    border-radius: 10px;
    font-size: 1.05rem;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none
}

.download-btn i,
.submit-btn i {
    font-size: 1.3rem
}

.holidays-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 50px
}

.holiday-card {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    border: 2px solid #f0f0f0;
    transition: .3s
}

.holiday-card:hover {
    border-color: var(--primary-light-green);
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, .06)
}

.holiday-card .date {
    color: var(--primary-light-green);
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 8px
}

.footer,
.footer-box ul li a::before,
.holiday-card .name {
    color: var(--primary-dark-green)
}

.holiday-card .name {
    font-weight: 600;
    font-size: 1.05rem
}

.footer {
    background: var(--gradient-light);
    margin-top: auto
}

.top-footer {
    padding: 60px 0 40px
}

.footer-logo {
    max-width: 180px;
    margin-bottom: 20px
}

.footer-box {
    margin-bottom: 30px
}

.footer-box h4 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 25px;
    position: relative;
    padding-bottom: 12px
}

.footer-box h4::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 50px;
    height: 3px;
    background: var(--primary-dark-green);
    border-radius: 2px
}

.footer-box input[type=text],
.footer-contact li a {
    background: rgba(255, 255, 255, .1);
    color: var(--black);
    backdrop-filter: blur(10px);
    transition: .3s
}

.footer-box p {
    color: var(--black);
    line-height: 1.8;
    margin-bottom: 20px
}

.footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 15px
}

.footer-contact li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 50%
}

.footer-box ul li {
    margin-bottom: 12px
}

.footer-box ul li a {
    color: var(--black);
    font-size: 15px;
    transition: .3s;
    display: inline-block;
    position: relative;
    padding-left: 18px
}

.footer-box ul li a::before {
    content: '▸';
    position: absolute;
    left: 0;
    transition: .3s
}

.footer-box ul li a:hover {
    color: var(--primary-light-green);
    padding-left: 25px
}

.footer-box form {
    display: flex;
    gap: 10px;
    margin-top: 20px
}

.footer-box input[type=text] {
    flex: 1;
    padding: 12px 18px;
    border: 2px solid rgba(255, 255, 255, .2);
    border-radius: 8px;
    font-size: 14px
}

.footer-box input[type=text]:focus {
    outline: 0;
    border-color: var(--primary-dark-green);
    background: rgba(255, 255, 255, .15)
}

.bottom-footer {
    background: rgba(0, 0, 0, .2);
    padding: 25px 0;
    border-top: 1px solid rgba(255, 255, 255, .1)
}

.bottom-footer p {
    margin: 0;
    color: rgba(255, 255, 255, .8);
    text-align: center;
    font-size: 14px
}

.type-header h3,
.type-icon {
    color: #fff;
    position: relative;
    z-index: 2
}

.footerSocial-media a {
    display: flex !important;
    justify-content: center !important;
    margin: auto;
    padding: 0 !important
}

.framework-icon,
.philosophy-icon {
    width: 80px;
    height: 80px;
    background: rgba(255, 255, 255, .15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2rem
}

.feature-box h4,
.framework-item h4,
.philosophy-item h4 {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 12px
}

.framework-item p,
.philosophy-item p {
    font-size: .95rem;
    opacity: .95;
    line-height: 1.6;
    margin: 0
}

.activities-cultural-showcase,
.assessment-types-section .types-grid,
.gallery-highlight-grid,
.hostel-type-cards,
.results-grid,
.video-playlists-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    margin-top: 50px
}

.type-card {
    overflow: hidden;
    box-shadow: 0 10px 35px rgba(0, 0, 0, .08)
}

.type-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 45px rgba(0, 0, 0, .12);
    border-color: var(--primary-light-green)
}

.component-list li,
.grading-table tbody td,
.report-section li {
    border-bottom: 1px solid #f0f0f0
}

.type-header {
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    padding: 35px;
    position: relative;
    overflow: hidden
}

.type-icon {
    background: rgba(255, 255, 255, .15);
    display: flex;
    align-items: center;
    justify-content: center
}

.type-header h3 {
    font-weight: 700;
    font-size: 1.8rem;
    margin-bottom: 10px
}

.type-header p {
    color: var(--primary-light-green);
    font-weight: 600;
    margin: 0;
    position: relative;
    z-index: 2
}

.type-description {
    color: #666;
    line-height: 1.7;
    margin-bottom: 25px
}

.report-section h5,
.topics-section h5,
.toppers-list h5,
.type-components h5 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px
}

.component-list li {
    padding: 12px 0;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #555
}

.weightage-badge {
    background: var(--gradient-light);
    color: #fff;
    padding: 10px 25px;
    border-radius: 25px;
    font-weight: 700;
    font-size: 1rem;
    display: inline-block
}

.grading-table-wrapper {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    margin-top: 50px
}

.grade-badge,
.grading-table thead th {
    background: var(--gradient-light);
    color: #fff
}

.grading-table,
.hostel-fee-table,
.schedule-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0
}

.grading-table thead th {
    padding: 18px 20px;
    font-weight: 600;
    font-size: 1rem;
    text-align: center
}

.grading-table thead th:first-child,
.hostel-fee-table thead th:first-child,
.schedule-table thead th:first-child {
    border-radius: 12px 0 0
}

.grading-table thead th:last-child,
.marks-table thead th:last-child,
.schedule-table thead th:last-child {
    border-radius: 0 12px 0 0
}

.grading-table tbody td {
    padding: 18px 20px;
    text-align: center;
    color: #555
}

.faq-question:hover,
.grading-table tbody tr:hover,
.marks-table tbody tr:hover,
.schedule-table tbody tr:hover {
    background: #f8fdf4
}

.grade-a1 {
    background: linear-gradient(135deg, #2e7d32 0, #4caf50 100%)
}

.grade-a2 {
    background: linear-gradient(135deg, #388e3c 0, #66bb6a 100%)
}

.grade-b1 {
    background: linear-gradient(135deg, #1976d2 0, #42a5f5 100%)
}

.grade-b2 {
    background: linear-gradient(135deg, #1e88e5 0, #64b5f6 100%)
}

.grade-c1 {
    background: linear-gradient(135deg, #f9a825 0, #ffca28 100%)
}

.grade-c2 {
    background: linear-gradient(135deg, #fbc02d 0, #ffd54f 100%)
}

.grade-d {
    background: linear-gradient(135deg, #ff8f00 0, #ffb74d 100%)
}

.grade-e {
    background: linear-gradient(135deg, #d84315 0, #ff7043 100%)
}

.access-card,
.exam-card,
.facility-card,
.hostel-room-option,
.resource-card,
.type-card {
    background: #fff;
    border-radius: 20px;
    padding: 35px 30px;
    border: 2px solid #f0f0f0;
    transition: .3s;
    text-align: center
}

.exam-card .timing {
    color: var(--primary-light-green);
    font-weight: 600;
    font-size: .95rem;
    margin-bottom: 15px
}

.access-card p,
.exam-card p,
.resource-card p {
    color: #666;
    line-height: 1.6;
    margin-bottom: 20px
}

.exam-weightage {
    background: #f8fdf4;
    padding: 12px 20px;
    border-radius: 10px;
    border: 1px solid #e8f5e1
}

.exam-weightage span,
.hostel-fee-table tbody td:first-child {
    color: var(--primary-dark-green);
    font-weight: 600
}

.co-header,
.hostel-amenity-title,
.hostel-rule-header,
.infra-header,
.kg-curriculum-header,
.safety-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e8f5e1
}

.co-area-item,
.co-icon {
    align-items: center;
    display: flex
}

.co-icon {
    width: 60px;
    height: 60px;
    background: var(--gradient-light);
    border-radius: 14px;
    justify-content: center;
    font-size: 1.8rem;
    color: #fff
}

.co-area-item {
    background: #fff;
    padding: 12px 15px;
    border-radius: 8px;
    gap: 10px;
    color: #555;
    font-size: .95rem
}

.descriptors-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    margin-top: 50px
}

.descriptor-card {
    background: #fff;
    border-radius: 16px;
    padding: 25px 20px;
    text-align: center;
    border: 2px solid #f0f0f0;
    transition: .3s
}

.descriptor-grade {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--primary-light-green);
    margin-bottom: 15px
}

.descriptor-label,
.hostel-menu-item h6,
.library-feature h6 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.1rem;
    margin-bottom: 10px
}

.descriptor-meaning {
    color: #666;
    font-size: .9rem;
    line-height: 1.5
}

.prebooking-terms-container,
.report-card-container {
    max-width: 900px;
    margin: 0 auto
}

.report-card-preview {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 50px;
    border: 3px solid #e8f5e1;
    margin-top: 50px
}

.report-card-header,
.report-header {
    text-align: center;
    margin-bottom: 40px;
    padding-bottom: 30px;
    border-bottom: 3px dashed #e8f5e1
}

.report-card-header h4 {
    color: var(--primary-dark-green);
    font-weight: 800;
    font-size: 1.8rem;
    margin-bottom: 10px
}

.report-card-header p {
    color: #666;
    font-size: 1rem
}

.component-item,
.ptm-date-card,
.report-section,
.teacher-remarks {
    background: #fff;
    border-radius: 12px;
    padding: 25px;
    border: 1px solid #e8f5e1
}

.report-section li {
    padding: 10px 0;
    color: #555;
    display: flex;
    align-items: center;
    gap: 10px
}

.report-section li i {
    color: var(--primary-light-green);
    font-size: .9rem
}

.faq-container,
.hostel-fee-wrapper,
.schedule-timeline {
    max-width: 900px;
    margin: 50px auto 0
}

.faq-item {
    background: #fff;
    border-radius: 16px;
    margin-bottom: 20px;
    border: 2px solid #f0f0f0;
    overflow: hidden;
    transition: .3s
}

.faq-question {
    padding: 25px 30px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    transition: .3s
}

.faq-question h5,
.faq-toggle {
    display: flex;
    align-items: center
}

.faq-question h5 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.15rem;
    margin: 0;
    gap: 15px
}

.faq-toggle {
    width: 35px;
    height: 35px;
    background: var(--gradient-light);
    border-radius: 50%;
    justify-content: center;
    color: #fff;
    font-size: 1rem;
    transition: transform .3s
}

.achievement-image,
.stat-icon {
    align-items: center;
    display: flex
}

.faq-answer {
    padding: 0 30px;
    max-height: 0;
    overflow: hidden;
    transition: .4s
}

.faq-item.active .faq-answer {
    padding: 0 30px 25px;
    max-height: 500px
}

.stat-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2.2rem
}

.awards-stat-block h3,
.stat-box h3 {
    font-size: 3.5rem;
    font-weight: 800;
    margin-bottom: 10px;
    line-height: 1
}

.activities-stat-box p,
.hostel-stat-item p,
.stat-box p {
    font-size: 1.1rem;
    opacity: .95;
    margin: 0
}

.achievement-image {
    height: 220px;
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    justify-content: center;
    position: relative;
    overflow: hidden
}

.achievement-image::before {
    content: '';
    position: absolute;
    width: 250px;
    height: 250px;
    background: rgba(255, 255, 255, .05);
    border-radius: 50%;
    top: -100px;
    right: -80px
}

.achievement-icon-large {
    width: 100px;
    height: 100px;
    background: rgba(255, 255, 255, .15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    color: #fff;
    position: relative;
    z-index: 2
}

.achievement-year {
    position: absolute;
    top: 20px;
    right: 20px;
    background: var(--primary-light-green);
    color: #fff;
    padding: 8px 20px;
    border-radius: 20px;
    font-weight: 700;
    font-size: .9rem;
    z-index: 2
}

.achievement-title {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.4rem;
    margin-bottom: 12px;
    line-height: 1.3
}

.achievement-meta,
.activities-cultural-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

.meta-tag {
    background: #f8fdf4;
    color: var(--primary-dark-green);
    padding: 6px 15px;
    border-radius: 15px;
    font-size: .85rem;
    font-weight: 600;
    border: 1px solid #e8f5e1
}

.meta-tag.gold {
    background: linear-gradient(135deg, gold 0, #ffed4e 100%);
    color: #8b6914;
    border-color: gold
}

.meta-tag.silver {
    background: linear-gradient(135deg, silver 0, #e8e8e8 100%);
    color: #555;
    border-color: silver
}

.meta-tag.bronze {
    background: linear-gradient(135deg, #cd7f32 0, #e6a157 100%);
    color: #6b4423;
    border-color: #cd7f32
}

.kg-curriculum-block,
.result-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.activities-cultural-block:hover,
.activities-event-card:hover,
.gallery-highlight-card:hover,
.hostel-type-block:hover,
.kg-curriculum-block:hover,
.result-card:hover,
.video-playlist-card:hover {
    border-color: var(--primary-light-green);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .1)
}

.result-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
    padding-bottom: 25px;
    border-bottom: 3px solid #e8f5e1
}

.day-name,
.month-name,
.result-class {
    display: flex;
    align-items: center;
    gap: 15px
}

.kg-curriculum-block h4,
.plan-header h4,
.result-class h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.6rem;
    margin: 0
}

.result-year {
    background: var(--gradient-light);
    color: #fff;
    padding: 10px 25px;
    border-radius: 20px;
    font-weight: 700
}

.result-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 25px
}

.stat-item {
    text-align: center;
    background: #fff;
    padding: 20px 15px;
    border-radius: 12px;
    border: 1px solid #e8f5e1
}

.stat-value {
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--primary-light-green);
    margin-bottom: 5px
}

.stat-label,
.summary-label {
    color: #666;
    font-size: .9rem;
    font-weight: 500
}

.toppers-list {
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #e8f5e1
}

.topper-item {
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.gallery-item:hover,
.timeline-content:hover {
    border-color: var(--primary-light-green);
    transform: scale(1.03)
}

.topper-score {
    background: var(--gradient-light);
    color: #fff;
    padding: 4px 15px;
    border-radius: 15px;
    font-weight: 700;
    font-size: .9rem
}

.awards-fame-timeline,
.timeline-container {
    max-width: 1000px;
    margin: 50px auto 0;
    position: relative
}

.timeline-content {
    width: 45%;
    background: #fff;
    padding: 30px;
    border-radius: 16px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .08);
    border: 2px solid #f0f0f0;
    transition: .3s
}

.timeline-year-badge {
    display: inline-block;
    background: var(--gradient-light);
    color: #fff;
    padding: 8px 25px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 15px
}

.access-card h5,
.activities-category-content h5,
.activities-club-text h5,
.facility-card h5,
.hostel-room-option h5,
.kg-feature-card h5,
.methodology-card h5,
.prebooking-benefit-card h5,
.recognition-card h5,
.resource-card h5,
.timeline-content h4,
.type-card h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: 12px
}

.timeline-dot {
    position: absolute;
    top: 30px;
    width: 24px;
    height: 24px;
    background: var(--primary-light-green);
    border: 5px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 5px #e8f5e1;
    z-index: 2
}

.fame-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 35px 30px;
    text-align: center;
    border: 2px solid #e8f5e1;
    transition: .3s;
    position: relative;
    overflow: hidden
}

.fame-avatar {
    width: 100px;
    height: 100px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 3rem;
    color: #fff;
    box-shadow: 0 10px 30px rgba(120, 169, 78, .25)
}

.fame-achievement {
    color: var(--primary-light-green);
    font-weight: 600;
    margin-bottom: 15px
}

.access-icon,
.facility-icon,
.hostel-room-symbol,
.methodology-icon,
.recognition-icon,
.resource-icon,
.type-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2.2rem;
    color: var(--primary-light-green)
}

.gallery-image,
.subject-header {
    align-items: center;
    display: flex
}

.gallery-item {
    background: #f8fdf4;
    border-radius: 16px;
    overflow: hidden;
    border: 2px solid #e8f5e1;
    transition: .3s;
    cursor: pointer
}

.gallery-item:hover {
    box-shadow: 0 12px 30px rgba(0, 0, 0, .1)
}

.info-row,
.topics-list li {
    border-bottom: 1px solid #f0f0f0
}

.gallery-image {
    height: 250px;
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    justify-content: center;
    font-size: 4rem;
    color: rgba(255, 255, 255, .3)
}

.gallery-caption h6 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.1rem;
    margin: 0
}

.class-header h3,
.homework-header h3 {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 10px;
    position: relative;
    z-index: 2
}

.class-header p,
.homework-header p {
    font-size: 1.1rem;
    opacity: .95;
    position: relative;
    z-index: 2;
    margin: 0
}

.subject-header {
    background: linear-gradient(135deg, var(--primary-light-green) 0, #8cb359 100%);
    padding: 25px 30px;
    gap: 20px
}

.subject-icon {
    width: 60px;
    height: 60px;
    background: rgba(255, 255, 255, .2);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    color: #fff
}

.subject-header h4 {
    position: relative;
    z-index: 2;
    color: #fff;
    font-weight: 700;
    font-size: 1.5rem;
    margin: 0
}

.info-row {
    display: flex;
    justify-content: space-between;
    padding: 12px 0
}

.info-value {
    color: var(--primary-dark-green);
    font-weight: 700
}

.topics-list li {
    padding: 10px 0 10px 25px;
    color: #555;
    position: relative
}

.topics-list li::before {
    content: '•';
    position: absolute;
    left: 8px;
    color: var(--primary-light-green);
    font-size: 1.2rem;
    font-weight: 700
}

.download-btn {
    background: var(--gradient-light);
    color: #fff;
    padding: 12px 25px;
    border: none;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    justify-content: center
}

.access-btn:hover,
.download-btn:hover,
.news-read-more:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(120, 169, 78, .3);
    color: #fff
}

.activities-events-timeline,
.kg-curriculum-wrapper,
.lesson-plan-container,
.location-container,
.news-blog-container {
    max-width: 1200px;
    margin: 50px auto 0
}

.lesson-plan-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    margin-bottom: 30px
}

.plan-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
    padding-bottom: 25px;
    border-bottom: 3px solid #e8f5e1
}

.plan-components,
.tips-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px
}

.component-item h5 {
    color: var(--primary-dark-green);
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 10px
}

.activities-cultural-header,
.objective-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px
}

.day-icon,
.month-icon,
.objective-number {
    width: 50px;
    height: 50px;
    align-items: center;
    color: #fff;
    display: flex
}

.objective-number {
    background: var(--gradient-light);
    border-radius: 50%;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700
}

.month-name h5,
.objective-card h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.3rem;
    margin: 0
}

.month-card {
    background: #fff;
    border-radius: 16px;
    padding: 30px;
    margin-bottom: 25px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.hostel-step-item:hover,
.kg-admission-step:hover,
.month-card:hover,
.timeline-item:hover {
    border-color: var(--primary-light-green);
    box-shadow: 0 10px 25px rgba(0, 0, 0, .08)
}

.month-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 2px solid #f0f0f0
}

.day-icon,
.month-icon {
    background: var(--gradient-light);
    border-radius: 10px;
    justify-content: center;
    font-size: 1.3rem
}

.day-date,
.month-badge {
    background: #f8fdf4;
    color: var(--primary-light-green);
    padding: 8px 20px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .9rem;
    border: 1px solid #e8f5e1
}

.month-topics {
    color: #666;
    line-height: 1.7
}

.resource-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 16px;
    padding: 30px 25px;
    text-align: center;
    border: 2px solid #e8f5e1;
    transition: .3s;
    cursor: pointer
}

.activities-sport-item:hover,
.project-card:hover,
.resource-card:hover {
    border-color: var(--primary-light-green);
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .1)
}

.resource-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
    font-size: 2rem;
    color: #fff
}

.activities-sport-details h6,
.awards-recognition-card h6,
.hostel-staff-member h6,
.ptm-date-card h6,
.resource-card h6,
.tip-content h6 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.1rem;
    margin-bottom: 8px
}

.activities-cta-btn:hover,
.booking-btn:hover,
.download-btn-white:hover,
.download-btn:hover,
.hostel-cta-btn:hover,
.kg-cta-btn:hover,
.tour-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .2);
    color: var(--primary-dark-green)
}

.class-filter-section {
    padding: 60px 0 40px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .05)
}

.class-tab,
.gallery-category-tab {
    background: #fafafa;
    border: 2px solid #e0e0e0;
    padding: 12px 28px;
    border-radius: 25px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: .3s;
    font-size: .95rem
}

.daily-homework-section,
.gallery-photos-section {
    padding: 60px 0 100px;
    background: #fff
}

.kg-admission-steps,
.weekly-planner {
    display: grid;
    gap: 25px
}

.day-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e8f5e1
}

.activities-calendar-events,
.hostel-type-features,
.subjects-homework {
    display: grid;
    gap: 15px
}

.subject-homework {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #e8f5e1
}

.subject-name {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px
}

.subject-name strong {
    color: var(--primary-dark-green);
    font-size: 1.1rem
}

.homework-details {
    color: #666;
    line-height: 1.7;
    margin-bottom: 12px
}

.homework-meta {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap
}

.gallery-album-meta,
.meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #777;
    font-size: .9rem
}

.priority-tag {
    padding: 4px 12px;
    border-radius: 12px;
    font-size: .85rem;
    font-weight: 600
}

.priority-high {
    background: #ffebee;
    color: #c62828;
    border: 1px solid #ef9a9a
}

.priority-medium {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffcc80
}

.priority-low {
    background: #f1f8e9;
    color: #558b2f;
    border: 1px solid #c5e1a5
}

.guideline-card,
.parent-card,
.structure-card {
    background: #fff;
    border-radius: 20px;
    padding: 35px;
    border: 2px solid #f0f0f0;
    transition: .3s
}

.guideline-header,
.structure-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 2px solid #f0f0f0
}

.guideline-card li {
    padding: 12px 0 12px 25px;
    border-bottom: 1px solid #f0f0f0;
    color: #555;
    position: relative
}

.guideline-card li::before {
    content: '\F26A';
    font-family: bootstrap-icons;
    position: absolute;
    left: 0;
    color: var(--primary-light-green);
    font-size: 1rem;
    font-weight: 700
}

.portal-card,
.ptm-card,
.video-tour-showcase {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    padding: 50px;
    border: 2px solid #e8f5e1;
    text-align: center
}

.portal-icon-large,
.ptm-icon-large {
    width: 120px;
    height: 120px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 30px;
    font-size: 3.5rem;
    color: #fff;
    box-shadow: 0 15px 40px rgba(120, 169, 78, .3)
}

.location-card,
.sample-card {
    box-shadow: 0 15px 40px rgba(0, 0, 0, .1)
}

.hostel-dining-header h3,
.location-header h3,
.portal-card h3,
.ptm-card h3,
.video-tour-showcase h3 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 2rem;
    margin-bottom: 15px
}

.portal-card p,
.ptm-card p {
    color: #666;
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 30px
}

.portal-features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-bottom: 35px
}

.feature-item {
    background: #fff;
    padding: 25px 20px;
    border-radius: 12px;
    border: 1px solid #e8f5e1
}

.book-ptm-btn,
.portal-btn,
.tip-number {
    background: var(--gradient-light);
    color: #fff
}

.feature-item i {
    color: var(--primary-light-green);
    font-size: 2rem;
    margin-bottom: 12px
}

.detail-header h5,
.equipment-list h5,
.feature-item h6 {
    color: var(--primary-dark-green)
}

.feature-item h6 {
    font-weight: 600;
    font-size: 1rem;
    margin: 0
}

.book-ptm-btn,
.portal-btn {
    padding: 15px 50px;
    border: none;
    border-radius: 10px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    display: inline-flex;
    align-items: center;
    gap: 12px
}

.book-ptm-btn:hover,
.direction-btn:hover,
.portal-btn:hover,
.video-tour-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(120, 169, 78, .3);
    color: #fff
}

.file-selected-display.show,
.tip-card {
    display: flex
}

.tip-card:hover {
    border-color: var(--primary-light-green);
    transform: translateX(5px)
}

.tip-number {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    flex-shrink: 0
}

.lab-showcase {
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    color: #fff;
    padding: 50px;
    border-radius: 24px;
    margin-bottom: 50px;
    position: relative;
    overflow: hidden
}

.lab-showcase::before {
    content: '';
    position: absolute;
    width: 400px;
    height: 400px;
    background: rgba(255, 255, 255, .05);
    border-radius: 50%;
    top: -200px;
    right: -150px
}

.lab-showcase-content {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 40px
}

.lab-icon-large {
    width: 120px;
    height: 120px;
    background: rgba(255, 255, 255, .15);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4rem;
    flex-shrink: 0
}

.lab-showcase-info h3 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 15px
}

.lab-showcase-info p {
    font-size: 1.15rem;
    opacity: .95;
    line-height: 1.8;
    margin: 0
}

.lab-details-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-bottom: 50px
}

.detail-card {
    background: #fff;
    border-radius: 16px;
    padding: 30px;
    border: 2px solid #f0f0f0;
    transition: .3s
}

.detail-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f0f0f0
}

.activities-cultural-symbol,
.detail-icon {
    width: 50px;
    height: 50px;
    background: var(--gradient-light);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #fff
}

.detail-header h5 {
    font-weight: 700;
    font-size: 1.2rem;
    margin: 0
}

.equipment-list {
    background: #fff;
    border-radius: 16px;
    padding: 35px;
    border: 2px solid #e8f5e1
}

.equipment-list h5 {
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    gap: 12px
}

.equipment-list h5 i {
    color: var(--primary-light-green);
    font-size: 1.5rem
}

.equipment-item {
    background: #f8fdf4;
    padding: 15px 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #e8f5e1
}

.library-showcase {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    padding: 50px;
    border: 2px solid #e8f5e1;
    margin-top: 50px
}

.library-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-bottom: 40px
}

.library-stat {
    text-align: center;
    background: #fff;
    padding: 25px 20px;
    border-radius: 12px;
    border: 1px solid #e8f5e1
}

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

.hostel-menu-item,
.library-feature {
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    border: 1px solid #e8f5e1;
    text-align: center
}

.access-btn,
.schedule-table thead th {
    background: var(--gradient-light);
    color: #fff
}

.hostel-menu-item i,
.library-feature i {
    color: var(--primary-light-green);
    font-size: 2.5rem;
    margin-bottom: 15px
}

.hostel-menu-item p,
.library-feature p {
    color: #666;
    font-size: .9rem;
    line-height: 1.6;
    margin: 0
}

.access-btn {
    padding: 10px 25px;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    display: inline-block;
    font-size: .95rem
}

.hostel-amenity-list li,
.hostel-rule-points li,
.infra-card li,
.kg-curriculum-list li,
.safety-card li,
.structure-card li {
    padding: 12px 0 12px 30px;
    border-bottom: 1px solid #f0f0f0;
    color: #555;
    position: relative;
    line-height: 1.6
}

.ebrochure-content-list li::before,
.hostel-amenity-list li::before,
.hostel-rule-points li::before,
.infra-card li::before,
.kg-curriculum-list li::before,
.safety-card li::before,
.structure-card li::before {
    content: '\F26A';
    font-family: bootstrap-icons;
    position: absolute;
    left: 0;
    color: var(--primary-light-green);
    font-size: 1.1rem
}

.prebooking-terms-box,
.schedule-card {
    background: #fff;
    border-radius: 20px;
    padding: 40px;
    border: 2px solid #e8f5e1
}

.schedule-header {
    text-align: center;
    margin-bottom: 40px;
    padding-bottom: 30px;
    border-bottom: 3px solid #e8f5e1
}

.available-slot,
.booked-slot {
    padding: 6px 12px;
    border-radius: 6px;
    font-size: .9rem;
    font-weight: 600
}

.ebrochure-request-header h4,
.schedule-header h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.8rem;
    margin-bottom: 10px
}

.schedule-header p {
    color: #666;
    font-size: 1.05rem;
    margin: 0
}

.schedule-table thead th {
    padding: 15px;
    font-weight: 600;
    text-align: center;
    font-size: 1rem
}

.marks-table tbody td,
.schedule-table tbody td {
    padding: 15px;
    text-align: center;
    border-bottom: 1px solid #f0f0f0;
    color: #555
}

.available-slot {
    background: #e8f5e1;
    color: var(--primary-dark-green)
}

.booked-slot {
    background: #ffebee;
    color: #c62828
}

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

.project-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 16px;
    overflow: hidden;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.project-image {
    height: 200px;
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4rem;
    color: rgba(255, 255, 255, .3)
}

.booking-btn,
.meta-badge,
.report-header h3 {
    color: var(--primary-dark-green)
}

.project-meta {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px
}

.meta-badge {
    background: #e8f5e1;
    padding: 5px 12px;
    border-radius: 12px;
    font-size: .85rem;
    font-weight: 600
}

.booking-btn {
    background: #fff;
    padding: 15px 50px;
    border: none;
    border-radius: 10px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    display: inline-flex;
    align-items: center;
    gap: 12px
}

.activities-stat-icon,
.feature-icon,
.hostel-stat-circle,
.school-logo {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    margin: 0 auto 20px
}

.activities-stat-icon,
.feature-icon,
.hostel-stat-circle {
    background: rgba(255, 255, 255, .15);
    border-radius: 50%;
    justify-content: center;
    font-size: 2.2rem
}

.feature-box p {
    font-size: 1rem;
    opacity: .95;
    margin: 0;
    line-height: 1.6
}

.sample-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    padding: 50px;
    border: 3px solid #e8f5e1
}

.school-logo {
    background: var(--gradient-light);
    border-radius: 50%;
    justify-content: center;
    font-size: 2.5rem;
    color: #fff
}

.report-header h3 {
    font-weight: 800;
    font-size: 2rem;
    margin-bottom: 10px
}

.hostel-dining-header p,
.report-header p {
    color: #666;
    font-size: 1.1rem;
    margin: 0
}

.student-info {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-bottom: 40px;
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    border: 1px solid #e8f5e1
}

.info-item {
    display: flex;
    gap: 10px
}

.info-label {
    color: #777;
    font-weight: 500;
    min-width: 120px
}

.marks-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: 30px
}

.marks-table thead th {
    background: var(--gradient-light);
    color: #fff;
    padding: 15px;
    font-weight: 600;
    text-align: center;
    font-size: .95rem
}

.marks-table thead th:first-child {
    border-radius: 12px 0 0;
    text-align: left
}

.marks-table tbody td:first-child {
    text-align: left;
    font-weight: 600;
    color: var(--primary-dark-green)
}

.hostel-fee-table tbody tr:last-child td,
.marks-table tbody tr:last-child td {
    border-bottom: none;
    font-weight: 700;
    background: #f8fdf4
}

.grade-badge {
    display: inline-block;
    padding: 6px 15px;
    border-radius: 15px;
    font-weight: 700;
    font-size: .9rem
}

.grade-a {
    background: linear-gradient(135deg, #2e7d32 0, #4caf50 100%);
    color: #fff
}

.grade-b {
    background: linear-gradient(135deg, #1976d2 0, #42a5f5 100%);
    color: #fff
}

.grade-c {
    background: linear-gradient(135deg, #f9a825 0, #ffca28 100%);
    color: #6b4423
}

.performance-summary {
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    border: 1px solid #e8f5e1;
    margin-bottom: 30px
}

.performance-summary h5,
.teacher-remarks h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.2rem;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px
}

.summary-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px
}

.timeline-icon,
.timeline-item {
    display: flex;
    align-items: center
}

.summary-item {
    background: #f8fdf4;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
    border: 1px solid #e8f5e1
}

.timeline-item,
.tip-card {
    padding: 30px;
    transition: .3s
}

.summary-value {
    color: var(--primary-light-green);
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 8px
}

.timeline-item {
    background: #fff;
    border-radius: 16px;
    margin-bottom: 25px;
    border: 2px solid #e8f5e1;
    gap: 30px
}

.timeline-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-light);
    border-radius: 15px;
    justify-content: center;
    font-size: 2rem;
    color: #fff;
    flex-shrink: 0
}

.ptm-date-card i,
.timeline-date {
    color: var(--primary-light-green)
}

.timeline-date {
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: 10px
}

.ptm-dates {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    margin-bottom: 35px
}

.ptm-date-card i {
    font-size: 2rem;
    margin-bottom: 15px
}

.tip-card {
    background: #fff;
    border-radius: 16px;
    border: 2px solid #e8f5e1;
    display: flex;
    gap: 20px
}

.activities-stat-box h3,
.hostel-stat-item h3,
.stat-box h3 {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 10px;
    line-height: 1
}

.location-card {
    background: #fff;
    border-radius: 24px;
    padding: 50px;
    border: 2px solid #e8f5e1
}

.hostel-dining-header,
.location-header,
.prebooking-form-header {
    text-align: center;
    margin-bottom: 40px
}

.hostel-dining-icon-large,
.location-icon-large,
.video-tour-icon {
    width: 100px;
    height: 100px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    font-size: 3rem;
    color: #fff;
    box-shadow: 0 15px 40px rgba(120, 169, 78, .3)
}

.contact-item,
.map-placeholder {
    color: var(--primary-dark-green)
}

.address-box {
    background: #f8fdf4;
    padding: 25px;
    border-radius: 12px;
    border: 1px solid #e8f5e1;
    margin-bottom: 30px
}

.address-box p {
    color: #555;
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 15px
}

.contact-info {
    display: flex;
    gap: 30px;
    flex-wrap: wrap
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 600
}

.map-container {
    height: 400px;
    background: #e8f5e1;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px
}

.map-placeholder {
    text-align: center
}

.map-placeholder i {
    font-size: 4rem;
    color: var(--primary-light-green);
    margin-bottom: 15px
}

.map-placeholder p {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0
}

.direction-btn,
.video-tour-btn {
    background: var(--gradient-light);
    color: #fff;
    padding: 15px 40px;
    border: none;
    border-radius: 10px;
    font-size: 1.05rem;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    display: inline-flex;
    align-items: center;
    gap: 12px
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-top: 50px
}

.campuses-gallery-item {
    position: relative;
    height: 280px;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s
}

.campuses-gallery-item:hover {
    transform: scale(1.05);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .2)
}

.gallery-icon {
    font-size: 5rem;
    color: rgba(255, 255, 255, .2)
}

.gallery-label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #f8fdf4;
    overflow: hidden;
    color: var(--primary-dark-green);
    border: 2px solid #e8f5e1;
    padding: 15px;
    text-align: center;
    font-weight: 600;
    font-size: 1.1rem
}

.hostel-type-block {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    padding: 50px 40px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.hostel-type-heading {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 30px;
    padding-bottom: 25px;
    border-bottom: 3px solid #e8f5e1
}

.hostel-type-symbol {
    width: 80px;
    height: 80px;
    background: var(--gradient-light);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    color: #fff
}

.hostel-type-heading h3 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 2rem;
    margin: 0
}

.hostel-type-details,
.news-featured-content p {
    color: #666;
    line-height: 1.8;
    margin-bottom: 25px
}

.hostel-feature-point {
    background: #fff;
    padding: 15px 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 15px;
    border: 1px solid #e8f5e1
}

.hostel-amenity-block,
.hostel-rule-category {
    background: #fff;
    border-radius: 20px;
    padding: 35px;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.hostel-dining-showcase,
.hostel-fee-table-container,
.hostel-safety-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%)
}

.hostel-dining-showcase {
    max-width: 1200px;
    margin: 50px auto 0;
    border-radius: 24px;
    padding: 50px;
    border: 2px solid #e8f5e1
}

.hostel-menu-highlights {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-top: 30px
}

.hostel-safety-card {
    border-radius: 16px;
    padding: 30px 25px;
    text-align: center;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.hostel-fee-table-container {
    border-radius: 20px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .08)
}

.hostel-fee-table thead th {
    background: var(--gradient-light);
    color: #fff;
    padding: 18px;
    font-weight: 600;
    text-align: left;
    font-size: 1rem
}

.hostel-fee-table thead th:last-child {
    border-radius: 0 12px 0 0;
    text-align: right
}

.hostel-fee-table tbody td {
    padding: 18px;
    border-bottom: 1px solid #f0f0f0;
    color: #555
}

.hostel-fee-table tbody td:last-child {
    text-align: right;
    font-weight: 700;
    color: var(--primary-light-green)
}

.hostel-fee-note {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #e8f5e1;
    margin-top: 25px
}

.hostel-staff-avatar {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2.5rem;
    color: var(--primary-light-green)
}

.hostel-step-item {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 16px;
    padding: 30px;
    margin-bottom: 25px;
    border: 2px solid #e8f5e1;
    display: flex;
    align-items: center;
    gap: 30px;
    transition: .3s
}

.hostel-step-number {
    width: 70px;
    height: 70px;
    background: var(--gradient-light);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0
}

.activities-intro-pic img,
.kg-overview-image img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .15)
}

.activities-category-card,
.gallery-album-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    border: 2px solid #f0f0f0;
    transition: .3s;
    cursor: pointer
}

.activities-category-image {
    width: 100%;
    height: 250px;
    overflow: hidden;
    position: relative
}

.activities-category-image img,
.activities-sport-photo img,
.awards-achievement-photo img,
.gallery-album-cover img,
.news-article-thumb img,
.video-card-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s
}

.activities-category-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, .7) 100%)
}

.activities-category-icon {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.5rem
}

.activities-sport-item,
.news-article-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    border: 2px solid #f0f0f0;
    transition: .3s
}

.activities-sport-photo {
    width: 100%;
    height: 200px;
    overflow: hidden
}

.activities-cultural-block,
.video-playlist-card {
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.activities-cultural-banner {
    width: 100%;
    height: 300px;
    overflow: hidden
}

.activities-cultural-tag {
    background: #f8fdf4;
    color: var(--primary-dark-green);
    padding: 8px 16px;
    border-radius: 20px;
    font-size: .9rem;
    font-weight: 600;
    border: 1px solid #e8f5e1
}

.activities-achievement-box,
.activities-club-card,
.awards-achievement-box {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    border: 2px solid #f0f0f0;
    transition: .3s
}

.activities-club-visual {
    width: 100%;
    height: 220px;
    overflow: hidden;
    position: relative
}

.activities-club-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: var(--gradient-light);
    color: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .85rem
}

.activities-club-meta {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #777;
    font-size: .9rem
}

.activities-gallery-masonry {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 50px
}

.activities-gallery-photo {
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    transition: .3s;
    position: relative
}

.activities-gallery-photo:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2)
}

.activities-gallery-photo img,
.gallery-photo-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.activities-gallery-photo.tall,
.gallery-photo-item.tall {
    grid-row: span 2
}

.activities-gallery-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, .8) 0, transparent 100%);
    color: #fff;
    padding: 20px 15px 15px;
    font-weight: 600;
    opacity: 0;
    transition: opacity .3s
}

.activities-event-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 40px;
    border: 2px solid #e8f5e1;
    display: flex;
    gap: 0;
    transition: .3s
}

.activities-event-picture {
    width: 45%;
    height: 350px;
    overflow: hidden
}

.activities-event-description {
    flex: 1;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.activities-event-month {
    display: inline-block;
    background: var(--gradient-light);
    color: #fff;
    padding: 6px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .9rem;
    margin-bottom: 15px;
    width: fit-content
}

.activities-event-description h4,
.ebrochure-info h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.8rem;
    margin-bottom: 15px
}

.activities-achievement-img,
.awards-achievement-photo {
    width: 100%;
    height: 280px;
    overflow: hidden
}

.activities-achievement-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff3e0;
    color: #e65100;
    padding: 6px 14px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .85rem;
    margin-bottom: 12px
}

.activities-testimonial-item {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    display: flex;
    gap: 30px;
    align-items: center
}

.activities-testimonial-photo {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    overflow: hidden;
    border: 4px solid var(--primary-light-green);
    flex-shrink: 0
}

.activities-testimonial-quote {
    color: var(--primary-light-green);
    font-size: 3rem;
    line-height: 1;
    margin-bottom: 15px
}

.activities-testimonial-text {
    color: #555;
    font-size: 1.1rem;
    line-height: 1.7;
    margin-bottom: 20px;
    font-style: italic
}

.activities-testimonial-role {
    color: var(--primary-light-green);
    font-weight: 600
}

.activities-calendar-wrapper {
    max-width: 1000px;
    margin: 50px auto 0;
    background: #fff;
    border-radius: 24px;
    padding: 40px;
    border: 2px solid #e8f5e1
}

.activities-calendar-month {
    margin-bottom: 35px
}

.activities-month-header {
    background: var(--gradient-light);
    color: #fff;
    padding: 15px 25px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px
}

.activities-calendar-entry {
    background: #f8fdf4;
    padding: 15px 20px;
    border-radius: 10px;
    border: 1px solid #e8f5e1;
    display: flex;
    align-items: center;
    gap: 20px
}

.activities-calendar-date {
    width: 60px;
    height: 60px;
    background: var(--gradient-light);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0
}

.activities-calendar-day {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1
}

.activities-calendar-month-text {
    font-size: .75rem;
    font-weight: 600
}

.news-featured-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    overflow: hidden;
    border: 2px solid #e8f5e1;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .08)
}

.news-featured-image {
    width: 100%;
    height: 450px;
    overflow: hidden
}

.news-featured-content {
    padding: 40px
}

.news-featured-badge {
    display: inline-block;
    background: var(--gradient-light);
    color: #fff;
    padding: 8px 20px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .9rem;
    margin-bottom: 20px
}

.news-featured-content h2 {
    color: var(--primary-dark-green);
    font-weight: 800;
    font-size: 2.2rem;
    margin-bottom: 15px;
    line-height: 1.3
}

.news-featured-meta {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 20px;
    color: #777;
    font-size: .95rem;
    flex-wrap: wrap
}

.news-read-more {
    background: var(--gradient-light);
    color: #fff;
    padding: 12px 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    transition: .3s
}

.news-article-date,
.news-article-link {
    color: var(--primary-light-green);
    gap: 6px;
    font-weight: 600
}

.news-article-thumb {
    width: 100%;
    height: 220px;
    overflow: hidden
}

.news-article-date {
    display: flex;
    align-items: center;
    font-size: .85rem;
    margin-bottom: 12px
}

.news-article-body h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.2rem;
    margin-bottom: 12px;
    line-height: 1.4
}

.news-article-link {
    display: inline-flex;
    align-items: center;
    transition: gap .3s
}

.news-article-link:hover,
.news-blog-category,
.news-blog-text h4 {
    color: var(--primary-dark-green)
}

.news-article-link:hover {
    gap: 10px
}

.news-blog-posts {
    display: grid;
    gap: 40px
}

.news-blog-post {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    display: flex;
    gap: 30px;
    transition: .3s
}

.news-blog-image {
    width: 280px;
    height: 280px;
    border-radius: 16px;
    overflow: hidden;
    flex-shrink: 0
}

.news-blog-category {
    display: inline-block;
    background: #e8f5e1;
    padding: 6px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .85rem;
    margin-bottom: 15px
}

.news-blog-text h4 {
    font-weight: 700;
    font-size: 1.6rem;
    margin-bottom: 15px;
    line-height: 1.3
}

.news-blog-author {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    color: #777;
    font-size: .9rem;
    flex-wrap: wrap
}

.news-subscribe-wrapper {
    max-width: 700px;
    margin: 0 auto;
    text-align: center
}

.news-subscribe-wrapper h3 {
    color: #fff;
    font-weight: 700;
    font-size: 2rem;
    margin-bottom: 15px
}

.news-subscribe-form {
    display: flex;
    gap: 15px;
    max-width: 500px;
    margin: 0 auto
}

.news-subscribe-input {
    flex: 1;
    padding: 15px 20px;
    border: none;
    border-radius: 8px;
    font-size: 1rem
}

.news-subscribe-btn {
    background: var(--primary-dark-green);
    color: #fff;
    padding: 15px 35px;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: .3s
}

.news-subscribe-btn:hover {
    background: #2d4a1f;
    transform: translateY(-2px)
}

.gallery-categories-section {
    padding: 80px 0 40px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .05)
}

.gallery-masonry-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 30px
}

.gallery-photo-item {
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    transition: .3s;
    position: relative;
    background: #f0f0f0
}

.gallery-photo-item:hover {
    transform: scale(1.05);
    box-shadow: 0 15px 40px rgba(0, 0, 0, .2);
    z-index: 10
}

.gallery-photo-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, .8) 0, transparent 100%);
    color: #fff;
    padding: 25px 15px 15px;
    opacity: 0;
    transition: opacity .3s
}

.gallery-photo-title {
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 5px
}

.gallery-photo-date {
    font-size: .85rem;
    opacity: .9
}

.gallery-photo-zoom {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, .9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-dark-green);
    font-size: 1.2rem;
    opacity: 0;
    transition: opacity .3s
}

.gallery-album-cover {
    width: 100%;
    height: 280px;
    overflow: hidden;
    position: relative
}

.gallery-album-count {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(0, 0, 0, .7);
    color: #fff;
    padding: 6px 14px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .85rem;
    display: flex;
    align-items: center;
    gap: 6px
}

.gallery-highlight-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    overflow: hidden;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.gallery-highlight-banner {
    width: 100%;
    height: 350px;
    overflow: hidden
}

.gallery-highlight-badge {
    display: inline-block;
    background: var(--gradient-light);
    color: #fff;
    padding: 6px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .85rem;
    margin-bottom: 15px
}

.gallery-highlight-content h4,
.video-playlist-details h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.6rem;
    margin-bottom: 12px
}

.gallery-view-album {
    color: var(--primary-light-green);
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: gap .3s
}

.gallery-view-album:hover {
    gap: 12px;
    color: var(--primary-dark-green)
}

.ebrochure-showcase,
.video-featured-container {
    max-width: 1200px;
    margin: 0 auto
}

.video-featured-player {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    padding: 40px;
    border: 2px solid #e8f5e1;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .08)
}

.video-featured-frame {
    width: 100%;
    height: 600px;
    background: #000;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    margin-bottom: 30px
}

.video-play-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .4);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .3s
}

.video-play-overlay:hover {
    background: rgba(0, 0, 0, .6)
}

.video-play-btn {
    width: 100px;
    height: 100px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 3rem;
    transition: .3s
}

.video-play-overlay:hover .video-play-btn {
    transform: scale(1.1);
    box-shadow: 0 15px 40px rgba(120, 169, 78, .5)
}

.video-featured-info h2 {
    color: var(--primary-dark-green);
    font-weight: 800;
    font-size: 2rem;
    margin-bottom: 15px
}

.video-featured-meta {
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 15px;
    color: #777;
    font-size: .95rem;
    flex-wrap: wrap
}

.video-categories-section {
    padding: 80px 0;
    background: #fafafa;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .05)
}

.video-grid-section {
    padding: 80px 0 100px;
    background: #fff
}

.video-card-item {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    border: 2px solid #f0f0f0;
    transition: .3s;
    cursor: pointer
}

.video-card-thumbnail {
    width: 100%;
    height: 240px;
    overflow: hidden;
    position: relative
}

.video-card-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    background: rgba(255, 255, 255, .95);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-dark-green);
    font-size: 1.8rem;
    transition: .3s
}

.video-card-item:hover .video-card-play {
    background: var(--gradient-light);
    color: #fff;
    transform: translate(-50%, -50%) scale(1.15)
}

.video-card-duration {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: rgba(0, 0, 0, .8);
    color: #fff;
    padding: 4px 10px;
    border-radius: 4px;
    font-weight: 600;
    font-size: .85rem
}

.video-card-badge,
.video-card-content h5 {
    color: var(--primary-dark-green);
    margin-bottom: 10px
}

.video-card-content {
    padding: 20px
}

.video-card-badge {
    display: inline-block;
    background: #e8f5e1;
    padding: 4px 12px;
    border-radius: 12px;
    font-weight: 600;
    font-size: .8rem
}

.video-card-content h5 {
    font-weight: 700;
    font-size: 1.1rem;
    line-height: 1.4
}

.video-card-stats {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #777;
    font-size: .85rem
}

.video-playlist-preview {
    width: 100%;
    height: 320px;
    overflow: hidden;
    position: relative
}

.video-playlist-count {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(0, 0, 0, .8);
    color: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .9rem;
    display: flex;
    align-items: center;
    gap: 8px
}

.video-playlist-info,
.video-playlist-play-all {
    display: flex;
    align-items: center;
    font-size: .9rem
}

.video-playlist-play-all {
    position: absolute;
    bottom: 15px;
    left: 15px;
    background: var(--gradient-light);
    color: #fff;
    padding: 10px 20px;
    border-radius: 25px;
    font-weight: 600;
    gap: 8px;
    cursor: pointer;
    transition: .3s
}

.video-playlist-play-all:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 20px rgba(120, 169, 78, .4)
}

.video-playlist-info {
    gap: 20px;
    color: #777
}

.video-tour-showcase p {
    color: #666;
    font-size: 1.1rem;
    line-height: 1.7;
    margin-bottom: 30px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto
}

.kg-age-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    border: 2px solid var(--primary-light-green);
    padding: 12px 24px;
    border-radius: 30px;
    font-weight: 700;
    color: var(--primary-dark-green);
    font-size: 1.1rem;
    margin-top: 10px
}

.kg-feature-card,
.prebooking-benefit-card {
    background: #fff;
    border-radius: 20px;
    padding: 35px 30px;
    text-align: center;
    border: 2px solid #e8f5e1;
    transition: .3s
}

.kg-feature-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2.2rem;
    color: #fff;
    box-shadow: 0 10px 25px rgba(255, 165, 0, .3)
}

.kg-curriculum-blocks {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px
}

.kg-admission-step {
    background: #fff;
    border-radius: 16px;
    padding: 30px;
    border: 2px solid #e8f5e1;
    display: flex;
    align-items: center;
    gap: 30px;
    transition: .3s
}

.kg-step-number,
.prebooking-icon-large {
    background: var(--gradient-light);
    display: flex;
    color: #fff
}

.kg-step-number {
    width: 70px;
    height: 70px;
    border-radius: 15px;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-weight: 800;
    flex-shrink: 0
}

.prebooking-intro-container {
    max-width: 1000px;
    margin: 0 auto;
    text-align: center
}

.prebooking-icon-large {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    margin: 0 auto 30px;
    font-size: 4rem;
    box-shadow: 0 20px 50px rgba(120, 169, 78, .3)
}

.prebooking-intro-container h2 {
    color: var(--primary-dark-green);
    font-weight: 800;
    font-size: 2.5rem;
    margin-bottom: 20px
}

.prebooking-intro-container p {
    color: #666;
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 15px
}

.prebooking-highlight {
    background: linear-gradient(135deg, #f8fdf4 0, #e8f5e1 100%);
    padding: 25px;
    border-radius: 16px;
    border: 2px solid var(--primary-light-green);
    margin-top: 30px
}

.prebooking-highlight h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    margin-bottom: 10px
}

.prebooking-highlight p {
    margin: 0;
    font-size: 1rem
}

.prebooking-benefit-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2.2rem;
    color: #fff
}

.prebooking-form-wrapper {
    max-width: 800px;
    margin: 50px auto 0;
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 24px;
    padding: 50px;
    border: 2px solid #e8f5e1;
    box-shadow: 0 15px 40px rgba(0, 0, 0, .08)
}

.prebooking-form-header h3 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 2rem;
    margin-bottom: 10px
}

.ebrochure-request-header p,
.prebooking-form-header p {
    color: #666;
    margin: 0
}

.ebrochure-form-group label,
.prebooking-form-group label {
    color: var(--primary-dark-green);
    font-weight: 600;
    margin-bottom: 8px;
    display: block
}

.ebrochure-form-group input,
.ebrochure-form-group select,
.prebooking-form-group input,
.prebooking-form-group select,
.prebooking-form-group textarea {
    width: 100%;
    padding: 14px 18px;
    border: 2px solid #e8f5e1;
    border-radius: 10px;
    font-size: 1rem;
    transition: border-color .3s
}

.ebrochure-form-group input:focus,
.ebrochure-form-group select:focus,
.prebooking-form-group input:focus,
.prebooking-form-group select:focus,
.prebooking-form-group textarea:focus {
    outline: 0;
    border-color: var(--primary-light-green)
}

.prebooking-form-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px
}

.prebooking-submit-btn {
    background: var(--gradient-light);
    color: #fff;
    padding: 16px 50px;
    border: none;
    border-radius: 10px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    width: 100%;
    margin-top: 15px
}

.ebrochure-submit-btn:hover,
.prebooking-submit-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(120, 169, 78, .3)
}

.prebooking-note {
    background: #fff3e0;
    padding: 15px 20px;
    border-radius: 10px;
    border-left: 4px solid #ff9800;
    margin-top: 25px
}

.prebooking-note p {
    color: #e65100;
    margin: 0;
    font-size: .95rem
}

.prebooking-terms-section {
    padding: 80px 0;
    background: #fafafa
}

.prebooking-terms-box h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.6rem;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    gap: 12px
}

.prebooking-terms-list li {
    padding: 15px 0 15px 35px;
    border-bottom: 1px solid #f0f0f0;
    color: #555;
    position: relative;
    line-height: 1.7
}

.prebooking-terms-list li::before {
    content: '\F26A';
    font-family: bootstrap-icons;
    position: absolute;
    left: 0;
    color: var(--primary-light-green);
    font-size: 1.2rem
}

.ebrochure-display {
    background: #fff;
    border-radius: 24px;
    padding: 50px;
    border: 2px solid #e8f5e1;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .1)
}

.ebrochure-preview {
    width: 100%;
    height: 700px;
    background: linear-gradient(135deg, var(--primary-dark-green) 0, #2d4a1f 100%);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 40px;
    position: relative;
    overflow: hidden
}

.ebrochure-preview::before {
    content: '';
    position: absolute;
    width: 300px;
    height: 300px;
    background: rgba(255, 255, 255, .05);
    border-radius: 50%;
    top: -100px;
    right: -100px
}

.ebrochure-preview::after {
    content: '';
    position: absolute;
    width: 200px;
    height: 200px;
    background: rgba(255, 255, 255, .05);
    border-radius: 50%;
    bottom: -50px;
    left: -50px
}

.ebrochure-icon {
    width: 150px;
    height: 150px;
    background: rgba(255, 255, 255, .15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
    font-size: 5rem;
    color: #fff;
    position: relative;
    z-index: 2
}

.ebrochure-preview h3 {
    color: #fff;
    font-weight: 800;
    font-size: 2.5rem;
    margin-bottom: 15px;
    position: relative;
    z-index: 2
}

.ebrochure-preview p {
    color: rgba(255, 255, 255, .9);
    font-size: 1.2rem;
    margin-bottom: 0;
    position: relative;
    z-index: 2
}

.ebrochure-info p {
    color: #666;
    font-size: 1.1rem;
    line-height: 1.7;
    margin-bottom: 30px
}

.ebrochure-download-btn {
    background: var(--gradient-light);
    color: #fff;
    padding: 18px 50px;
    border: none;
    border-radius: 12px;
    font-size: 1.2rem;
    font-weight: 700;
    cursor: pointer;
    transition: .3s;
    display: inline-flex;
    align-items: center;
    gap: 15px;
    box-shadow: 0 10px 30px rgba(120, 169, 78, .3)
}

.ebrochure-download-btn:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(120, 169, 78, .4);
    color: #fff
}

.ebrochure-stats {
    display: flex;
    justify-content: center;
    gap: 50px;
    margin-top: 40px;
    flex-wrap: wrap
}

.ebrochure-stat-label {
    color: #777;
    font-size: 1rem
}

.ebrochure-content-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e8f5e1
}

.ebrochure-content-list li {
    padding: 10px 0 10px 30px;
    color: #555;
    position: relative;
    line-height: 1.6
}

.ebrochure-request-wrapper {
    max-width: 700px;
    margin: 50px auto 0;
    background: #fff;
    border-radius: 24px;
    padding: 45px;
    border: 2px solid #e8f5e1;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .08)
}

.ebrochure-request-header {
    text-align: center;
    margin-bottom: 35px
}

.ebrochure-submit-btn {
    background: var(--gradient-light);
    color: #fff;
    padding: 15px 40px;
    border: none;
    border-radius: 10px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: .3s;
    width: 100%;
    margin-top: 10px
}

.awards-stats-section {
    padding: 100px 0;
    background: var(--gradient-green)
}

.awards-stat-icon {
    width: 100px;
    height: 100px;
    background: rgba(255, 255, 255, .15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    font-size: 3rem
}

.awards-stat-block p {
    font-size: 1.2rem;
    opacity: .95;
    margin: 0
}

.awards-level-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #fff3e0;
    color: #e65100;
    padding: 6px 14px;
    border-radius: 20px;
    font-weight: 600;
    font-size: .85rem;
    margin-bottom: 12px
}

.awards-achievement-body h5 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.2rem;
    margin-bottom: 10px;
    line-height: 1.4
}

.awards-achievement-date {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--primary-light-green);
    font-weight: 600;
    font-size: .9rem
}

.awards-category-tabs {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 50px
}

.awards-category-card {
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 35px;
    border: 2px solid #e8f5e1;
    display: flex;
    gap: 25px;
    transition: .3s
}

.awards-trophy-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-light);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    color: #fff;
    flex-shrink: 0
}

.awards-category-info p {
    color: #666;
    line-height: 1.6;
    margin-bottom: 12px
}

.awards-year-tag {
    display: inline-block;
    background: #e8f5e1;
    color: var(--primary-dark-green);
    padding: 4px 12px;
    border-radius: 12px;
    font-weight: 600;
    font-size: .85rem
}

.awards-fame-timeline::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--gradient-light);
    transform: translateX(-50%)
}

.awards-fame-item {
    display: flex;
    align-items: center;
    gap: 40px;
    margin-bottom: 50px;
    position: relative
}

.awards-fame-year {
    width: 100px;
    height: 100px;
    background: var(--gradient-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 800;
    font-size: 1.5rem;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    box-shadow: 0 10px 30px rgba(120, 169, 78, .3)
}

.awards-fame-content {
    flex: 1;
    background: linear-gradient(135deg, #fff 0, #f8fdf4 100%);
    border-radius: 20px;
    padding: 30px;
    border: 2px solid #e8f5e1
}

.awards-fame-content h4 {
    color: var(--primary-dark-green);
    font-weight: 700;
    font-size: 1.5rem;
    margin-bottom: 12px
}

.awards-recognition-medal {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, gold 0, #ffed4e 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2.5rem;
    color: #fff;
    box-shadow: 0 8px 20px rgba(255, 215, 0, .3)
}

.awards-recognition-card.silver .awards-recognition-medal {
    background: linear-gradient(135deg, silver 0, #d9d9d9 100%);
    box-shadow: 0 8px 20px rgba(192, 192, 192, .3)
}

.awards-recognition-card.bronze .awards-recognition-medal {
    background: linear-gradient(135deg, #cd7f32 0, #e59866 100%);
    box-shadow: 0 8px 20px rgba(205, 127, 50, .3)
}

.page-header {
    background: linear-gradient(135deg, #2d4a1f 0, #78a94e 100%);
    padding: 250px 0 230px;
    margin-bottom: -40px;
    position: relative
}

.page-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background: linear-gradient(135deg, #f8fdf4 0, #fff 100%);
    clip-path: polygon(0 50%, 100% 0, 100% 100%, 0 100%)
}

.page-header h1 {
    color: #fff;
    font-size: 3rem;
    font-weight: 800;
    text-align: center;
    margin-bottom: 10px;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .2)
}

.page-header p {
    color: rgba(255, 255, 255, .95);
    text-align: center;
    font-size: 1.2rem;
    margin: 0
}

.form-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 100px 20px
}

.form-card {
    background: #fff;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .1);
    margin-bottom: 30px
}

.section-icon,
.section-number {
    border-radius: 50%;
    display: flex
}

.section-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 3px solid #78a94e
}

.section-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #78a94e 0, #a8d576 100%);
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.5rem;
    box-shadow: 0 5px 15px rgba(120, 169, 78, .3)
}

.section-header h2 {
    color: #2d4a1f;
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0
}

.section-number {
    width: 35px;
    height: 35px;
    background: #ffd93d;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    color: #2d4a1f;
    font-size: 1.1rem;
    margin-left: auto
}

.file-upload-label,
.upload-icon-text {
    display: flex;
    flex-direction: column;
    transition: .3s
}

.form-label {
    color: #2d4a1f;
    font-weight: 600;
    font-size: .95rem;
    margin-bottom: 8px
}

.form-label .required {
    color: #dc3545;
    margin-left: 3px
}

.form-control,
.form-select {
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    padding: 10px 15px;
    font-size: 1rem;
    transition: .3s
}

.form-control:focus,
.form-select:focus {
    border-color: #78a94e;
    box-shadow: 0 0 0 .2rem rgba(120, 169, 78, .15)
}

.form-control:hover,
.form-select:hover {
    border-color: #78a94e
}

.file-upload-wrapper {
    position: relative;
    margin-bottom: 20px
}

.file-upload-label {
    align-items: center;
    justify-content: center;
    padding: 30px;
    background: #f8fdf4;
    border: 2px dashed #78a94e;
    border-radius: 15px;
    text-align: center;
    cursor: pointer;
    min-height: 140px;
    position: relative
}

.file-upload-label:hover {
    background: rgba(120, 169, 78, .1);
    border-color: #2d4a1f
}

.file-upload-label.file-selected {
    background: rgba(120, 169, 78, .1);
    border-color: #78a94e;
    border-style: solid
}

.upload-icon-text {
    align-items: center
}

.upload-icon-text i {
    font-size: 2rem;
    color: #78a94e;
    margin-bottom: 10px
}

.upload-icon-text span {
    color: #2d4a1f;
    font-weight: 600;
    display: block
}

.upload-icon-text small {
    color: #666;
    display: block;
    margin-top: 5px
}

.file-selected-display {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%
}

.file-info-box {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    padding: 12px 20px;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .1);
    margin-bottom: 12px;
    max-width: 90%
}

.file-info-box i {
    color: #78a94e;
    font-size: 1.3rem
}

.file-info-box span {
    color: #2d4a1f;
    font-weight: 600;
    font-size: .9rem;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.delete-file-btn,
.subsection h3 {
    display: flex;
    align-items: center
}

.delete-file-btn {
    background: #dc3545;
    color: #fff;
    border: none;
    border-radius: 50px;
    padding: 8px 20px;
    gap: 8px;
    cursor: pointer;
    transition: .3s;
    box-shadow: 0 3px 10px rgba(220, 53, 69, .3);
    font-weight: 600;
    font-size: .9rem
}

.delete-file-btn:hover {
    background: #c82333;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(220, 53, 69, .4)
}

.delete-file-btn i {
    font-size: .9rem
}

.subsection {
    background: #f8fdf4;
    border-radius: 15px;
    padding: 25px;
    margin-bottom: 30px;
    border-left: 4px solid #78a94e
}

.subsection h3 {
    color: #2d4a1f;
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 20px;
    gap: 10px
}

.form-check-input {
    width: 20px;
    height: 20px;
    border: 2px solid #78a94e;
    cursor: pointer
}

.form-check-input:checked {
    background-color: #78a94e;
    border-color: #78a94e
}

.form-check-label {
    color: #2d4a1f;
    font-weight: 500;
    margin-left: 10px;
    cursor: pointer
}

.declaration-box {
    background: #fffbea;
    border: 2px solid #ffd93d;
    border-radius: 15px;
    padding: 25px
}

.submit-section {
    text-align: center;
    padding: 30px 0
}

.submit-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 18px 50px;
    background: linear-gradient(135deg, #78a94e 0, #a8d576 100%);
    color: #fff;
    font-size: 1.2rem;
    font-weight: 700;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    transition: .4s;
    box-shadow: 0 8px 25px rgba(120, 169, 78, .3)
}

.submit-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 35px rgba(120, 169, 78, .4);
    background: linear-gradient(135deg, #2d4a1f 0, #78a94e 100%)
}

.info-box {
    background: linear-gradient(135deg, rgba(120, 169, 78, .1) 0, rgba(168, 213, 118, .1) 100%);
    border-left: 4px solid #78a94e;
    border-radius: 10px;
    padding: 15px 20px;
    margin-bottom: 25px
}

.info-box i {
    color: #78a94e;
    margin-right: 10px;
    font-size: 1.2rem
}

.info-box p {
    margin: 0;
    color: #2d4a1f;
    font-weight: 500
}

/* landing page  */

.marquee-section {
    width: 100%;
    background: linear-gradient(135deg, #78a94e 0%, #2d4a1f 100%);
    color: #fff;
    padding: 12px 0;
    font-size: 16px;
    font-weight: 600;
    position: relative;
    overflow: hidden;
}

.marquee-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    animation: shimmer 3s infinite;
}

@keyframes shimmer {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(100%);
    }
}

.blink-text {
    animation: blink 1.5s infinite;
    font-weight: 700;
}

@keyframes blink {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}

.landing-banner-section {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 650px;
    background: url('../images/drone-banner.jpg') center/cover no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

.landing-banner-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.4;
    z-index: 1;
}

.banner-content {
    /* position: relative; */
    z-index: 10;
    text-align: center;
    color: white;
    max-width: 1000px;
    padding: 0 20px;
}

.banner-content p {
    font-size: 1.3rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin-bottom: 20px;
    opacity: 0.95;
    animation: fadeInDown 1s ease;
}

.banner-content h1 {
    font-size: 4.5rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 30px;
    animation: fadeInUp 1s ease;
}

.banner-btn {
    display: inline-block;
    padding: 16px 50px;
    background: white;
    color: #2d4a1f;
    font-weight: 700;
    font-size: 1.1rem;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.4s ease;
    margin-top: 20px;
    box-shadow: 0 10px 30px rgba(255, 255, 255, 0.3);
    animation: fadeInUp 1.2s ease;
}

.banner-btn:hover {
    background: #FFD93D;
    color: #2d4a1f;
    transform: translateY(-3px);
    box-shadow: 0 15px 40px rgba(255, 255, 255, 0.4);
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }

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

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

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

.section-padding {
    padding: 100px 0;
}

.section-title {
    text-align: center;
    margin-bottom: 60px;
}

.section-title h2 {
    font-size: 3rem;
    font-weight: 800;
    color: #2d4a1f;
    margin-bottom: 15px;
    position: relative;
    display: inline-block;
}

.section-title h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #78a94e 0%, #a8d576 100%);
    border-radius: 2px;
}

.section-title p {
    font-size: 1.2rem;
    color: #666;
    margin-top: 25px;
}

.about-section {
    background: white;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.about-content {
    display: flex;
    align-items: center;
    gap: 50px;
}

.about-image {
    flex: 1;
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
}

.about-image img {
    width: 100%;
    transition: transform 0.5s ease;
    height: 600px;
    object-fit: cover;
}

.about-image:hover img {
    transform: scale(1.05);
}

.about-text {
    flex: 1;
}

.about-text h3 {
    font-size: 2.5rem;
    font-weight: 800;
    color: #2d4a1f;
    margin-bottom: 20px;
}

.about-text p {
    font-size: 1.1rem;
    color: #666;
    line-height: 1.8;
    margin-bottom: 20px;
}

.about-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 30px;
}

.stat-box {
    text-align: center;
    padding: 20px;
    background: linear-gradient(135deg, #f8fdf4 0%, #e8f5e1 100%);
    border-radius: 15px;
}

.stat-box h4 {
    font-size: 2.5rem;
    font-weight: 800;
    color: #78a94e;
    margin-bottom: 5px;
}

.stat-box p {
    font-size: 0.95rem;
    color: #2d4a1f;
    font-weight: 600;
    margin: 0;
}

.choose-section {
    background: linear-gradient(135deg, #f8fdf4 0%, #ffffff 50%, #f8fdf4 100%);
}

.choose-card {
    background: white;
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    margin-bottom: 30px;
    transition: all 0.4s ease;
    height: 100%;
}

.choose-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(120, 169, 78, 0.25);
}

.choose-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #78a94e 0%, #a8d576 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2rem;
    color: white;
    transition: all 0.4s ease;
    box-shadow: 0 8px 20px rgba(120, 169, 78, 0.3);
}

.choose-card:hover .choose-icon {
    transform: scale(1.1);
}

.choose-card h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #2d4a1f;
    margin-bottom: 15px;
}

.choose-card p {
    color: #666;
    line-height: 1.7;
    margin: 0;
}

.campuses-section {
    background: white;
}

.campus-card {
    background: white;
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    transition: all 0.4s ease;
    margin-bottom: 30px;
}

.campus-card:hover {
    transform: translateY(-15px);
    box-shadow: 0 20px 60px rgba(120, 169, 78, 0.3);
}

.campus-image {
    position: relative;
    overflow: hidden;
    height: 350px;
}

.campus-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.campus-card:hover .campus-image img {
    transform: scale(1.1);
}

.campus-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background: linear-gradient(135deg, #FFD93D 0%, #FFA500 100%);
    color: #2d4a1f;
    padding: 10px 25px;
    border-radius: 30px;
    font-weight: 800;
    font-size: 1.1rem;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
}

.campus-info {
    padding: 35px 30px;
}

.campus-info h3 {
    font-size: 2rem;
    font-weight: 800;
    color: #2d4a1f;
    margin-bottom: 15px;
}

.campus-location {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #78a94e;
    font-weight: 600;
    margin-bottom: 20px;
    font-size: 1.1rem;
}

.campus-location i {
    font-size: 1.3rem;
}

.campus-info p {
    color: #666;
    line-height: 1.8;
    margin-bottom: 25px;
}

.campus-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin-bottom: 25px;
}

.campus-card .feature-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #f8fdf4;
    border-radius: 10px;
}

.campus-card .feature-item i {
    color: #78a94e;
    font-size: 1.2rem;
    margin-bottom: 0;
}

.campus-card .feature-item span {
    color: #2d4a1f;
    font-weight: 600;
    font-size: 0.95rem;
}

.campus-btn {
    display: inline-block;
    padding: 12px 30px;
    background: linear-gradient(135deg, #78a94e 0%, #a8d576 100%);
    color: white;
    font-weight: 700;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.campus-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(120, 169, 78, 0.4);
    color: white;
}

.courses-section {
    background: linear-gradient(135deg, #f8fdf4 0%, #ffffff 100%);
}

.course-card {
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    transition: all 0.4s ease;
    margin-bottom: 30px;
    height: 100%;
}

.course-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.course-image {
    position: relative;
    overflow: hidden;
    height: 250px;
    background: linear-gradient(135deg, #78a94e 0%, #a8d576 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.course-image i {
    font-size: 5rem;
    color: white;
    opacity: 0.3;
}

.course-info {
    padding: 30px;
}

.course-info h4 {
    font-size: 1.6rem;
    font-weight: 700;
    color: #2d4a1f;
    margin-bottom: 15px;
}

.course-info p {
    color: #666;
    line-height: 1.7;
    margin-bottom: 20px;
}

.course-link {
    color: #78a94e;
    font-weight: 700;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.course-link:hover {
    gap: 12px;
}

.members-section {
    background: linear-gradient(135deg, #2d4a1f 0%, #78a94e 100%);
}

.members-section .section-title h2,
.members-section .section-title p {
    color: white;
}

.member-card {
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    margin-bottom: 30px;
    transition: all 0.4s ease;
}

.member-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
}

.member-image {
    position: relative;
    overflow: hidden;
    height: 350px;
    background: #f0f0f0;
}

.member-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.member-card:hover .member-image img {
    transform: scale(1.1);
}

.member-info {
    padding: 30px;
}

.member-badge {
    display: inline-block;
    background: linear-gradient(135deg, #78a94e 0%, #a8d576 100%);
    color: white;
    padding: 6px 20px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 15px;
}

.member-info h3 {
    font-size: 1.8rem;
    font-weight: 800;
    color: #2d4a1f;
    margin-bottom: 15px;
}

.member-info p {
    color: #666;
    line-height: 1.8;
    margin: 0;
}

.disclosure-section {
    background: white;
}

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

.disclosure-card {
    background: linear-gradient(135deg, #f8fdf4 0%, #ffffff 100%);
    border-left: 4px solid #78a94e;
    border-radius: 15px;
    padding: 25px;
    transition: all 0.3s ease;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08);
}

.disclosure-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(120, 169, 78, 0.2);
}

.disclosure-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #78a94e 0%, #a8d576 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.3rem;
    margin-bottom: 15px;
}

.disclosure-card h4 {
    font-size: 1.1rem;
    font-weight: 700;
    color: #2d4a1f;
    margin-bottom: 10px;
}

.disclosure-card p {
    color: #666;
    margin: 0;
    font-size: 0.95rem;
}

.cta-section {
    background: linear-gradient(135deg, #2d4a1f 0%, #78a94e 100%);
    padding: 80px 0;
    text-align: center;
}

.cta-section h2 {
    color: white;
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 20px;
}

.cta-section p {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.2rem;
    margin-bottom: 30px;
}

.cta-btn {
    display: inline-block;
    padding: 16px 50px;
    background: white;
    color: #2d4a1f;
    font-weight: 700;
    font-size: 1.1rem;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.4s ease;
    box-shadow: 0 8px 25px rgba(255, 255, 255, 0.3);
}

.cta-btn:hover {
    background: #FFD93D;
    color: #2d4a1f;
    transform: translateY(-3px);
    box-shadow: 0 12px 35px rgba(255, 255, 255, 0.4);
}

.academicImage {
    background-image: url('../images/academic-excellence-banner.jpg');
    background-position: 100% -20%
}

.our-profile,
.photos {
    background-image: url('../images/our-profile-banner.jpg')
}

.management-team {
    background-image: url('../images/leadership-team-banner.jpg')
}

.mandatory-disclosure {
    background-image: url('../images/mandatory-disclosure-banner.jpg')
}

.awards,
.curriculum {
    background-image: url('../images/our-curriculum-banner.jpg')
}

.subjects,
.videos {
    background-image: url('../images/subjects-offered-banner.jpg')
}

.faculty {
    background-image: url('../images/Faculty-banner.jpg')
}

.calendar {
    background-image: url('../images/academic-calendar-banner.jpg')
}

.assessment {
    background-image: url('../images/assessment-banner.jpg')
}

.achievements {
    background-image: url('../images/achievements-banner.jpg')
}

.lesson-plans,
.news {
    background-image: url('../images/syllabus-banner.jpg')
}

.homework {
    background-image: url('../images/homework-banner.jpg')
}

.resources {
    background-image: url('../images/lab-banner.jpg')
}

.ebrochure,
.progress-reports {
    background-image: url('../images/student-progress-banner.jpg')
}

.panakkad {
    background-image: url('../images/Panakkad-banner.jpg')
}

.kottakkal {
    background-image: url('../images/Kottakkal-banner.jpg')
}

.kindergarten {
    background-image: url('../images/Kindergarten-banner.jpg')
}

.pre-booking {
    background-image: url('../images/kids-banner.jpg')
}

.about {
    background-image: url('../images/about-banner.jpg')
}

.hostels {
    background-image: url('../images/hostel-banner.jpg')
}

.activity {
    background-image: url('../images/activity-banner.jpg')
}

.achievements,
.assessment,
.awards,
.calendar,
.curriculum,
.faculty,
.hostels,
.kindergarten,
.kottakkal,
.management-team,
.pre-booking,
.resources,
.subjects,
.videos {
    background-position: top center
}

@keyframes blink {

    0%,
    100% {
        color: #213018
    }

    50% {
        color: #fff
    }
}

@keyframes progress {
    from {
        stroke-dashoffset: 360
    }

    to {
        stroke-dashoffset: 0
    }
}

@keyframes zoom {

    0%,
    20% {
        transform: scale(1)
    }

    100%,
    75% {
        transform: scale(1.1)
    }
}

@keyframes zoomInOut {

    0%,
    100% {
        transform: scale(1)
    }

    50% {
        transform: scale(1.15)
    }
}

@keyframes pulse {

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

    50% {
        transform: scale(1.1);
        opacity: .8
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px)
    }

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

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px)
    }

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

/* photo gallery tab  */

.gallery-categories-section {
    padding: 40px 0;
    background: #fff;
}

#galleryTabs {
    border: none !important;
    gap: 12px;
    flex-wrap: wrap;
}

#galleryTabs .nav-item {
    margin: 0;
}

#galleryTabs .nav-link {
    background: #fafafa;
    border: 2px solid #e0e0e0;
    padding: 12px 28px;
    border-radius: 25px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: .3s;
    font-size: .95rem;
}

#galleryTabs .nav-link:hover {
    background: #f0f0f0 !important;
    color: #333 !important;
}

#galleryTabs .nav-link.active,
#galleryTabs .nav-link.active:hover,
#galleryTabs .nav-link.active:focus {
    background: var(--primary-light-green) !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

#galleryTabs .nav-link:focus {
    outline: none;
}

.gallery-photos-section {
    padding: 60px 0;
}

.gallery-photo-item {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    cursor: pointer;
    aspect-ratio: 1;
}

.gallery-photo-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

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

/* contact page  */

.page-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 80px;
    background: white;
    clip-path: polygon(0 50%, 100% 0, 100% 100%, 0 100%);
}

.page-header h1 {
    color: white;
    font-size: 3.5rem;
    font-weight: 800;
    text-align: center;
    margin-bottom: 15px;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.page-header p {
    color: rgba(255, 255, 255, 0.95);
    text-align: center;
    font-size: 1.3rem;
    margin: 0;
}

.contact-section {
    padding: 100px 20px;
}

/* Contact Info Cards */
.contact-info-wrapper {
    margin-bottom: 60px;
}

.contact-info-card {
    background: white;
    border-radius: 20px;
    padding: 35px 30px;
    text-align: center;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
    transition: all 0.4s ease;
    height: 100%;
    border: 2px solid transparent;
}

.contact-info-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(120, 169, 78, 0.2);
    border-color: #78a94e;
}

.contact-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #78a94e 0%, #a8d576 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 2rem;
    color: white;
    box-shadow: 0 8px 20px rgba(120, 169, 78, 0.3);
    transition: all 0.4s ease;
}

.contact-info-card:hover .contact-icon {
    transform: scale(1.1) rotate(360deg);
}

.contact-info-card h3 {
    font-size: 1.4rem;
    font-weight: 700;
    color: #2d4a1f;
    margin-bottom: 15px;
}

.contact-info-card p {
    color: #666;
    margin-bottom: 8px;
    font-size: 1.05rem;
}

.contact-info-card a {
    color: #78a94e;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.contact-info-card a:hover {
    color: #2d4a1f;
}

.form-map-section {
    background: linear-gradient(135deg, #f8fdf4 0%, #ffffff 100%);
    padding: 80px 0;
}

.contact-form-wrapper {
    background: white;
    border-radius: 25px;
    padding: 50px 40px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

.form-title {
    font-size: 2.5rem;
    font-weight: 800;
    color: #2d4a1f;
    margin-bottom: 15px;
}

.form-subtitle {
    color: #666;
    font-size: 1.1rem;
    margin-bottom: 35px;
}

.form-label {
    color: #2d4a1f;
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 8px;
}

.form-control,
.form-select {
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    padding: 12px 15px;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.form-control:focus,
.form-select:focus {
    border-color: #78a94e;
    box-shadow: 0 0 0 0.2rem rgba(120, 169, 78, 0.15);
}

.form-control:hover,
.form-select:hover {
    border-color: #78a94e;
}

textarea.form-control {
    min-height: 150px;
    resize: vertical;
}

/* Map Section */
.map-wrapper {
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    height: 100%;
    min-height: 500px;
}

.map-wrapper iframe {
    width: 100%;
    height: 100%;
    border: none;
    min-height: 500px;
}

.office-hours-section {
    background: white;
    padding: 80px 0;
}

.office-hours-card {
    background: linear-gradient(135deg, #2d4a1f 0%, #78a94e 100%);
    border-radius: 25px;
    padding: 50px 40px;
    color: white;
    text-align: center;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
}

.office-hours-card h2 {
    font-size: 2.5rem;
    font-weight: 800;
    margin-bottom: 30px;
}

.hours-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

.hours-item {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 15px;
    padding: 25px 20px;
    transition: all 0.3s ease;
}

.hours-item:hover {
    background: rgba(255, 255, 255, 0.2);
    transform: translateY(-5px);
}

.hours-item h4 {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 10px;
}

.hours-item p {
    font-size: 1.1rem;
    margin: 0;
    opacity: 0.95;
}

.campuses-contact-section {
    background: linear-gradient(135deg, #f8fdf4 0%, #ffffff 100%);
    padding: 80px 0;
}

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

.section-title h2 {
    font-size: 2.8rem;
    font-weight: 800;
    color: #2d4a1f;
    margin-bottom: 15px;
    position: relative;
    display: inline-block;
}

.section-title h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #78a94e 0%, #a8d576 100%);
    border-radius: 2px;
}

.section-title p {
    font-size: 1.2rem;
    color: #666;
    margin-top: 25px;
}

.campus-contact-card {
    background: white;
    border-radius: 20px;
    padding: 40px 35px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    margin-bottom: 30px;
    transition: all 0.4s ease;
    border-left: 5px solid #78a94e;
}

.campus-contact-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 45px rgba(120, 169, 78, 0.2);
}

.campus-badge {
    display: inline-block;
    background: linear-gradient(135deg, #FFD93D 0%, #FFA500 100%);
    color: #2d4a1f;
    padding: 8px 20px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 0.9rem;
    margin-bottom: 20px;
    display: none;
}

.campus-contact-card h3 {
    font-size: 2rem;
    font-weight: 800;
    color: #2d4a1f;
    margin-bottom: 20px;
}

.campus-detail {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 15px;
    padding: 12px;
    background: #f8fdf4;
    border-radius: 10px;
}

.campus-detail i {
    color: #78a94e;
    font-size: 1.3rem;
    margin-top: 3px;
}

.campus-detail-text h5 {
    font-size: 1rem;
    font-weight: 700;
    color: #2d4a1f;
    margin-bottom: 5px;
}

.campus-detail-text p {
    margin: 0;
    color: #666;
    font-size: 1rem;
}

.campus-detail-text a {
    color: #78a94e;
    text-decoration: none;
    font-weight: 600;
}

.campus-detail-text a:hover {
    color: #2d4a1f;
}

.faq-section {
    background: white;
    padding: 80px 0;
}

.accordion-item {
    border: none;
    margin-bottom: 15px;
    border-radius: 15px !important;
    overflow: hidden;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.06);
}

.accordion-button {
    background: linear-gradient(135deg, #f8fdf4 0%, #ffffff 100%);
    color: #2d4a1f;
    font-weight: 700;
    font-size: 1.1rem;
    padding: 20px 25px;
    border: none;
    box-shadow: none !important;
}

.accordion-button:not(.collapsed) {
    background: linear-gradient(135deg, #78a94e 0%, #a8d576 100%);
    color: white;
}

.accordion-button::after {
    filter: brightness(0);
}

.accordion-button:not(.collapsed)::after {
    filter: brightness(0) invert(1);
}

.accordion-body {
    padding: 25px;
    font-size: 1.05rem;
    color: #666;
    line-height: 1.8;
}