/* 
 * Braino LMS - Responsive Viewport Stylesheet
 * Breakpoints handling Desktop (1920px+), Laptops, Tablets, and Mobile
 */

/* 1. Ultra-Wide Desktop (1920px+) */
@media (min-width: 1920px) {
  .container {
    max-width: 1540px;
  }
  .hero-title {
    font-size: 3.75rem;
  }
  .hero-paragraph {
    font-size: 1.25rem;
  }
  .section-padding {
    padding: 120px 0;
  }
}

/* 2. Standard Laptops (1200px - 1440px) */
@media (max-width: 1400px) {
  .hero-title {
    font-size: 2.85rem;
  }
}

/* 3. Small Laptops & Tablets (992px - 1199px) */
@media (max-width: 1199px) {
  .hero-title {
    font-size: 2.5rem;
  }
  .section-title {
    font-size: 2rem;
  }
  .stat-number {
    font-size: 2.75rem;
  }
}

/* 4. Tablets & Mobile Drawers (Max 991px) */
@media (max-width: 991px) {
  .navbar-brand .brand-logo-img {
    height: 34px;
    max-height: 34px;
  }

  .navbar-collapse {
    background-color: #FFFFFF;
    padding: 20px;
    border-radius: var(--radius-md);
    margin-top: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  }
  
  .nav-link.active::after {
    display: none;
  }
  
  .nav-link {
    padding: 10px 12px !important;
  }
  
  .hero-section {
    padding: 110px 0 60px;
    text-align: center;
  }

  .hero-paragraph {
    margin-left: auto;
    margin-right: auto;
  }

  .hero-buttons {
    justify-content: center;
    margin-bottom: 40px;
  }

  .section-padding {
    padding: 70px 0;
  }

  .cta-card {
    text-align: center;
    padding: 40px 24px;
  }

  .contact-form-wrapper {
    padding: 28px 20px;
  }

  .contact-info-card {
    padding: 20px 16px;
    gap: 12px;
  }

  .contact-info-card h5 {
    font-size: 1rem;
  }
}

/* 5. Mobile Devices (Max 767px) */
@media (max-width: 767px) {
  .navbar-brand .brand-logo-img {
    height: 30px;
    max-height: 30px;
  }

  .hero-title {
    font-size: 2rem;
  }
  
  .hero-paragraph {
    font-size: 1rem;
  }

  .section-title {
    font-size: 1.75rem;
  }

  .hero-buttons .btn,
  .cta-card .btn {
    width: 100%;
  }

  .hero-buttons {
    flex-direction: column;
    gap: 12px;
  }

  .stats-card {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding: 20px 0;
  }

  .stats-card:last-child {
    border-bottom: none;
  }

  .stat-number {
    font-size: 2.5rem;
  }

  .footer-bottom {
    text-align: center;
  }

  .footer-legal-links {
    margin-top: 12px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
  }

  .footer-legal-links a {
    margin-left: 0;
  }
}

/* 6. Extra Small Screens (Max 480px) */
@media (max-width: 480px) {
  .navbar-brand .brand-logo-img {
    height: 26px;
    max-height: 26px;
  }

  .feature-card {
    padding: 28px 20px;
  }

  .cta-card {
    padding: 32px 16px;
  }
}