/* --- Professional nav polish --- */
.nav.nav-pro{gap:20px}
.nav.nav-pro .nav-link{
  position:relative; display:inline-flex; align-items:center; gap:8px;
  font-weight:600; font-size:15px; color:var(--ink); text-decoration:none;
  padding:8px 10px; border-radius:12px; line-height:1;
  transition:background .2s ease, color .2s ease, transform .15s ease;
}
.nav.nav-pro .nav-link:hover{background:var(--card); color:var(--brand)}
.nav .dropdown-toggle::after{
  content:""; width:6px; height:6px; margin-left:6px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg);
  display:inline-block; transition:transform .2s ease; opacity:.75;
}
.nav .dropdown.show .dropdown-toggle::after{transform:rotate(-135deg) translateY(1px)}

/* dropdown look: subtle glass + soft shadow */
.shadow-soft{box-shadow:0 24px 48px -24px rgba(0,0,0,.35)}
.nav .dropdown-menu{
  background:rgba(255,255,255,.92); backdrop-filter:saturate(140%) blur(10px);
  border:1px solid rgba(15,15,15,.06); border-radius:14px; padding:10px; min-width:260px;
  transform-origin:top right; transform:translateY(6px); opacity:0;
  transition:opacity .18s ease, transform .18s ease;
}
.nav .dropdown-menu.show{opacity:1; transform:none}
.nav .dropdown-header{font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); padding:6px 10px 8px}
.nav .dropdown-item{border-radius:8px; font-size:14px; padding:8px 10px}
.nav .dropdown-item:hover{background:var(--card); color:var(--brand)}

/* animated active underline (inkbar) */
.nav .inkbar{
  position:absolute; bottom:6px; height:2px; background:linear-gradient(90deg,var(--brand),var(--accent));
  border-radius:2px; transition:left .25s cubic-bezier(.22,.61,.36,1), width .25s cubic-bezier(.22,.61,.36,1), opacity .25s;
  left:16px; width:0; opacity:0;
}

/* active state from your IO script */
.nav a[aria-current="true"]{background:var(--card); color:var(--brand)}

/* mobile tweaks */
@media (max-width: 880px){
  .nav.nav-pro{gap:14px}
  .nav .inkbar{display:none} /* keep it simple on small screens */
}

