/* ═══════════════════════════════════════════════════════════════════════
   Kozárdi Kamra – fő navigáció
   Használat:  <link href="css/kamra-nav.css" rel="stylesheet">
               <script src="js/kamra-nav.js" defer></script>
   A markup a .navbar-brand után kerül a fejléc .container-ébe.
   Nem támaszkodik jQueryre vagy a sablon slicknav pluginjére.
   ═══════════════════════════════════════════════════════════════════════ */

.kamra-nav-wrap { margin-left: auto; display: flex; align-items: center; }

/* ── Hamburger (csak mobilon látszik) ── */
.kamra-nav-toggle {
    display: none;
    width: 44px; height: 44px;
    background: rgba(0,0,0,.35);
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 9px;
    cursor: pointer;
    padding: 0;
    align-items: center; justify-content: center;
    flex-direction: column; gap: 5px;
}
.kamra-nav-toggle span {
    display: block; width: 20px; height: 2px;
    background: #fff; border-radius: 2px;
    transition: transform .25s, opacity .2s;
}
.kamra-nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.kamra-nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.kamra-nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── Linkek ── */
.kamra-nav ul {
    display: flex; align-items: center; gap: 32px;
    list-style: none; margin: 0; padding: 0;
}
.kamra-nav a {
    display: inline-block;
    color: #fff;
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    padding: 6px 0;
    position: relative;
    white-space: nowrap;
    text-shadow: 0 1px 6px rgba(0,0,0,.5);
    transition: color .2s;
}
.kamra-nav a::after {
    content: '';
    position: absolute; left: 0; right: 100%; bottom: 0;
    height: 2px; background: var(--gold, #c9a96e);
    transition: right .25s ease;
}
.kamra-nav a:hover { color: var(--gold, #c9a96e); }
.kamra-nav a:hover::after { right: 0; }
.kamra-nav a.is-active { color: var(--gold, #c9a96e); }
.kamra-nav a.is-active::after { right: 0; }

/* ── Mobil ── */
@media (max-width: 991px) {
    .kamra-nav-toggle { display: flex; }

    .kamra-nav {
        position: absolute;
        top: 100%; left: 15px; right: 15px;
        background: rgba(16,16,16,.98);
        border: 1px solid #2e2e2e;
        border-radius: 12px;
        box-shadow: 0 18px 50px rgba(0,0,0,.5);
        padding: 10px 6px;
        display: none;
        z-index: 200;
    }
    .kamra-nav.open { display: block; }

    .kamra-nav ul { flex-direction: column; align-items: stretch; gap: 0; }
    .kamra-nav li + li { border-top: 1px solid #262626; }
    .kamra-nav a {
        display: block;
        padding: 14px 16px;
        letter-spacing: 1.2px;
        text-shadow: none;
    }
    .kamra-nav a::after { display: none; }
    .kamra-nav a:hover, .kamra-nav a.is-active { background: rgba(201,169,110,.12); }
}

/* A fejléc .container legyen a mobil panel pozicionálási alapja */
@media (max-width: 991px) {
    header.main-header .navbar > .container { position: relative; }
}
