/*
 * MLOK ALRIMAL CONTRACTING - Viewport Responsive Tweaks
 */

@media (max-width: 991.98px) {
  .hero-content h1 {
    font-size: 3rem;
  }
  .subpage-hero h1 {
    font-size: 2.8rem;
  }
  .about-experience-badge {
    position: static;
    margin-top: 2rem;
    max-width: 250px;
  }
  .about-img-box::before {
    display: none;
  }
  .process-connector {
    display: none;
  }
  .process-step {
    margin-bottom: 2.5rem;
  }
  .inquiry-panel {
    width: 300px;
    left: -300px;
  }
  .contact-form-container {
    padding: 2rem;
  }
  .timeline-container::after {
    left: 20px;
  }
  .timeline-item {
    width: 100%;
    padding-left: 50px;
    padding-right: 0;
    margin-bottom: 1.5rem;
  }
  .timeline-right {
    left: 0%;
  }
  .timeline-item::after {
    left: 12px;
  }
  .timeline-right::after {
    left: 12px;
  }
}

@media (max-width: 767.98px) {
  .hero-content h1 {
    font-size: 2.3rem;
  }
  .subpage-hero h1 {
    font-size: 2.2rem;
  }
  .section-title h2 {
    font-size: 2rem;
  }
  .navbar-brand {
    font-size: 1.3rem;
  }
  .back-to-top {
    bottom: 20px;
    right: 20px;
    width: 44px;
    height: 44px;
  }
  .whatsapp-float {
    bottom: 75px;
    right: 20px;
    width: 44px;
    height: 44px;
  }
  .ba-container {
    height: 320px;
  }
  .portfolio-filter {
    gap: 5px;
  }
  .filter-btn {
    padding: 0.4rem 1rem;
    font-size: 0.8rem;
  }
}

@media (max-width: 575.98px) {
  .hero-content h1 {
    font-size: 1.8rem;
  }
  .hero-content p {
    font-size: 1rem;
  }
  .about-experience-badge {
    max-width: 100%;
  }
  .timeline-content {
    padding: 1.2rem;
  }
  .contact-info-card {
    padding: 1.5rem;
  }
}