/* -------------------------------------
   RESPONSIVE STYLES
-------------------------------------- */

/* Large screens (up to 1200px) */
@media (max-width: 1200px) {
  .grid-4 { grid-template-columns: repeat(3, 1fr); }
  .photo-grid { grid-template-columns: repeat(3, 1fr); }
  .footer-grid { grid-template-columns: repeat(2, 1fr); gap: 40px; }
  h2 { font-size: 2.2rem; }
  .slide-title { font-size: 3.5rem; }
}

/* Tablets & Medium screens (up to 991px) */
@media (max-width: 991px) {
  :root {
    --section-padding: 70px 0;
  }
  
  .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .split-layout { grid-template-columns: 1fr; gap: 40px; }
  
  /* Header */
  .top-contact span { display: none; }
  .nav-menu, .nav-actions .btn { display: none; }
  .mobile-menu-btn { display: block; }
  
  /* Hero */
  .slide-title { font-size: 3rem; }
  .slide-subtitle { font-size: 1.2rem; }
  .hero-slider { min-height: 500px; height: 80vh; }
  
  /* Welcome / About */
  .image-collage { height: 400px; max-width: 600px; margin: 0 auto; }
  
  /* Leadership */
  .message-card, .message-card.reverse { flex-direction: column; }
  .msg-image, .msg-content { width: 100%; }
  .msg-content { padding: 40px 30px; }
  .quote-icon { right: 30px; top: 30px; font-size: 3rem; }
  
  /* Contact */
  .contact-info { order: 2; }
  .contact-map { order: 1; margin-bottom: 20px; }
  .map-placeholder { height: 400px; }
}

/* Mobile Devices (up to 767px) */
@media (max-width: 767px) {
  :root {
    --section-padding: 50px 0;
  }
  
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .photo-grid { grid-template-columns: repeat(2, 1fr); }
  .sc-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; }
  
  h2 { font-size: 2rem; margin-bottom: 20px; }
  
  /* Header */
  .top-bar { display: none; }
  .logo-text h1 { font-size: 1.2rem; }
  
  /* Hero */
  .slide-title { font-size: 2.5rem; }
  .slide-actions { flex-direction: column; gap: 10px; }
  .slide-actions .btn { width: 100%; }
  
  /* Admission Strip */
  .strip-content { flex-direction: column; text-align: center; }
  .strip-buttons { width: 100%; justify-content: center; }
  
  /* Counters */
  .counter-box { margin-bottom: 30px; }
  
  /* Events */
  .event-card { flex-direction: column; }
  .event-img { width: 100%; height: 200px; }
  
  /* Testimonials */
  .testimonial-slider { padding: 30px 20px; }
  .testi-text { font-size: 1.05rem; }
  
  /* FAQ */
  .faq-question { font-size: 1.1rem; padding: 20px; }
  
  /* Footer */
  .fb-inner { flex-direction: column; text-align: center; }
}

/* Small Mobile (up to 480px) */
@media (max-width: 480px) {
  .photo-grid { grid-template-columns: 1fr; }
  
  .slide-title { font-size: 2rem; }
  .section-header h2 { font-size: 1.8rem; }
  
  .finance-card { padding: 30px 20px; }
  .feature-card { padding: 30px 20px; }
  
  /* Gallery Modal */
  .lightbox-close { top: 15px; right: 20px; }
  
  /* About Page */
  .page-title { font-size: 2.2rem; }
  .page-tagline { font-size: 1rem; }
  .timeline::before { left: 20px; }
  .timeline-item { padding-left: 60px; }
  .timeline-icon { left: 0; width: 40px; height: 40px; font-size: 1rem; }
  .vm-card { padding: 30px 20px; }
  .phil-card { flex-direction: column; text-align: center; }
  .phil-icon { margin: 0 auto; }
}

