body { font-family: Arial, sans-serif; margin:0; padding:0; background:#f7f7f7; }
        header {
         display: flex;
         justify-content: space-between; /* logo la stânga, meniul la dreapta */
         align-items: center;            /* aliniere pe verticală la mijloc */
         padding: 10px 20px;
         background-color: #111;         /* fundal ca să nu fie transparent */
         border-bottom: 1px solid #ccc;  /* linie de separare jos (opțional) */
         padding:  10px;
         position: fixed;   /* fixează bara sus */
         top: 0;
         left: 0;
         width: 100%;
         z-index: 1000;     /* să fie deasupra altor elemente */
       }
       
       header img {
         height: 50px; /* ajustează dimensiunea logo-ului */
       }

       nav.active {
        display: flex; /* apare la click */
      }
       
       nav a {
         margin-left: 10px;
         text-decoration: none;
         color: white;
         /*  */
         padding: 0 20px;
       }

       nav a:last-child {
        border-bottom: none;
      }
       

        nav {
            background:#666;
            padding:5px;
            text-align:center;
            margin-right: 50px;
            border-radius: 20px;
        
        }
        /* nav a {
            color:#fff;
            text-decoration:none;
            margin:0 15px;
            font-weight:bold;
        } */
        nav a:hover {
            color:orange;
            font-weight: bold;
        }
        .banner {
            width:50%;
            max-height:300px;
            overflow:hidden;
        }
        .banner img {
            width:50%;
            display:block;
        }

        footer {
            background:#222;
            color:#aaa;
           
            padding:15px;
            font-size:14px;
        }

        .topbar {
         position: fixed;        /* fixat sus */
         top: 0;
         left: 0;
         width: 100%;
         background: #fff;       /* fundal alb (poți schimba) */
         display: flex;         
         justify-content: space-between; /* logo+titlu la stânga, meniu la dreapta */
         align-items: center;    /* centrare verticală */
         padding: 10px 30px;
         box-shadow: 0 2px 5px rgba(0,0,0,0.2);
         z-index: 1000;
     }
     
     .topbar img {
         height: 40px;
         margin-right: 10px;
     }
     
     .topbar h1 {
         font-size: 20px;
         margin: 0;
         color: #333;
         display: inline-block;
         vertical-align: middle;
     }
     
     .topbar nav a {
         text-decoration: none;
         color: #333;
         margin-left: 20px;
         font-weight: 500;
         transition: color 0.3s;
     }
     
     .topbar nav a:hover {
         color: #007BFF; /* albastru la hover */
     }
     
  .logoline{
   display: flex;
   justify-content: space-between; 
   padding: 0 20px;
   align-items: center;  
  }

  .logoline img{
   height: 62px;
  }
     
  section {
   width: 100%;
 
   
 }
 
 section img {
   max-width: 100%;
   height: auto;
   display: block;
   margin: 0 auto;
   position: relative;
 }

 .container {
   display: flex;
   width: 80%;
   margin: 100px auto 0;
   justify-content: space-between;
   margin-bottom: 50px;
   gap: 20px; /* spațiu între ele */

   align-items: center;
 }
 
 .programm {
   
 }
 .harta {
    width: 100%;
 }
 
 .hamburger {
  display: none; /* ascuns pe desktop */
  font-size: 32px;
  color: #fff;
  background: none;
  border: none;
  cursor: pointer;
  margin-right: 20px;
  /* margin-left: auto; */
}
 
.right-site {
  display: flex;
  align-items: center;
  gap: 20px; /* distanță între text și meniu */
}

.right-site p {
  margin-left: 0;
}

.container {
  display: flex;
  gap: 20px;
}

@media (max-width: 768px) {
  .hamburger {
    display: block; /* apare pe mobil */
  }

  .right-site{
    display: none;
  }
  /* footer{
    display: none;
  } */

  nav {
    display: none;              /* ascuns inițial pe mobil */
    flex-direction: column;     
    background: #333;
    position: absolute;
    top: 100%;                  /* se poziționează imediat sub header */
    left: 0;
    width: 100%;                /* ia toată lățimea */
    padding: 10px 0;
    border-radius: 0;
    text-align: left;
  }
  nav a{
    margin-bottom: 20px;
  }
  
  nav.active {
    display: flex;              /* când primește clasa active → apare ca drop */
  }

  .container {
    flex-direction: column;
  }

}