/* =========================================================
   [Institute Name] — Responsive Stylesheet
   ========================================================= */

/* ---------- Large desktop refinement ---------- */
@media (min-width: 1536px){
  .container-xl{ max-width: 1400px; }
}

/* ---------- Tablets & below (mega menu / desktop nav off) ---------- */
@media (max-width: 1024px){
  .main-nav{ display:none; }
  .header-call-btn{ display:none; }
  .hamburger-btn{ display:flex !important; }
  .mega-panel, .dropdown-panel{ display:none; }
  .site-header .container-xl{ padding-block: .85rem !important; }
  .logo-text-sub{ display:none; }
}
@media (min-width: 1025px){
  .mobile-nav, .mobile-overlay, .hamburger-btn{ display:none !important; }
}

/* ---------- Hero ---------- */
@media (max-width: 768px){
  .container-xl{ padding-inline: 1rem; }
  .py-20{ padding-top: 4.25rem !important; padding-bottom: 4.25rem !important; }
  .page-hero{ padding: 5.25rem 0 3rem; }
  .logo-mark{ width:42px; height:42px; border-radius:10px; }
  .logo-text-main{ font-size:1rem; }
  .hero-editor-strip-wrap{ padding-top: .75rem; }
  .hero-editor-strip{ flex-direction:column; gap:.45rem; border-radius: 16px 16px 0 0; }
  .hero-slide{ height: 560px; }
  .hero-overlay{ background: linear-gradient(180deg, rgba(14,12,11,.24) 0%, rgba(14,12,11,.72) 42%, rgba(14,12,11,.94) 100%); }
  .hero-content{ justify-content:flex-end; padding-bottom: 4.25rem; }
  .hero-layout{ grid-template-columns: 1fr; gap: 1.2rem; }
  .hero-copy{ max-width:100%; }
  .hero-note-card{ justify-self:start; max-width:100%; padding: 1rem; }
  .hero-note-title{ font-size: 1.05rem; }
  .hero-note-text, .hero-note-list li{ font-size:.88rem; }
  .hero-title{ margin-block: .75rem; }
  .hero-text{ max-width:100%; }
  .hero-pagination{ bottom: 18px !important; }
  .swiper-button-next.hero-nav, .swiper-button-prev.hero-nav{ width:38px; height:38px; }
  .swiper-button-next.hero-nav:after, .swiper-button-prev.hero-nav:after{ font-size:14px; }
  .course-card .p-5{ padding: .95rem !important; }
  .gallery-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .topper-card{ padding: 1.8rem 1.2rem 1.45rem; }
  .faq-question{ padding: 1rem 1.1rem; }
  .faq-answer-inner{ padding: 0 1.1rem 1rem; }
}
@media (max-width: 480px){
  .hero-slide{ height: 540px; min-height: 520px; }
  .hero-content{ padding-bottom: 4.6rem; }
  .hero-content .btn{ width: 100%; }
  .hero-cta-group{ flex-direction: column; align-items: stretch !important; }
}

/* ---------- About / overlap image ---------- */
@media (max-width: 768px){
  .about-badge-float{ position: static !important; margin-top: 1rem; transform:none !important; }
}

/* ---------- Topper photo offset on small screens ---------- */
@media (max-width: 480px){
  .topper-photo-wrap{ width:80px; height:80px; margin-top: -3.1rem; }
}

/* ---------- Logo slider ---------- */
@media (max-width: 480px){
  .logo-slide-box{ height:76px; }
}

/* ---------- CTA band buttons stack ---------- */
@media (max-width: 640px){
  .mobile-nav{ width:min(100vw, 340px); }
  .mobile-nav .p-5{ padding: 1.25rem; }
  .mobile-accordion-btn{ padding: .85rem 0; }
  .mobile-submenu a{ padding-top:.65rem !important; padding-bottom:.65rem !important; }
  .hero-nav{ display:none !important; }
  .hero-badge{ font-size:.72rem; padding:.38rem .85rem; }
  .hero-cta-group{ gap: .85rem !important; }
  .hero-note-card{ display:none; }
  .course-card .p-5{ padding: .9rem !important; }
  .course-card h3{ font-size: .95rem !important; }
  .gallery-grid{ grid-template-columns: 1fr; }
  .gallery-modal{ padding: .8rem; }
  .gallery-modal-dialog{ border-radius: 20px; }
  .gallery-modal-image-wrap{ border-radius: 20px 20px 0 0; }
  .footer-cols{ gap: 2rem; }
  .cta-buttons-row{ flex-direction: column; align-items: stretch !important; }
  .cta-buttons-row .btn{ width:100%; }
}

/* ---------- Course banner card (course details) ---------- */
@media (max-width: 900px){
  .course-banner-grid{ grid-template-columns: 1fr !important; }
}

/* ---------- Tabs become stacked accord337 on mobile ---------- */
@media (max-width: 640px){
  .tab-buttons-row{ flex-wrap: wrap; }
  .tab-btn{ flex: 1 1 45%; text-align:center; }
}

/* ---------- Tables: horizontal scroll wrapper ---------- */
@media (max-width: 640px){
  .table-scroll{ overflow-x:auto; -webkit-overflow-scrolling: touch; }
  .doc-table{ min-width: 560px; }
}

/* ---------- Result / Admit card / Certificate photo layout ---------- */
@media (max-width: 640px){
  .doc-top-grid{ flex-direction: column; text-align:center; align-items:center !important; }
}

/* ---------- Footer stacking ---------- */
@media (max-width: 640px){
  .footer-cols{ text-align:left; }
}

/* ---------- Form buttons full width ---------- */
@media (max-width: 640px){
  .form-actions{ flex-direction: column; }
  .form-actions .btn{ width:100%; }
}

/* ---------- WhatsApp float safe area on mobile ---------- */
@media (max-width: 480px){
  .whatsapp-float{ width:66px; height:66px; right:10px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
  .whatsapp-float-icon, .whatsapp-float img, .whatsapp-float svg{ width:48px; height:48px; }
  .back-to-top{ right:14px; bottom: calc(78px + env(safe-area-inset-bottom, 0px)); width:40px; height:40px; }
  .whatsapp-tooltip{ display:none; }
}

/* ---------- Prevent horizontal scroll ---------- */
html, body{ max-width: 100%; overflow-x: hidden; }
img, svg{ max-width: 100%; height: auto; }
.course-card img, .hero-slide img, .page-hero img{ height:100%; }