/* -------------------------------------
   ACADEMICS PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 991px) {
  .digital-grid { grid-template-columns: repeat(2, 1fr); }
  .curr-overview { padding: 40px 30px; }
}

@media (max-width: 767px) {
  .curr-grid { grid-template-columns: 1fr; }
  .digital-grid { grid-template-columns: 1fr; }
  .curr-overview { padding: 30px 20px; }
  .curr-overview h3 { font-size: 1.5rem; }
  .program-card { padding: 30px 20px; }
}

@media (max-width: 480px) {
  .programs-grid { grid-template-columns: 1fr; }
  .curr-overview { padding: 25px 15px; }
}

/* -------------------------------------
   FACULTY PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 991px) {
  .intro-image img { height: 350px !important; }
}
@media (max-width: 767px) {
  .intro-image img { height: 300px !important; margin-bottom: 20px; }
  .faculty-showcase-card { margin-bottom: 10px; }
}

/* -------------------------------------
   ACHIEVEMENTS PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 767px) {
  .cta-buttons-grid { flex-direction: column; }
  .cta-btn { width: 100%; }
}

/* -------------------------------------
   INFRASTRUCTURE PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 991px) {
  .campus-main-img { height: 400px; }
  .sports-card { height: 350px; }
  .flex-reverse-tablet { flex-direction: column-reverse; }
}
@media (max-width: 767px) {
  .campus-main-img { height: 250px; margin-bottom: 20px; }
  .sports-card { height: 300px; }
  .c-feature, .lab-card, .activity-box, .safety-card { margin-bottom: 15px; }
}

/* -------------------------------------
   SERVICES PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 767px) {
  .service-card.flex-row { flex-direction: column; text-align: center; align-items: center; }
  .service-card { margin-bottom: 15px; }
}

/* -------------------------------------
   FEE STRUCTURE PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 767px) {
  .download-box { padding: 30px 20px; }
  .download-details strong { display: block; margin-bottom: 5px; min-width: auto; }
}

/* -------------------------------------
   FEE PAYMENT PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 991px) {
  .payment-grid { grid-template-columns: 1fr; }
}

/* -------------------------------------
   NOTICE & CIRCULAR PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 767px) {
  .notice-card-inner { padding: 20px; }
  .notice-meta { flex-direction: column; align-items: flex-start; gap: 8px; }
  .notice-actions { flex-direction: column; width: 100%; }
  .notice-actions .btn { width: 100%; text-align: center; justify-content: center; }
}

/* -------------------------------------
   NEWS & EVENTS PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 767px) {
  .news-img-wrapper { height: 180px; }
  .event-img-wrapper { height: 200px; }
  .news-card-body, .event-card-body { padding: 25px 20px 20px; }
  .news-card, .event-card { margin-bottom: 20px; }
}

/* -------------------------------------
   SCHOOL CALENDAR PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 767px) {
  .ay-dates { flex-direction: column; gap: 15px; }
  .ay-date-box { max-width: 100%; }
  .calendar-header { flex-direction: column; gap: 15px; text-align: center; }
  .cal-day-header { font-size: 0.8rem; }
  .cal-day { font-size: 0.9rem; padding-top: 5px; }
  .cal-indicators .ind-dot { width: 4px; height: 4px; }
  .timeline-item { flex-direction: column; gap: 15px; }
  .timeline-date-box { width: 100%; padding: 10px; border-radius: var(--border-radius); flex-direction: row; justify-content: flex-start; gap: 10px; }
  .t-day { font-size: 1.5rem; margin-bottom: 0; }
  .t-month { font-size: 1rem; }
  .holiday-card { flex-direction: column; text-align: center; gap: 10px; }
  .activity-card { margin-bottom: 15px; }
}

/* -------------------------------------
   GALLERY PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 991px) {
  .photo-gallery-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
  .photo-gallery-grid { grid-template-columns: 1fr; }
  .gallery-page-trigger { height: 250px; }
  .adv-lightbox-prev, .adv-lightbox-next { padding: 10px; font-size: 2rem; }
  .adv-lightbox-prev { left: 5px; }
  .adv-lightbox-next { right: 5px; }
  .adv-lightbox-close { top: 10px; right: 15px; font-size: 2rem; }
  .adv-lightbox-caption h3 { font-size: 1.2rem; }
  .v-thumbnail { height: 220px; }
}

/* -------------------------------------
   STUDENT CORNER PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 991px) {
  .student-link-card { width: calc(50% - 12.5px); }
}

@media (max-width: 767px) {
  .student-link-card { width: 100%; padding: 20px; }
  .sc-icon { width: 50px; height: 50px; font-size: 1.8rem; margin-right: 15px; }
  .sc-content h3 { font-size: 1.1rem; }
}

/* -------------------------------------
   CONTACT US PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 991px) {
  .contact-info-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-form-wrapper { flex-direction: column; }
  .cf-left, .cf-right { width: 100%; }
  .cf-left { padding: 40px; }
  .cf-right { padding: 40px; }
}

@media (max-width: 767px) {
  .contact-info-grid { grid-template-columns: 1fr; }
  .cf-left, .cf-right { padding: 30px 20px; }
  .gap-20 { gap: 10px; }
  .alert-success { flex-direction: column; text-align: center; gap: 10px; }
  .map-container iframe { height: 350px; }
}

/* -------------------------------------
   HTML SITEMAP PAGE RESPONSIVE
-------------------------------------- */
@media (max-width: 991px) {
  .sitemap-grid { grid-template-columns: repeat(2, 1fr); }
  .styled-link-list.grid-4, .styled-link-list.grid-3 { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}

@media (max-width: 767px) {
  .sitemap-grid { grid-template-columns: 1fr; }
  .styled-link-list.grid-4, .styled-link-list.grid-3 { grid-template-columns: 1fr; gap: 0; }
  .sitemap-card { padding: 15px; }
  .sm-icon { font-size: 1.3rem; margin-right: 10px; width: 25px; }
}