/* Japan mega-dropdown */
/* position: static on the trigger so the panel is placed relative to .header (sticky) */
.japan-nav-dropdown{ position: static !important }
.japan-mega{
  position: absolute;
  top: 100%;
  /* stretch to match header-inner's left and right padding */
  left: max(var(--site-shell-padding, 20px), calc((100vw - var(--site-shell-max, 1200px)) / 2 + var(--site-shell-padding, 20px))) !important;
  right: max(var(--site-shell-padding, 20px), calc((100vw - var(--site-shell-max, 1200px)) / 2 + var(--site-shell-padding, 20px))) !important;
  min-width: 0;
  padding: 20px 24px 18px;
  background: #fff !important;
  backdrop-filter: none !important;
  transform-origin: top left;
}
.japan-mega-grid{
  display: grid;
  grid-template-columns: 1fr 1fr 210px;
  gap: 4px 20px;
  align-items: start;
}
.japan-mega-col + .japan-mega-col{
  border-left: 1px solid rgba(0,0,0,.06);
  padding-left: 18px;
}
.japan-mega .dropdown-header{
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(0,0,0,.05);
}
.japan-mega-col:first-child .dropdown-header:first-child,
.japan-mega-col .dropdown-header:first-child{
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}
.japan-mega .dropdown-item{
  padding: 5px 8px;
  line-height: 1.25;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.japan-mega .dropdown-item small{
  display: inline;
  font-size: 11px;
  color: var(--accent);
  font-weight: 700;
  white-space: nowrap;
  flex-shrink: 0;
}
.japan-mega .dropdown-item:not([href]){
  font-weight: 400;
}
.japan-mega .dropdown-item:not([href]) small{
  font-weight: 400;
}
.japan-mega .dropdown-item:hover small{ color: var(--accent) }

/* Sidebar (3rd column) */
.japan-mega-sidebar{
  border-left: 1px solid rgba(0,0,0,.06);
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sidebar-block{
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
}
.sidebar-block-header{
  background: #2d4a5a;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: 7px 10px;
}
.sidebar-block-body{
  padding: 8px 10px;
  background: #fff;
}
.sidebar-block-body img{
  width: 100%;
  height: auto;
  border-radius: 4px;
  margin-bottom: 5px;
  display: block;
}
.sidebar-btn{
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 10px 12px;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0,.10);
  background: #f5f6f7;
  color: var(--ink);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  margin-top: 5px;
  transition: background .15s;
}
.sidebar-btn:hover{ background: var(--card); color: var(--brand) }
.japan-mega .sidebar-btn:hover,
.japan-mega .sidebar-btn:focus{
  color: var(--brand) !important;
}
.japan-mega .sidebar-btn:hover svg,
.japan-mega .sidebar-btn:focus svg{
  color: var(--brand) !important;
}
.sidebar-contact-row{
  font-size: 12px;
  line-height: 1.5;
  color: var(--ink);
}
.sidebar-contact-row strong{ font-size: 12px }
.sidebar-contact-row .phone{
  color: var(--accent);
  font-weight: 700;
  font-size: 12px;
  display: block;
}
.sidebar-contact-row .hours{
  color: var(--muted);
  font-size: 11px;
}
.sidebar-contact-row a{
  color: var(--accent);
  font-weight: 600;
  font-size: 12px;
  text-decoration: none;
  padding: 0;
  border-radius: 0;
  display: inline;
  background: none !important;
}
.sidebar-contact-row a:hover{ text-decoration: underline; background: none !important; }

@media (max-width: 1100px){
  .japan-mega{
    left: 20px !important;
    right: 20px !important;
  }
  .japan-mega-grid{
    grid-template-columns: 1fr 1fr;
  }
  .japan-mega-sidebar{
    display: none;
  }
  .japan-mega-col + .japan-mega-col{
    border-left: none;
    padding-left: 0;
  }
  .japan-mega-col:nth-child(odd){
    border-right: 1px solid rgba(0,0,0,.06);
    padding-right: 18px;
  }
}

/* Catalog mega-dropdown */
.catalog-nav-dropdown{ position:relative !important; }
.nav .catalog-menu-entry{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
}
.nav .catalog-menu-entry i{
  color:var(--accent);
  font-size:13px;
}
.nav .catalog-mega{
  display:none;
  position:fixed;
  top:var(--catalog-mega-top, 96px) !important;
  left:var(--catalog-mega-left, 20px) !important;
  right:auto !important;
  width:var(--catalog-mega-width, min(560px, calc(100vw - 40px)));
  min-width:0;
  max-height:min(620px, calc(100vh - var(--catalog-mega-top, 96px) - 18px));
  overflow-y:auto;
  padding:12px;
  background:#fff;
  border:1px solid rgba(15,15,15,.06);
  border-radius:14px;
  backdrop-filter:none;
  opacity:0;
  transform:translateY(6px);
  transform-origin:top right;
  transition:opacity .18s ease, transform .18s ease;
  z-index:1060;
}
.catalog-mega-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:10px;
  align-items:stretch;
}
.catalog-card{
  min-width:0;
  padding:8px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:10px;
  background:#fff;
  display:flex;
  flex-direction:column;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.catalog-card:hover{
  border-color:rgba(30,58,95,.18);
  box-shadow:0 12px 28px -22px rgba(30,58,95,.65);
  transform:translateY(-2px);
}
.catalog-cover{
  aspect-ratio:4 / 3;
  padding:4px;
  border-radius:7px;
  background:#f4f5f7;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.catalog-cover img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.catalog-card-heading{
  min-height:46px;
  padding:8px 2px 6px;
}
.catalog-card-heading h3{
  margin:0 0 3px;
  color:var(--ink);
  font-size:13px;
  font-weight:700;
  line-height:1.25;
}
.catalog-card-heading small{
  display:block;
  color:var(--accent);
  font-size:11px;
  font-weight:700;
  line-height:1.3;
}
.catalog-card-links{
  display:grid;
  gap:5px;
  margin-top:auto;
}
.catalog-card .catalog-action{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:7px 7px;
  border:1px solid rgba(0,0,0,.09);
  border-radius:6px;
  background:#f5f6f7;
  color:var(--ink);
  font-size:10.5px;
  font-weight:600;
  line-height:1.15;
  text-decoration:none;
}
.catalog-card .catalog-action i{
  color:var(--accent);
  flex:0 0 auto;
  font-size:13px;
}
.catalog-card .catalog-action span{
  min-width:0;
  overflow-wrap:anywhere;
}
.catalog-card .catalog-action:hover,
.catalog-card .catalog-action:focus{
  background:var(--card);
  color:var(--brand);
}

/* The Katalog entry inside Menu controls this second-level panel. */
.catalog-nav-dropdown.catalog-is-open > .catalog-mega{
  display:block;
  opacity:1;
  transform:none;
}

@media (max-width:1100px) and (min-width:881px){
  .catalog-mega-grid{ grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); }
  .catalog-cover{ aspect-ratio:4 / 3; }
  .catalog-card-heading{ min-height:54px; }
}

