/* --- Variables --- */
:root {
    --primary-blue: #003366;
    --accent-gold: #ffcc00;
    --light-bg: #f4f7f6;
    --white: #ffffff;
}

body {
    font-family: 'Hind Siliguri', sans-serif;
    background-color: var(--light-bg);
}

/* --- Header & Buttons --- */
.top-header { background: var(--white); border-bottom: 3px solid var(--primary-blue); padding: 10px 0; }
.school-logo { width: 70px; height: auto; }
.school-name h2 { color: var(--primary-blue); font-weight: 700; margin: 0; }

.btn-apply-online {
    background-color: var(--accent-gold);
    color: #000;
    font-weight: bold;
    padding: 10px 25px;
    border-radius: 50px;
    text-decoration: none;
    display: inline-block;
    transition: 0.3s ease;
    font-size: 20px;
}
.pulse-animation { animation: pulse 2s infinite; }
@keyframes pulse {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 204, 0, 0.7); }
    70% { transform: scale(1.05); box-shadow: 0 0 0 10px rgba(255, 204, 0, 0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 204, 0, 0); }
}

/* --- Navbar & Multi-level Dropdown --- */
.main-nav { background-color: var(--primary-blue) !important; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
.navbar-dark .navbar-nav .nav-link { color: rgba(255,255,255,0.9); padding: 15px 20px; font-weight: 500; }
.navbar-dark .navbar-nav .nav-link:hover { color: var(--accent-gold); }


/* ১. বুটস্ট্র্যাপের ডিফল্ট ড্রপডাউন আইকন (Carets) মুছে ফেলা */
.custom-nav-link::after {
    display: none !important;
}

/* ২. আইকন স্টাইল ও ট্রানজিশন */
.arrow-icon {
    font-size: 12px;
    transition: transform 0.3s ease;
    pointer-events: none; /* আইকনে ক্লিক যেন লিঙ্কে ডিস্টার্ব না করে */
}
.custom-nav-link::after {
    display: none !important;
}


.main-nav .nav-link.active {
    color: #ffcc00 !important; 
    background: rgba(255, 255, 255, 0.15);
    font-weight: 700;
    border-radius: 5px;
}

/* একটিভ অবস্থায় নিচে একটি দাগ */
.main-nav .nav-link.active::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 15%;
    width: 70%;
    height: 3px;
    background-color: #ffcc00;
    border-radius: 10px;
}




.message-card {
    border: none;
    border-radius: 15px;
    overflow: hidden;
    background: #fff;
}

.message-card .card-header {
    background-color: var(--primary-blue);
    color: var(--accent-gold);
    text-align: center;
    font-weight: 700;
    font-size: 1.2rem;
    padding: 15px;
    border: none;
}
/* নোটিশ লিস্ট থেকে স্ক্রলবার হাইড করার জন্য */
.notice-list {
    max-height: 420px;
    overflow-y: auto;
    scrollbar-width: none; /* Firefox এর জন্য */
    -ms-overflow-style: none; /* Internet Explorer এর জন্য */
}

/* Chrome, Safari এবং Opera এর জন্য স্ক্রলবার হাইড */
.notice-list::-webkit-scrollbar {
    display: none;
}
@media (min-width: 992px) {
    .nav-item.dropdown:hover > .custom-nav-link .arrow-icon {
        transform: rotate(90deg);
    }

    /* সাব-মেনু (Class Six/Seven) হোভার করলে */
    .dropdown-submenu:hover > .custom-nav-link .arrow-icon {
        transform: rotate(90deg);
    }
    .dropdown:hover > .dropdown-menu { display: block; animation: fadeIn 0.3s ease; }
    .dropdown-submenu { position: relative; }
    .dropdown-submenu > .dropdown-menu { top: 0; left: 100%; display: none; margin-top: -1px; }
    .dropdown-submenu:hover > .dropdown-menu { display: block; }
}

.dropdown-menu { border-top: 4px solid var(--accent-gold) !important; border-radius: 0 0 8px 8px; }
.dropdown-item:hover { background-color: var(--primary-blue); color: var(--accent-gold) !important; }

