/* Mobile Surgical Fixes */
@media (max-width: 768px) {
  /* 1. Navbar Sync with Home */
  #nav nav {
    height: auto !important;
    padding: 1rem 0 !important;
    position: fixed !important;
    top: 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
    background: transparent !important; /* Start transparent like Home */
    backdrop-filter: none !important;
    transition: all 0.5s ease-in-out !important;
  }

  #nav nav.nav-scrolled {
    background: rgba(0, 51, 153, 0.85) !important;
    backdrop-filter: blur(12px) !important;
  }
  
  #nav nav > div {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 1rem !important;
    gap: 0.75rem !important;
  }

  #nav .flex.items-center:first-child {
    justify-content: center !important;
    width: 100% !important;
  }

  #nav div[role="navigation"] {
    display: flex !important;
    justify-content: flex-start !important;
    width: 100% !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    padding-bottom: 0.5rem !important;
    gap: 1.25rem !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* 2. Home Spacing Fixes (Using exact IDs) */
  #hero section {
    padding-top: 8rem !important;
    padding-bottom: 2rem !important;
  }

  #unidades .grid {
    grid-template-columns: 1fr !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1.5rem !important;
    padding: 0 5% !important; /* Symmetric margins */
  }

  /* 4. Refinamento Estético Form */
  #formConsultarPlanos-container {
    padding: 2.5rem 5% !important;
  }

  /* Blindagem UI */
  .hero-carousel-wrapper, #main-carousel, .carousel-item {
    pointer-events: auto !important;
  }
}
