/* =====================================
   MOBILE RESPONSIVE (<= 768px)
===================================== */
@media (max-width: 768px) {
  :root {
    --container-padding: 20px 5%;
  }

  section {
    scroll-margin-top: 8vh;
  }

  /* ---------- NAVBAR ---------- */
  .ip_navbar {
    height: 8vh;
    padding: 0 16px;
  }

  .logo img {
    height: 50px;
  }

  .ip_nav_links {
    position: fixed;
    top: 8vh;
    left: -100%;
    width: 70%;
    height: calc(100vh - 8vh);
    background: var(--bg-gradient);
    padding-top: 5%;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    gap: 32px;
    transition: left 0.4s ease;
    z-index: 999;
    padding-left: 5%;
  }
  .ip_nav_links li a {
    font-size: 24px;
  }
  .ip_nav_links li a::before {
    display: block;
  }
  .ip_nav_links.active {
    left: 0;
  }

  .nav-actions {
    display: none;
  }

  .hamburger {
    display: block;
  }
  .mobile-btn {
    display: flex;
    flex-direction: column;
    gap: 32px;
  }


  /* Vector Section */
  .vectorHeader h2 {
    font-size: 2rem;
  }
  .vectorHeader p {
    font-size: 1rem;
  }

  .comparison-row {
    flex-direction: column;
  }

  /* ---------- ABOUT SECTION ---------- */
  .about-container {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .about-headline {
    font-size: 28px;
  }

  .about-visuals {
    height: 350px;
  }

  

  



  /* ---------- FOOTER ---------- */
  .footer-content {
    grid-template-columns: 1fr; /* Single column stack */
    text-align: center;
    gap: 40px;
  }

  .brand-col,
  .contact-col {
    display: flex;
    flex-direction: column;
    align-items: center; /* Centers the logo and contact boxes */
  }

  .social-orbit {
    justify-content: center;
  }

  .link-list a {
    justify-content: center; /* Centers links in the middle */
  }

  .link-list a::before {
    display: none; /* Optional: Remove arrow on mobile to save space */
  }

  .contact-item {
    justify-content: flex-start; /* Keep text left-aligned inside the centered box */
    width: 100%;
    max-width: 300px; /* Prevents contact boxes from being too wide */
  }

  .footer-bottom {
    flex-direction: column;
    gap: 10px;
  }



  
.ip2026-unified-header {
  margin: 0 auto 2rem;
}
/* Main title */
.ip2026-unified-header h2 {
  font-size: 2rem;
}

}

/* =====================================
   TABLET RESPONSIVE (768px – 1024px)
===================================== */
@media (min-width: 769px) and (max-width: 1024px) {
  :root {
    --container-padding: 24px 6%;
  }

  /* ---------- NAVBAR ---------- */
  .ip_navbar {
    height: 75px;
    padding: 0 4%;
  }

  .al_logo img {
    height: 60px;
  }

  .ip_nav_links {
    gap: 24px;
  }

  .ip_nav_links li a {
    font-size: 1rem;
  }

  .al_nav_actions {
    gap: 20px;
  }

  .ip_order_btn {
    width: 120px;
    height: 38px;
    font-size: 14px;
  }

  /* ---------- HERO SLIDER ---------- */
  .hero-slider-section {
    height: 64vh;
  }

  /* ---------- ABOUT SECTION ---------- */
  .about-container {
    grid-template-columns: 1fr;
    gap: 50px;
  }

  .about-headline {
    font-size: 32px;
  }

  .about-visuals {
    height: 420px;
  }

  
 


  /* ---------- FOOTER ---------- */
  .footer-content {
    grid-template-columns: 1fr 1fr; /* Two columns for tablets */
    gap: 30px;
  }

  .footer-logo {
    grid-column: span 2;
    text-align: center;
  }

  .social-orbit {
    justify-content: center;
  }

  .footer-bottom {
    flex-direction: column;
    gap: 12px;
  }

 
}