/* --- Ticker --- */
.notice-ticker { background: var(--white); border-bottom: 2px solid var(--accent-gold); }
.ticker-wrapper { display: flex; align-items: center; background: #f8f9fa; margin: 5px 0; border-radius: 5px; overflow: hidden; }
.ticker-title { 
    background: var(--primary-blue); color: var(--accent-gold); 
    padding: 8px 20px; font-weight: bold; white-space: nowrap;
    clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%);
}
.notice-ticker marquee a { text-decoration: none; color: var(--primary-blue); font-weight: 500; margin-right: 30px; }

/* --- Slider & Message Card --- */
.hero-section { padding: 30px 0; }
.main-slider-img { height: 415px; object-fit: cover; border-radius: 15px; }
.teacher-img { width: 130px; height: 130px; border: 5px solid var(--accent-gold); border-radius: 50%; object-fit: cover; }
.custom-arrow { 
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; background: var(--primary-blue); 
    border-radius: 50%; border: 2px solid var(--accent-gold); 
}



/* --- Notice Board --- */
.notice-date-badge {
    background: var(--primary-blue); color: white;
    min-width: 65px; text-align: center; border-radius: 10px; padding: 8px;
}
.notice-date-badge .day { font-size: 22px; font-weight: bold; display: block; color: var(--accent-gold); line-height: 1; }
.notice-date-badge .month { font-size: 11px; text-transform: uppercase; }
.notice-item:hover { background-color: #f8f9fa; border-left: 4px solid var(--accent-gold); padding-left: 25px !important; transition: 0.3s; }

/* --- Calendar (Important Holiday Color) --- */
.calendar-weekdays { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; font-weight: bold; padding: 10px 0; background: #eee; }
.calendar-days { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; }
.calendar-days div { padding: 15px 0; border: 0.5px solid #eee; transition: 0.2s; cursor: pointer; }

/* শুক্রবার ও শনিবার লাল */
.holiday-red { 
    color: #ff0000 !important; 
    background-color: #fff0f0 !important; 
    font-weight: bold !important; 
}
.current-day { background: var(--primary-blue) !important; color: white !important; border-radius: 5px; }

/* --- Animations --- */
.zoom-effect { animation: zoomin 8s infinite alternate; }
@keyframes zoomin { from { transform: scale(1); } to { transform: scale(1.08); } }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

/* --- Events --- */
.event-card { border-radius: 15px; overflow: hidden; background: white; border-bottom: 4px solid var(--primary-blue); transition: 0.4s; }
.event-card:hover { transform: translateY(-10px); border-bottom-color: var(--accent-gold); }
.event-img-wrap { position: relative; height: 180px; overflow: hidden; }
.event-date { position: absolute; top: 10px; left: 10px; background: var(--accent-gold); color: var(--primary-blue); padding: 5px 12px; border-radius: 8px; font-weight: bold; text-align: center; }
.btn-event { background: var(--primary-blue); color: white; padding: 8px 20px; border-radius: 50px; text-decoration: none; display: inline-block; margin-top: 10px; transition: 0.3s; }
.btn-event:hover { background: var(--accent-gold); color: var(--primary-blue); }



/* --- Footer  css start Styling --- */


.main-footer {
    background-color: #001a33; /* Dark Navy Blue */
    color: #cbd5e0;
    padding: 60px 0 0;
    margin-top: 50px;
    border-top: 4px solid #ffcc00;
}

.footer-logo {
    width: 60px;
    filter: brightness(0) invert(1);
}

.school-name-footer {
    color: #ffcc00;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 15px;
}

.about-text {
    font-size: 14px;
    line-height: 1.6;
}

.widget-title {
    color: #fff;
    margin-bottom: 25px;
    font-weight: 600;
    position: relative;
    padding-bottom: 10px;
}

.widget-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 35px;
    height: 2px;
    background: #ffcc00;
}

/* Emergency Highlight Box */
.emergency-highlight-box {
    background: rgba(0, 0, 0, 0.2);
    padding: 15px;
    border-radius: 12px;
    border: 1px dashed rgba(255, 204, 0, 0.3);
}

.h-card {
    background: linear-gradient(135deg, #002d5a, #001a33);
    padding: 10px;
    border-radius: 8px;
    text-align: center;
    border: 1px solid rgba(255, 204, 0, 0.2);
    transition: 0.3s;
}

.h-card:hover {
    transform: translateY(-3px);
    border-color: #ffcc00;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}

.h-num {
    display: block;
    color: #ffcc00;
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
}

.h-label {
    display: block;
    color: #fff;
    font-size: 10px;
    margin-top: 5px;
    text-transform: uppercase;
}

/* Links & Contact */
.footer-links { list-style: none; padding: 0; }
.footer-links li { margin-bottom: 12px; }
.footer-links li a {
    color: #cbd5e0;
    text-decoration: none;
    transition: 0.3s;
    font-size: 15px;
}
.footer-links li a:hover { color: #ffcc00; padding-left: 5px; }

.contact-info { list-style: none; padding: 0; }
.contact-info li { display: flex; gap: 10px; margin-bottom: 15px; font-size: 15px; }
.text-gold { color: #ffcc00; }

.social-links {gap: 10px; margin-top: 20px;}
.social-links a {
    width: 35px; height: 35px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; transition: 0.3s;
}
.social-links a:hover { background: #ffcc00; color: #000; }

.copyright-area {
    background: #000d1a;
    padding: 20px 0;
    margin-top: 50px;
    border-top: 1px solid rgba(255,255,255,0.05);
}
.copyright-area span { color: #ffcc00; }


/* Teacher Card Base Style */
.teacher-card {
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    transition: all 0.3s ease-in-out;
    border-bottom: 4px solid var(--primary-blue) !important;
}

/* Hover Animation: Cards lift up and border changes gold */
.teacher-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0, 51, 102, 0.1) !important;
    border-bottom-color: var(--accent-gold) !important;
}

/* Reduced height for professional look */
.teacher-img-wrapper {
    position: relative;
    height: 210px; 
    overflow: hidden;
    background-color: #f7f7f7;
}

.teacher-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

/* Image Zoom on hover (No icons) */
.teacher-card:hover .teacher-img-wrapper img {
    transform: scale(1.06);
}

.teacher-details {
    padding-top: 15px;
    padding-bottom: 20px;
}

.teacher-details h6 {
    font-size: 16px;
    margin-bottom: 4px;
}

.badge {
    font-size: 10px;
    padding: 5px 12px;
    border-radius: 4px;
    letter-spacing: 0.5px;
    font-weight: 500;
}


/* স্লাইডারের হাইট */
.t-slider-img {
    height: 400px;
    object-fit: cover;
}

/* জুম অ্যানিমেশন ইফেক্ট */
.zoom-animation {
    animation: scale-up 10s infinite alternate;
}

@keyframes scale-up {
    from { transform: scale(1); }
    to { transform: scale(1.1); }
}

.t-slider-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(0,0,0,0.2), rgba(0, 51, 102, 0.6));
    z-index: 1;
}

.t-caption {
    z-index: 2;
    bottom: 20% !important;
}




/* --- Professional Result Page Styling --- */

/* কার্ডের বর্ডারে গোল্ডেন টাচ */
.border-top-gold {
    border-top: 4px solid var(--accent-gold) !important;
}

.rounded-15 {
    border-radius: 15px !important;
}

/* সার্চ ফিল্ড ডিজাইন */
.r-select {
    padding: 10px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 14px;
}

.r-select:focus {
    border-color: var(--primary-blue);
    box-shadow: 0 0 0 0.2rem rgba(0, 51, 102, 0.1);
}

/* বাটন ডিজাইন */
.btn-primary-blue {
    background: var(--primary-blue);
    color: white;
    border-radius: 8px;
    transition: 0.3s;
    border: none;
}

.btn-primary-blue:hover {
    background: #002244;
    color: var(--accent-gold);
    box-shadow: 0 4px 12px rgba(0, 51, 102, 0.2);
}

/* টেবিল ডিজাইন */
.custom-result-table thead th {
    font-weight: 600;
    letter-spacing: 0.5px;
    border: none;
}

.custom-result-table tbody td {
    vertical-align: middle;
    color: #4a5568;
    border-bottom: 1px solid #f1f5f9;
}

.btn-outline-primary-blue {
    color: var(--primary-blue);
    border: 1px solid var(--primary-blue);
    border-radius: 6px;
    font-size: 12px;
}

.btn-outline-primary-blue:hover {
    background: var(--primary-blue);
    color: white;
}

/* সেশন টাইটেল লেটার স্পেসিং */
.ls-2 {
    letter-spacing: 2px;
}



/* ============================================================
   AWESOME RESULT SECTION - FULL CSS
   ============================================================ */

   .awesome-result-section {
    background: #f8fafc; /* হালকা ব্যাকগ্রাউন্ড */
    padding-top: 60px;
    padding-bottom: 80px;
}

/* টিচার পেজের সাইজের সাথে মেলাতে কন্টেইনার ফিক্স */
.awesome-result-section .container-fluid {
    padding-left: 5% !important;
    padding-right: 5% !important;
}

/* বড় স্ক্রিনে কন্টেন্ট যেন টিচার পেজের কার্ডের মতোই ব্যালেন্সড থাকে */
@media (min-width: 1400px) {
    .awesome-result-section .container-fluid {
        padding-left: 8% !important;
        padding-right: 8% !important;
    }
}

/* --- Search Card (Glassmorphism Style) --- */
.result-glass-card {
    background: #003366; /* আপনার প্রাইমারি নেভি ব্লু */
    border-radius: 15px;
    border: none;
    border-top: 5px solid #FFCC00 !important; /* গোল্ডেন টপ বর্ডার */
    box-shadow: 0 15px 35px rgba(0, 51, 102, 0.15);
    position: relative;
    overflow: hidden;
}

/* ড্রপডাউন ইনপুট স্টাইল */
.cool-input {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
    padding: 12px 15px;
    border-radius: 10px;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
    background-position: right 0.75rem center !important;
    background-repeat: no-repeat !important;
    background-size: 16px 12px !important;
}

.cool-input option {
    background: #003366; 
    color: white;
}

/* সার্চ বাটন (Gold Shimmer) */
.btn-gold-shimmer {
    background: #FFCC00;
    color: #000;
    border: none;
    border-radius: 10px;
    transition: all 0.3s ease;
    font-weight: 700;
}

.btn-gold-shimmer:hover {
    background: #e6b800;
    transform: translateY(-2px);
    box-shadow: 0 8px 15px rgba(255, 204, 0, 0.3);
}

/* --- Table Design --- */
.table-responsive {
    background: #ffffff;
    border-radius: 15px;
    border: 1px solid #e2e8f0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.custom-result-table thead {
    background: #003366 !important;
    color: white;
}

.custom-result-table th {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.5px;
}

.result-row:hover {
    background-color: rgba(0, 51, 102, 0.03);
    transition: 0.2s;
}

/* শিক্ষার্থীর নামের পাশের গোল চিহ্ন */
.avatar-circle {
    width: 35px;
    height: 35px;
    background: #003366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: bold;
}

/* GPA এর ব্যাজ */
.gpa-pill {
    background: #e6fffa;
    color: #2c7a7b;
    padding: 5px 15px;
    border-radius: 50px;
    font-weight: bold;
    font-size: 14px;
}

/* PDF ডাউনলোড বাটন */
.btn-download {
    background: transparent;
    border: 1.5px solid #003366;
    color: #003366;
    padding: 6px 18px;
    border-radius: 8px;
    font-weight: 600;
    transition: 0.3s;
    font-size: 13px;
}

.btn-download:hover {
    background: #003366;
    color: #fff;
}

/* মোবাইল রেসপন্সিভ স্ক্রল ফিক্স */
@media (max-width: 768px) {
    .awesome-result-section .container-fluid {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .custom-result-table {
        min-width: 750px !important; /* মোবাইলে টেবিলটি যেন না ভেঙে স্ক্রল হয় */
    }
}

/* কাস্টম গোল্ডেন স্ক্রলবার */
.table-responsive::-webkit-scrollbar {
    height: 6px;
}
.table-responsive::-webkit-scrollbar-thumb {
    background: #FFCC00;
    border-radius: 10px;
}
.table-responsive::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* টেক্সট র‍্যাপিং ফিক্স */
.text-nowrap {
    white-space: nowrap !important;
}




/* --- Fluid Student Info Styling --- */
.search-card-wide {
    background: var(--primary-blue);
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 51, 102, 0.15);
}

.fluid-input {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    padding: 12px 15px;
    border-radius: 8px;
}

.fluid-input::placeholder { color: rgba(255,255,255,0.6); }

.profile-card-fluid {
    border-radius: 20px;
    overflow: hidden;
    background: #fff;
}

.profile-side-panel {
    background: linear-gradient(180deg, #003366 0%, #001a33 100%);
    min-height: 100%;
}

.profile-img-border {
    border: 5px solid rgba(255, 255, 255, 0.1);
    width: 150px;
    height: 150px;
    object-fit: cover;
}

.profile-heading {
    color: var(--primary-blue);
    font-weight: 800;
    position: relative;
    padding-left: 15px;
}

.profile-heading::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 25px;
    background: var(--accent-gold);
}

.info-item label {
    font-size: 12px;
    text-transform: uppercase;
    color: #888;
    display: block;
    margin-bottom: 5px;
    letter-spacing: 1px;
}

.info-item h6 {
    font-weight: 700;
    color: #333;
}

/* Mobile Fix */
@media (max-width: 991px) {
    .profile-side-panel {
        min-height: auto;
    }
}

/* ============================================================
   GALLERY SECTION - PERFECT FIX
   ============================================================ */

   .awesome-gallery-section {
    background: #ffffff;
    padding-top: 60px;
    padding-bottom: 80px;
    overflow: hidden; /* সেকশন যেন বাইরে না যায় */
}

/* টিচার পেজ ও রেজাল্ট পেজের সাথে সাইজ মেলানোর জন্য */
.awesome-gallery-section .container-fluid {
    padding-left: 5% !important;
    padding-right: 5% !important;
}

/* ফিল্টার বাটন স্টাইল */
.gallery-filter-btns {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

.btn-filter {
    padding: 8px 22px;
    border-radius: 50px;
    border: 1.5px solid var(--primary-blue);
    background: transparent;
    color: var(--primary-blue);
    font-weight: 600;
    transition: 0.3s ease-in-out;
}

.btn-filter:hover, .btn-filter.active {
    background: var(--primary-blue);
    color: #fff;
    box-shadow: 0 5px 15px rgba(0, 51, 102, 0.2);
}

/* গ্যালারি কার্ড স্টাইল */
.gallery-card {
    position: relative;
    border-radius: 15px; /* রেজাল্ট কার্ডের সাথে মিল রেখে */
    overflow: hidden; /* এটিই ইমেজ জুমকে কার্ডের ভেতর আটকে রাখবে */
    height: 280px;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    z-index: 1;
}

.gallery-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* হোভার করলে ইমেজ জুম হবে কিন্তু হিরো সেকশনে প্রভাব ফেলবে না */
.gallery-card:hover img {
    transform: scale(1.1);
}

/* ছবির ওপরের ব্লু-গোল্ডেন পর্দা (Overlay) */
.gallery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0, 51, 102, 0.9) 0%, rgba(255, 204, 0, 0.1) 100%);
    display: flex;
    align-items: flex-end;
    padding: 25px;
    opacity: 0;
    transition: all 0.4s ease;
}

.gallery-card:hover .gallery-overlay {
    opacity: 1;
}

.overlay-content h5 {
    color: #fff;
    font-weight: 700;
    margin-bottom: 2px;
    transform: translateY(20px);
    transition: 0.4s ease;
}

.gallery-card:hover .overlay-content h5 {
    transform: translateY(0);
}

/* মোডাল ওপেন হলে হিরো সেকশন লাফালাফি বন্ধ করার ফিক্স */
body.modal-open {
    overflow: auto !important; /* স্ক্রলবার হাইড হওয়া বন্ধ করবে */
    padding-right: 0 !important;
}

.modal-backdrop {
    display: none !important; /* যদি ব্যাকড্রপ সমস্যা করে তবে এটি সরাতে পারেন, নতুবা বাদ দিন */
}

/* মোডাল কাস্টমাইজেশন */
.modal-content {
    border-radius: 20px;
    border: none;
}

.modal-header {
    background: var(--primary-blue);
    color: white;
    border-bottom: 2px solid var(--accent-gold);
}

/* মোবাইল রেসপন্সিভ */
@media (max-width: 768px) {
    .gallery-card {
        height: 220px;
    }
    .awesome-gallery-section .container-fluid {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}


.about-us-complete {
    font-family: 'Hind Siliguri', sans-serif;
    background: #ffffff;
    padding: 80px 0;
    overflow: hidden;
}

.about-us-complete .container-fluid {
    padding-left: 5% !important;
    padding-right: 5% !important;
}

/* ইমেজ স্ট্যাকিং */
.about-img-stack {
    height: 480px;
    position: relative;
}

.stack-item {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
}

.item-1 {
    width: 85%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.item-1 img {
    height: 400px;
    width: 100%;
    object-fit: cover;
}

.item-2 {
    width: 55%;
    position: absolute;
    bottom: 20px;
    right: 0;
    z-index: 2;
    border: 10px solid #ffffff;
}

.item-2 img {
    height: 280px;
    width: 100%;
    object-fit: cover;
}

/* এক্সপেরিয়েন্স ব্যাজ */
.exp-badge-new {
    position: absolute;
    top: 30px;
    right: 12%;
    background: rgb(255, 204, 0); /* আপনার দেওয়া গোল্ডেন কালার */
    color: #000;
    padding: 25px 20px;
    border-radius: 15px;
    text-align: center;
    z-index: 3;
    box-shadow: 0 10px 25px rgba(255, 204, 0, 0.4);
}

.exp-badge-new h2 {
    font-weight: 800;
    line-height: 1;
    font-size: 2.5rem;
}

/* গোল্ডেন ফিচার বক্স */
.feature-box-gold {
    background: rgb(255, 204, 0) !important; /* গোল্ডেন ব্যাকগ্রাউন্ড */
    padding: 15px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    transition: 0.3s;
    border: 1px solid rgba(0,0,0,0.05);
}

.feature-box-gold:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(255, 204, 0, 0.3);
}

/* কার্ড স্টাইলিং */
.about-fancy-card {
    background: #ffffff;
    border: 1px solid #eee;
    border-radius: 20px;
    transition: 0.4s;
}

.highlighted-card {
    background: #003366 !important;
    color: #ffffff !important;
    transform: translateY(-10px);
    border: none;
    box-shadow: 0 15px 30px rgba(0, 51, 102, 0.2);
}

.fancy-icon {
    font-size: 3.5rem;
    color: #003366;
}

.highlighted-card .fancy-icon {
    color: rgb(255, 204, 0) !important;
}

/* কাউন্টার সেকশন */
.counter-wrap { 
    margin-top: 60px; 
    background-color: #003366 !important; 
}

.border-end-white {
    border-right: 1px solid rgba(255,255,255,0.1);
}

@media (max-width: 991px) {
    .about-img-stack { height: 380px; margin-bottom: 40px; }
    .item-2 { display: none !important; }
    .item-1 { width: 100%; }
    .border-end-white { border: none; border-bottom: 1px solid rgba(255,255,255,0.1); }
}


.contact-section {
    font-family: 'Hind Siliguri', sans-serif;
    background: #fdfdfd;
}

.contact-section .container-fluid {
    padding-left: 5% !important;
    padding-right: 5% !important;
}

.rounded-20 { border-radius: 20px; }

/* বাম পাশের কার্ড */
.icon-box {
    width: 45px;
    height: 45px;
    background: rgba(255, 204, 0, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: rgb(255, 204, 0);
    font-size: 1.2rem;
}

.gold-text { color: rgb(255, 204, 0); }

.social-btn {
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,0.1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: white;
    border-radius: 50%;
    text-decoration: none;
    transition: 0.3s;
}

.social-btn:hover {
    background: rgb(255, 204, 0);
    color: #003366;
    transform: translateY(-3px);
}

/* ফর্ম ডিজাইন */
.custom-input {
    border: 1px solid #e0e0e0;
    padding: 12px 15px;
    border-radius: 10px;
    transition: 0.3s;
}

.custom-input:focus {
    border-color: #003366;
    box-shadow: 0 0 0 0.2rem rgba(0, 51, 102, 0.1);
}

.btn-send {
    background: rgb(255, 204, 0);
    color: #000;
    border: none;
    border-radius: 10px;
    transition: 0.3s;
    width: 100%;
}

.btn-send:hover {
    background: #003366;
    color: white;
    box-shadow: 0 10px 20px rgba(0, 51, 102, 0.15);
}

@media (max-width: 991px) {
    .contact-info-card { margin-bottom: 20px; }
}



/*keno amader serthotto start*/
.rounded-custom {
    border-radius: 50px 5px 50px 5px; /* ইউনিক বর্ডার রেডিয়াস */
    border: 10px solid #fff;
}

.feature-img-wrapper {
    padding: 20px;
}

/* অভিজ্ঞতার ব্যাজ */
.experience-badge {
    position: absolute;
    bottom: 10%;
    right: -5%;
    background: rgb(255, 204, 0);
    color: #003366;
    padding: 20px 30px;
    border-radius: 20px;
    text-align: center;
    animation: float 3s ease-in-out infinite;
}

/* মডার্ন কার্ড ডিজাইন */
.modern-card {
    display: flex;
    gap: 20px;
    padding: 25px;
    background: #fff;
    border-radius: 20px;
    transition: 0.3s;
    border: 1px solid rgba(0, 51, 102, 0.05);
}

.modern-card:hover {
    background: #003366;
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 51, 102, 0.15);
}

.modern-card:hover h5 { color: rgb(255, 204, 0); }
.modern-card:hover p { color: rgba(255, 255, 255, 0.7) !important; }

.card-icon {
    width: 60px;
    height: 60px;
    background: rgba(0, 51, 102, 0.1);
    color: #003366;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    flex-shrink: 0;
    transition: 0.3s;
}

.modern-card:hover .card-icon {
    background: rgba(255, 255, 255, 0.1);
    color: rgb(255, 204, 0);
}

/* ভাসা ভাসা অ্যানিমেশন */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

@media (max-width: 991px) {
    .experience-badge { display: none; }
}





/*slim-stats section start*/

.pulse-gold {
    animation: pulse-animation 2s infinite;
    border-radius: 50%;
}

@keyframes pulse-animation {
    0% { box-shadow: 0 0 0 0px rgba(255, 204, 0, 0.4); }
    100% { box-shadow: 0 0 0 15px rgba(255, 204, 0, 0); }
}

/* ২. নিচ থেকে ভেসে ওঠার এনিমেশন (Reveal) */
.reveal-up {
    animation: slide-up 0.8s ease-out forwards;
    opacity: 0;
    transform: translateY(30px);
}

@keyframes slide-up {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* আইকন কালার */
.stat-icon-slim {
    font-size: 24px;
    color: rgb(255, 204, 0);
}

/*mission and vission start*/

.mission-vision h2 {
    font-size: 2.5rem;
}

.title-divider {
    transition: width 0.3s ease;
}

/* মোবাইলে হেডলাইন সাইজ কিছুটা ছোট হবে */
@media (max-width: 768px) {
    .mission-vision h2 {
        font-size: 1.8rem;
    }
}



/*home work starte */

.title-line { width: 60px; height: 4px; background: rgb(255, 204, 0); border-radius: 10px; margin-top: 15px; }

/* ফিল্টার ডিজাইন */
.filter-wrapper {
    background: #ffffff;
    border-radius: 15px;
    border: 1px solid rgba(0, 51, 102, 0.05);
}

.btn-search-gold {
    background: #003366;
    color: rgb(255, 204, 0);
    border: none;
    border-radius: 10px;
    transition: 0.3s;
}
.btn-search-gold:hover {
    background: rgb(255, 204, 0);
    color: #003366;
    transform: translateY(-2px);
}

/* কার্ড ডিজাইন */
.homework-card {
    background: #ffffff;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(0, 51, 102, 0.05);
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    height: 100%;
}

.homework-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,51,102,0.1);
}

.card-top-accent { width: 100%; height: 5px; background: #003366; }
.card-top-accent-gold { width: 100%; height: 5px; background: rgb(255, 204, 0); }

/* আইকন বক্স */
.subject-icon-box { width: 50px; height: 50px; background: rgba(0, 51, 102, 0.1); color: #003366; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 24px; }
.subject-icon-box-gold { width: 50px; height: 50px; background: rgba(255, 204, 0, 0.2); color: #b8860b; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 24px; }

/* ট্যাগ ও ইন্ডিকেটর */
.date-tag { font-size: 11px; font-weight: 700; color: #888; text-uppercase: uppercase; letter-spacing: 0.5px; }
.status-indicator { font-size: 12px; color: #28a745; font-weight: 600; margin-top: 10px; }
.status-indicator-gold { font-size: 12px; color: #003366; font-weight: 600; margin-top: 10px; }

.leading-relaxed { line-height: 1.7; font-size: 14.5px; }

/* শ্যাডো ইফেক্ট */
.active-card { border: 1px solid rgba(255, 204, 0, 0.3); }

@media (max-width: 768px) {
    .filter-wrapper { padding: 10px; }
}


/*group css start*/
/* জেনারেল স্টাইল */
.rounded-4 { border-radius: 1.25rem !important; }
.bg-light { background-color: #f8fbff !important; }

/* ট্যাব বাটন স্টাইল */
.custom-tabs .nav-link {
    color: #555;
    font-weight: 600;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid transparent;
}
.custom-tabs .nav-link:hover {
    color: #003366;
    background: rgba(0, 51, 102, 0.05);
}

.custom-tabs .nav-link.active {
    border: 2px solid #ffcc00;
    background-color: #003366 !important;
    color: #ffcc00 !important;
    box-shadow: 0 8px 20px rgba(0, 51, 102, 0.15);
}

/* টেবিল স্টাইল */
.table thead th {
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.table tbody tr {
    transition: background 0.3s;
}

/* শিক্ষক ও হোমওয়ার্ক কার্ড অ্যানিমেশন */
.hover-lift {
    transition: transform 0.3s, box-shadow 0.3s;
}
.hover-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1) !important;
}

.teacher-card img {
    height: 250px;
    object-fit: cover;
}

/* আইকন বক্স */
.icon-shape {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
}


.rounded-4 { border-radius: 1.25rem !important; }
.custom-tabs .nav-link {
    color: #003366;
    font-weight: 600;
    transition: all 0.3s ease;
}
.custom-tabs .nav-link.active {
    background-color: #003366 !important;
    color: #ffcc00 !important;
    box-shadow: 0 8px 20px rgba(0, 51, 102, 0.1);
}
.table-bordered td, .table-bordered th {
    border-color: #eee !important;
}
.tab-pane {
    animation: fadeIn 0.5s ease;
}
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}



/*online apply cs start*/

.round-20 { border-radius: 20px; }
.round-50 { border-radius: 50px !important; }

/* ইনপুট ফিল্ড ডিজাইন */
.custom-input {
    border: 1px solid #dee2e6;
    padding: 12px 15px;
    border-radius: 8px !important;
    background-color: #fcfcfc;
    transition: all 0.3s;
}

/* এরর স্টেট - যখন ভুল হবে */
.custom-input.is-invalid {
    border-color: #dc3545 !important;
    background-color: #fff8f8 !important;
}

.error-msg {
    font-size: 11px;
    color: #dc3545;
    font-weight: 600;
    margin-top: 4px;
}

/* বাটন কালার */
.btn-gold { background: #ffcc00; color: #002a52; font-weight: bold; border: none; transition: 0.3s; }
.btn-gold:hover { background: #e6b800; transform: translateY(-2px); }
.btn-navy { background: #002a52; color: #fff; font-weight: bold; border: 2px solid #ffcc00; }

/* বাম পাশের স্টেপ আইকন */
.v-step { display: flex; align-items: center; margin-bottom: 35px; opacity: 0.4; transition: 0.4s; }
.v-step.active { opacity: 1; }
.v-number { width: 38px; height: 38px; border: 2px solid #ffcc00; border-radius: 50%; text-align: center; line-height: 34px; font-weight: bold; color: #ffcc00; margin-right: 15px; }
.v-step.active .v-number { background: #ffcc00; color: #002a52; box-shadow: 0 0 10px rgba(255,204,0,0.4); }
.v-text { font-weight: bold; font-size: 14px; }
.v-text span { display: block; font-size: 11px; font-weight: normal; color: #aaa; }


/*ata amr notice css start*/
.round-15 { border-radius: 15px !important; }
.round-50 { border-radius: 50px !important; }
.round-10 { border-radius: 10px !important; }
.text-navy { color: #002a52 !important; }

.filter-container::-webkit-scrollbar {
    display: none; 
}
.filter-container {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.btn-filter {
    border: none !important;
    background: transparent;
    color: #002a52;
    font-weight: bold;
    white-space: nowrap; 
    font-size: 0.9rem;
    transition: 0.3s;
}

.btn-filter.active {
    background: #002a52 !important;
    color: #ffcc00 !important;
}

.notice-card {
    transition: 0.3s;
}

@media (min-width: 992px) {
    .notice-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 15px 30px rgba(0, 42, 82, 0.12) !important;
    }
}

.btn-gold {
    background: #ffcc00 !important;
    color: #002a52 !important;
    border: none !important;
    font-weight: 600;
}

.btn-outline-navy {
    border: 1px solid #002a52 !important;
    color: #002a52 !important;
    font-weight: 600;
}

.btn-navy-active {
    background: #002a52 !important;
    color: #ffcc00 !important;
}

.page-link {
    font-weight: bold;
    color: #002a52;
}
@media (max-width: 576px) {
    .display-5 { font-size: 2.5rem; }
    .h5 { font-size: 1.1rem; }
    .action-btns { width: 100%; }
    .btn-filter { padding-left: 15px !important; padding-right: 15px !important; }
}