/* ==========================================================================
   IAS VISION Responsive Stylesheet
   ========================================================================== */

/* --- Mobile First Default Styles (Up to 767px) --- */
@media (max-width: 767px) {
  .section {
    padding: var(--spacing-section-mobile) 0;
  }

  .section__heading {
    font-size: 1.6rem;
    margin-bottom: 20px;
  }

  /* Header adjustments */
  .header__nav {
    display: none; /* Hidden on mobile/tablet, hamburger used instead */
  }

  .header__actions {
    gap: 8px;
  }

  .header__btn-phone span {
    display: none; /* Hide phone number text, keep icon */
  }

  .header__hamburger {
    display: flex;
    margin-left: 5px;
  }

  /* Hero adjustments */
  .hero {
    padding: 40px 0;
  }

  .hero__container {
    grid-template-columns: 1fr;
    gap: 20px;
    text-align: center;
  }

  .hero__eyebrow {
    font-size: 12px;
  }

  .hero__title {
    font-size: 26px;
  }

  .hero__list-item {
    justify-content: center;
  }

  .hero__image-wrapper {
    max-width: 400px;
    margin: 0 auto;
  }

  /* Info bar */
  .info-bar__list {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .info-bar__divider {
    display: none;
  }

  .info-bar__item {
    justify-content: center;
    border-bottom: 1px solid var(--color-border);
    padding-bottom: 8px;
  }

  .info-bar__item:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }

  /* Courses grid */
  .courses-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .course-card {
    flex-direction: column;
    text-align: center;
    align-items: center;
  }

  /* Programmes grid */
  .programmes-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  /* Success stories */
  .stories-row {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  /* Student reviews */
  .reviews-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .featured-review {
    grid-template-columns: 1fr;
    padding: 20px;
    text-align: center;
  }

  /* Contact page */
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .contact-form__card {
    padding: 20px;
  }

  /* Footer */
  .footer__grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  /* Drawer panel */
  .drawer {
    width: 100%;
    left: -100%;
  }
}

/* --- Mobile Medium (min-width: 480px) --- */
@media (min-width: 480px) {
  .header__btn-phone span {
    display: inline; /* Show phone number on slightly larger devices */
  }
}

/* --- Tablet Devices (min-width: 768px) and up --- */
@media (min-width: 768px) {
  .header__hamburger {
    display: flex; /* Kept on tablet to open large slide menu drawer */
  }

  .header__nav {
    display: none; /* Hide primary links until desktop (1024px) for spacing */
  }

  /* Hero */
  .hero__title {
    font-size: 32px;
  }

  /* Courses grid */
  .courses-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Programmes grid */
  .programmes-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Success stories */
  .stories-row {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Student reviews */
  .reviews-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Footer */
  .footer__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
  }
}

/* --- Desktop Devices (min-width: 1024px) and up --- */
@media (min-width: 1024px) {
  /* Show nav links on desktop */
  .header__nav {
    display: flex;
  }

  /* Hide hamburger on desktop since menu is accessible in the main header nav */
  /* Wait, prompt says: "Right side nav links: Home | Menu | About Us | Blogs | Contact Us. Clicking 'Menu' opens left-side slide-out panel." */
  /* This means the 'Menu' link in the main navigation list triggers the drawer on desktop! */
  .header__hamburger {
    display: none;
  }

  /* Hero banner columns side-by-side */
  .hero__container {
    grid-template-columns: 60% 40%;
    text-align: left;
  }

  .hero__list-item {
    justify-content: flex-start;
  }

  /* Programmes grid */
  .programmes-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Contact page */
  .contact-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Footer */
  .footer__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ==========================================================================
   Print Stylesheet
   ========================================================================== */
@media print {
  .header,
  .footer,
  .sticky-enquire,
  .whatsapp-float,
  .drawer,
  .modal,
  .btn,
  .video-container,
  .carousel-dots {
    display: none !important;
  }

  body {
    color: #000;
    background: #FFF;
    font-size: 12pt;
  }

  .container {
    width: 100%;
    max-width: 100%;
    padding: 0;
  }

  .section {
    padding: 20px 0 !important;
    page-break-inside: avoid;
  }
}

/* ==========================================================================
   Reduced Motion Preferences
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  
  *,
  *::before,
  *::after {
    animation-delay: -1ms !important;
    animation-duration: -1ms !important;
    animation-iteration-count: 1 !important;
    background-attachment: initial !important;
    scroll-behavior: auto !important;
    transition-duration: 0s !important;
    transition-delay: 0s !important;
  }
}