/* ============================================================
   KC CINEMAX — NAVBAR & MOBILE MENU
   Updated for Image Logo
   ============================================================ */
:root{
  --kc-gold:#f5a623;
  --kc-gold-bright:#ffbe3d;
  --kc-gold-glow:rgba(245,166,35,.45);
  --kc-ink:#0a0a0d;
}

/* Navbar shell */
.kc-navbar{
  /* Matches the exact dark gray background of your JPG logo */
  background-color: #232323; 
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  
  /* Removed the gold border-bottom to remove the line under the logo */
  border-bottom: none; 
  
  box-shadow: 0 4px 12px rgba(0,0,0,.5);
  padding-block:.4rem; /* Adjusted padding for the larger logo */
  transition:padding .22s ease,background .22s ease;
}

.kc-navbar.kc-scrolled{
  padding-block:.2rem;
  background-color: #1a1a1a; /* Slightly darker when scrolling */
}

.kc-nav-container{position:relative}

/* Brand / Logo */
.kc-brand{display:inline-flex;align-items:center;text-decoration:none;letter-spacing:.06em}

/* INCREASED Logo Size */
.kc-logo-img {
  height: 45px;
  width: auto;
  object-fit: contain;
  display: block;
  /* Optional: Adds a very subtle drop shadow to the logo itself */
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5));
}

/* Legacy text logo styles (kept in case you switch back) */
.kc-brand-mark{
  display:inline-grid;place-items:center;
  width:40px;height:40px;border-radius:10px;
  background:linear-gradient(145deg,var(--kc-gold-bright),var(--kc-gold));
  color:#1a1200;font-weight:900;font-size:.95rem;letter-spacing:.02em;
  box-shadow:0 6px 18px -6px var(--kc-gold-glow),0 0 0 1px rgba(255,255,255,.08) inset;
  transition:transform .2s ease,box-shadow .2s ease;
}
.kc-brand:hover .kc-brand-mark{
  transform:translateY(-1px);
  box-shadow:0 10px 24px -6px var(--kc-gold-glow),0 0 0 1px rgba(255,255,255,.12) inset;
}
.kc-brand-name{font-weight:800;font-size:1.05rem;color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.6)}

/* Desktop nav links */
.kc-nav-list{gap:.25rem}
.kc-nav-list .nav-link{
  position:relative;
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.55rem .9rem;
  color:rgba(255,255,255,.78);
  font-weight:600;font-size:.92rem;letter-spacing:.02em;
  border-radius:8px;
  transition:color .18s ease,background .18s ease,transform .18s ease;
}
.kc-nav-list .nav-link i{font-size:1rem;opacity:.85;transition:opacity .18s ease,transform .18s ease,color .18s ease}
.kc-nav-list .nav-link:hover{color:#fff;background:rgba(245,166,35,.08);transform:translateY(-1px)}
.kc-nav-list .nav-link:hover i{opacity:1;transform:scale(1.08);color:var(--kc-gold-bright)}
.kc-nav-list .nav-link.active{color:var(--kc-gold-bright)}
.kc-nav-list .nav-link.active::after{
  content:"";position:absolute;left:50%;bottom:2px;
  width:26px;height:2px;transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,var(--kc-gold-bright),transparent);
  border-radius:2px;box-shadow:0 0 10px var(--kc-gold-glow);
}

/* Hamburger */
.kc-menu-toggle{
  background:transparent;
  border:1px solid rgba(245,166,35,.25);
  border-radius:8px;
  padding:.5rem .6rem;
  display:inline-flex;flex-direction:column;gap:5px;
  transition:border-color .18s ease,background .18s ease;
}
.kc-menu-toggle:hover{border-color:rgba(245,166,35,.55);background:rgba(245,166,35,.06)}
.kc-menu-toggle span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:transform .2s ease,opacity .2s ease}
.kc-menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.kc-menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.kc-menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Mobile overlay */
.kc-menu-overlay{
  background:
    radial-gradient(1200px 600px at 50% -10%,rgba(245,166,35,.10),transparent 60%),
    linear-gradient(180deg,#232323 0%,#06060a 100%); /* Matched top color to navbar */
  backdrop-filter:blur(8px);
}

/* UPDATED: Mobile Menu Head to align Logo and Close button */
.kc-menu-head {
    border-bottom: 1px solid rgba(245,166,35,.15);
    padding-bottom: 1rem;
    display: flex;
    justify-content: space-between; /* Pushes logo left, close button right */
    align-items: center;            /* Vertically centers them */
}

/* UPDATED: Specific size for the mobile menu logo */
.kc-menu-head .kc-logo-img {
    height: 45px; /* Adjusted size for mobile menu */
    width: auto;
    display: block;
}

.kc-menu-link{
  display:flex;align-items:center;gap:.9rem;
  padding:1rem .25rem;
  color:rgba(255,255,255,.85);
  font-size:1.15rem;font-weight:600;letter-spacing:.02em;
  border-bottom:1px solid rgba(255,255,255,.05);
  transition:color .18s ease,padding-left .18s ease;
}
.kc-menu-link i{font-size:1.25rem;color:var(--kc-gold);width:1.5rem;text-align:center}
.kc-menu-link:hover,.kc-menu-link.active{color:var(--kc-gold-bright);padding-left:.75rem}
.kc-menu-foot{margin-top:2rem;display:flex;gap:1.25rem;color:rgba(255,255,255,.5);font-size:.85rem}
.kc-menu-foot a{color:inherit;text-decoration:none;transition:color .18s ease}
.kc-menu-foot a:hover{color:var(--kc-gold-bright)}