/* DESKTOP NAV LINK HOVER / AKTÍV */
.nav-link {
  transition: all 0.25s ease;
}
.nav-link:hover {
  background-color: #1f2937; /* gray-800 */
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}
.nav-link.active {
  background-color: #1f2937;
  color: #ffffff;
}
/* MOBILE MENU ANIM */
@keyframes slideDown {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-slideDown { animation: slideDown 0.25s ease-out; }
/* Hover animáció: szöveg kicsit feljön, színváltozás, alsó vonal nő */
.nav-link {
  overflow: hidden;
}
.nav-link span:first-child {
  display: inline-block;
  transition: transform 0.3s ease, color 0.3s ease;
}
.nav-link span:last-child {
  width: 0;
}
.nav-link:hover span:first-child {
  transform: translateY(-3px);
  color: #f43f5e; /* pink/red szín kiemelés */
}
.nav-link:hover span:last-child {
  width: 100%;
  background-color: #22d3ee; /* kontrasztos türkiz vonal */
}
/* Aktív menüpont */
.nav-link.active span:first-child {
  font-weight: 600;
  color: #22d3ee;
}
.nav-link.active span:last-child {
  width: 100%;
  background-color: #22d3ee;
}
  @keyframes slideDown { 
    from { opacity: 0; transform: translateY(-10px);} 
    to { opacity: 1; transform: translateY(0);} 
 }
   @keyframes slideIn {
  from {
    opacity: 0;
    transform: translateX(30px);}
  to { opacity: 1; transform: translateX(0);}
}
.animate-slideDown { animation: slideDown 0.25s ease-out;
}
:root {
    --floating-bg: #ffffff; /* ITT ÁLLÍTOD A SZÍNT */
 }
.floating-menu {
    top: 25%;
    right: max(0px, calc((70vw - 1280px) / 2));
 }
 /* FIX MÉRET */
.floating-box {
    width: 280px;
    height: 300px;
    background-color: var(--floating-bg);
    border-radius: 1.5rem; /* szebb lekerekítés */
    display: flex;
    flex-direction: column;
 }
  /* FIX KÉPTERÜLET */
.image-box {
    height: 280px;
    width: 100%;
    overflow: hidden;
 }
  /* KÉP IGAZÍTÁS */
 .image-fill {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
 }
  .image-box:hover .image-fill {
    transform: scale(1.05);
 }
/* Mobil */
@media (max-width: 768px) {
    .floating-menu {
      top: auto;
      bottom: 1rem;
      right: 1rem;
    }

    .floating-box {
      width: 240px;
      height: 320px;
    }

    .image-box {
      height: 160px;
    }
  }
   .filter-btn {
    transition: all 0.3s ease;
  }
  .filter-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  }

  /* KÁRTYA HOVER */
  #utjainkGrid > a {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  #utjainkGrid > a:hover {
    transform: translateY(-5px) scale(1.03);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
  }
  
@keyframes slideDown { from { opacity:0; transform: translateY(-10px);} to { opacity:1; transform: translateY(0);} }
.animate-slideDown { animation: slideDown 0.25s ease-out; }

  .travel-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }

  .travel-card:hover {
    transform: translateY(-6px) scale(1.01);
    box-shadow: 0 20px 30px rgba(0,0,0,0.15);
  }

  .filter-btn {
    transition: all 0.25s ease;
  }

  .filter-btn:hover {
    transform: translateY(-2px);
  }
  
  .countries{columns:4; margin-top:8px;}

button{margin-top:8px;padding:6px 12px;border:none;border-radius:6px;background:#3b82f6;color:#3b82f6;cursor:pointer;}

button:hover{background:#2563eb;}

/* NYOMTATÁSI NÉZET */
@media print {

  @page {
    size: A4 portrait;
    margin: 10mm;
  }

  body {
    background: white;
    margin: 0;
    padding: 0;
  }

  header {
    display: none !important;
  }

  button {
    display: none !important;
  }

  nav,
  .menu,
  .logo,
  .title,
  .info {
    display: none !important;
  }

  #map {
    width: 100%;
    height: 65vh;
    page-break-inside: avoid;
  }
  .counter {
    display: block;
    font-size: 16px;
    font-weight: bold;
    margin-top: 10px;
  }
   .list-container {
    page-break-inside: avoid;
    margin-top: 10px;
  }
}