/* Catalog category list and detail panels inside the mobile navigation. */
.mob-catalog-list{
  display:block;
}
.mob-catalog-detail{
  min-height:100%;
  padding:16px 16px 28px;
  background:#fff;
}
.mob-catalog-detail-actions{
  display:grid;
  gap:8px;
  max-width:420px;
  margin:0 auto;
  text-align:left;
}
.mob-catalog-detail-actions a{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  padding:13px 14px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:8px;
  background:#fff;
  color:var(--ink);
  font-size:14px;
  font-weight:600;
  line-height:1.25;
  text-decoration:none;
}
.mob-catalog-detail-actions a:hover{ background:#f8f9fa; color:var(--brand); }

/* Offcanvas look */
.offcanvas.mobile-nav{
  --bs-offcanvas-width: 100vw;
  max-width: 100vw;
  background:#fff;
  border-left: none;
  overscroll-behavior: contain;
}
.offcanvas.mobile-nav .offcanvas-body{
  padding:0; overflow:hidden; display:flex; flex-direction:column;
}
/* Multi-level panel nav */
.mob-nav{ flex:1; position:relative; overflow:hidden; }
.mob-panel{
  position:absolute; inset:0; overflow-y:auto; background:#fff;
  z-index:0;
  transform:translateX(100%);
  transition:transform .28s cubic-bezier(.4,0,.2,1);
  -webkit-overflow-scrolling:touch;
}
.mob-panel.is-active{ z-index:2; transform:translateX(0); }
.mob-panel.is-prev{ z-index:1; transform:translateX(-28%); }
.mob-back-row{
  display:flex; align-items:center; gap:10px;
  padding:12px 16px; border-bottom:1px solid rgba(0,0,0,.08);
  background:#f4f5f7; position:sticky; top:0; z-index:1;
}
.mob-back-btn{
  background:#1e3a5f; color:#fff; border:none; border-radius:20px;
  padding:5px 13px; font-size:13px; font-weight:600;
  display:inline-flex; align-items:center; gap:4px; cursor:pointer; line-height:1.4;
}
.mob-back-title{ font-size:14px; font-weight:700; color:var(--ink); }
.mob-item{
  display:flex; justify-content:space-between; align-items:center;
  padding:15px 16px; border:none; border-bottom:1px solid rgba(0,0,0,.07);
  font-size:15px; color:var(--ink); text-decoration:none;
  cursor:pointer; background:#fff; width:100%; text-align:left;
}
.mob-item:hover{ background:#f8f9fa; }
.mob-item i{ color:var(--accent); font-size:16px; flex-shrink:0; }
.mob-divider{ height:1px; background:rgba(0,0,0,.08); margin:6px 0; }
.mob-tour{
  display:flex; justify-content:space-between; align-items:center; gap:8px;
  padding:13px 16px; border-bottom:1px solid rgba(0,0,0,.07);
  font-size:14px; color:var(--ink); text-decoration:none; background:#fff;
}
.mob-tour:hover{ background:#f8f9fa; }
.mob-tour-days{
  color:var(--accent); font-weight:700; font-size:12px; white-space:nowrap; flex-shrink:0;
}
.mob-tour:not([href]){
  font-weight:400;
}
.mob-tour:not([href]) .mob-tour-days{
  font-weight:400;
}
.mob-footer{
  padding:14px 16px; border-top:1px solid rgba(0,0,0,.08);
  display:flex; gap:10px; flex-wrap:wrap;
}
.mob-footer a{ font-size:12px; color:var(--muted); text-decoration:none; }
.mob-footer a:hover{ color:var(--ink); }

/* RESPONSIVE: hide desktop nav, show hamburger */
@media (max-width: 880px){
  .nav.nav-pro{display:none}
  .btn-menu{display:inline-flex}
}