<?php // _navbar.php ?> 
<header class="navbar">
  <div class="container inner">
    <div class="brand">
      <div class="title">
        <div>FEDERACIÓN DE</div>
        <small>TRANSPORTADORES ARGENTINOS</small>
      </div>
    </div>

    <button class="burger" id="burger" aria-label="Abrir menú"><i class="bi bi-list"></i></button>

    <nav class="nav-links" id="nav">
      <a href="index.php" class="active">INICIO</a>
      <a href="notas.php">NOTAS</a>

      <div class="nav-item has-submenu">
        <!-- SERVICIOS ya no navega, solo abre el submenú -->
        <a href="#" onclick="return false;">
          SERVICIOS
          <i class="bi bi-chevron-down chevron" aria-hidden="true"></i>
        </a>
        <div class="submenu" aria-label="Submenú de servicios">
          <a href="beneficios.php">Beneficios</a>
          <a href="estado_puerto.php">Info extra de puerto</a>
          <a href= "encuestas.php">Encuestas</a>
          <a href= "bolsa_trabajo.php">Bolsa de Trabajo</a>
          <a href= "market.php">Marketplace</a>
        </div>
      </div>
      <a href="autoridades.php">AUTORIDADES</a>
<a href="estado_camiones.php" class="nowrap">ESTADO DE PUERTO</a>

      <a href="delegaciones.php">DELEGACIONES</a>
      <a href="tarifas.php">TARIFAS</a>
      <a href="contacto.php">CONTACTO</a>
    </nav>

    <div class="social">
      <a href="https://www.facebook.com/share/19aQ41jjxB/" target="_blank" rel="noopener" aria-label="Facebook"><i class="bi bi-facebook"></i></a>
      <a href="https://x.com/afetra05?t=ZdX3j9XIGd2PvFizJYMcdg&s=09" target="_blank" rel="noopener" aria-label="X (Twitter)"><i class="bi bi-twitter-x"></i></a>
      <a href="https://www.instagram.com/fe_tr.a?igsh=ZHpqeHB2OW0yNXQw" target="_blank" rel="noopener" aria-label="Instagram"><i class="bi bi-instagram"></i></a>
      <a href="https://www.linkedin.com/in/federaci%C3%B3n-de-transportadores-argentinos-7a03b732b/" target="_blank" rel="noopener" aria-label="LinkedIn"><i class="bi bi-linkedin"></i></a>
    </div>
  </div>
</header>
<style>
.nav-links a {
  white-space: nowrap;
  padding: 8px 14px;
  display: inline-block;
}

    @media (max-width: 992px) {
  .navbar .brand .title div {
    font-size: 0.9rem;
  }

  .navbar .brand .title small {
    font-size: 0.7rem;
  }
}

@media (max-width: 768px) {
  .navbar .brand .title div {
    font-size: 0.8rem;
  }

  .navbar .brand .title small {
    font-size: 0.65rem;
  }
}

</style>