.cc-nav {
  --cc-ink:       var(--color-foreground);
  --cc-ink-10:    rgb(var(--color-foreground-rgb) / 0.10);
  --cc-ink-20:    rgb(var(--color-foreground-rgb) / 0.20);
  --cc-ink-30:    rgb(var(--color-foreground-rgb) / 0.30);
  --cc-bg:        var(--color-background);
  --cc-font-nav:  var(--font-subheading--family, 'Dela Gothic One', sans-serif);
  --cc-font-stamp:var(--font-heading--family,    'Mochiy Pop P One', sans-serif);
  --cc-font-mono: 'VT323', monospace;
  --cc-font-body: var(--font-body--family, 'Nunito', sans-serif);
  --cc-ease:      cubic-bezier(0.22,1,0.36,1);
  --cc-spring:    cubic-bezier(0.34,1.56,0.64,1);
  --cc-speed:     70ms;
}

@media screen and (max-width:749px) {
  .carpcore-nav-desktop { display:none !important; }
  .cc-nav { display:none; }
}

.cc-nav {
  display:flex;
  justify-content:center;
  background:var(--cc-bg);
  border-bottom:1.5px solid var(--cc-ink-20);
  position:relative;
}

.cc-nav__list {
  display:flex;
  align-items:stretch;
  list-style:none;
  margin:0;
  padding:0;
}

.cc-nav__item {
  position:relative;
}

.cc-nav__link {
  display:flex;
  align-items:center;
  gap:5px;
  padding:13px 18px;
  font-family:var(--cc-font-nav);
  font-size:clamp(.7rem,1.1vw,.95rem);
  letter-spacing:0.13em;
  text-transform:uppercase;
  color:rgb(var(--color-foreground-rgb) / 0.65);
  text-decoration:none;
  cursor:pointer;
  position:relative;
  border-left:1px solid var(--cc-ink-10);
  transition:color var(--cc-speed) var(--cc-ease), background var(--cc-speed) var(--cc-ease);
  white-space:nowrap;
  will-change:color, background;
}

.cc-nav__item:first-child .cc-nav__link { border-left:none; }

.cc-nav__link::after {
  content:'';
  position:absolute;
  bottom:0;
  left:18px;
  right:18px;
  height:3px;
  background:var(--item-accent,var(--color-brand-coral));
  border-radius:2px 2px 0 0;
  transform:scaleY(0);
  transform-origin:bottom center;
  transition:transform var(--cc-speed) var(--cc-ease);
}

.cc-nav__item:hover .cc-nav__link::after,
.cc-nav__link[aria-expanded='true']::after { transform:scaleY(1); }

.cc-nav__item:hover .cc-nav__link,
.cc-nav__link[aria-expanded='true'] {
  color:var(--item-accent,var(--color-brand-coral));
  background:rgb(var(--color-foreground-rgb) / 0.025);
}

.cc-nav__item.is-current .cc-nav__link::after { height:2px; opacity:0.3; }
.cc-nav__item.is-current .cc-nav__link { color:var(--cc-ink); }

.cc-nav__star {
  font-size:0.4rem;
  opacity:0;
  transform:scale(0) rotate(-45deg);
  transition:opacity var(--cc-speed) var(--cc-ease), transform 120ms var(--cc-spring);
  color:var(--item-accent,var(--color-brand-coral));
}

.cc-nav__item:hover .cc-nav__star,
.cc-nav__link[aria-expanded='true'] .cc-nav__star {
  opacity:1;
  transform:scale(1) rotate(0deg);
}

.cc-nav__slash {
  font-size:0.48rem;
  opacity:0.15;
  letter-spacing:0;
  transition:opacity var(--cc-speed) var(--cc-ease);
}

.cc-nav__item:hover .cc-nav__slash,
.cc-nav__link[aria-expanded='true'] .cc-nav__slash { opacity:0.6; }

.cc-nav__dropdown {
  position:absolute;
  top:calc(100% + 2px);
  left:0;
  min-width:270px;
  z-index:200;
  opacity:0;
  transform:translateY(-6px);
  pointer-events:none;
  transition:opacity 70ms var(--cc-ease), transform 80ms var(--cc-ease);
  will-change:opacity, transform;
}

.cc-nav__dropdown.is-open {
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

.cc-nav__dropdown-inner {
  background:var(--cc-bg);
  border:1px solid var(--cc-ink-20);
  border-top:none;
  box-shadow:
    0 8px 32px rgb(var(--color-foreground-rgb) / 0.10),
    inset 0 1px 0 rgb(var(--color-brand-white-rgb) / 0.55),
    inset 1px 0 0 rgb(var(--color-brand-white-rgb) / 0.25),
    inset -1px 0 0 rgb(var(--color-brand-white-rgb) / 0.15);
  overflow:hidden;
  position:relative;
}

.cc-nav__dropdown-inner::before {
  content:'';
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgb(var(--color-foreground-rgb) / 0.012) 3px,rgb(var(--color-foreground-rgb) / 0.012) 4px);
  pointer-events:none;
  z-index:3;
}

.cc-nav__dropdown-topbar {
  height:3px;
  background:var(--item-accent,var(--color-brand-coral));
  position:relative;
  z-index:2;
}

.cc-nav__drop-corners {
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:4;
}

.cc-nav__drop-corners::before,
.cc-nav__drop-corners::after {
  content:'';
  position:absolute;
  width:10px;
  height:10px;
  border-color:var(--cc-ink-30);
  border-style:solid;
}

.cc-nav__drop-corners::before { bottom:8px; left:8px; border-width:0 0 1.5px 1.5px; }
.cc-nav__drop-corners::after  { bottom:8px; right:8px; border-width:0 1.5px 1.5px 0; }

.cc-nav__drop-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 14px 6px;
  border-bottom:1px solid var(--cc-ink-10);
  position:relative;
  z-index:1;
}

.cc-nav__drop-category {
  font-family:var(--cc-font-body);
  font-size:0.58rem;
  font-weight:800;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:rgb(var(--color-foreground-rgb) / 0.35);
}

.cc-nav__drop-counter {
  font-family:var(--cc-font-mono);
  font-size:0.82rem;
  color:rgb(var(--color-foreground-rgb) / 0.28);
  letter-spacing:0.05em;
  line-height:1;
  transition:opacity 70ms var(--cc-ease);
}

.cc-nav__sub-list {
  list-style:none;
  margin:0;
  padding:4px 0 40px;
  position:relative;
  z-index:1;
}

.cc-nav__sub-item { border-bottom:1px solid var(--cc-ink-10); }
.cc-nav__sub-item:last-child { border-bottom:none; }

.cc-nav__sub-link {
  display:grid;
  grid-template-columns:26px 1fr auto;
  align-items:center;
  padding:10px 14px;
  text-decoration:none;
  color:var(--cc-ink);
  position:relative;
  transition:background var(--cc-speed) var(--cc-ease), transform var(--cc-speed) var(--cc-ease);
}

.cc-nav__sub-link:hover {
  background:color-mix(in srgb, var(--item-accent,var(--color-brand-coral)) 12%, transparent);
  transform:translateX(4px);
}

.cc-nav__sub-link::before {
  content:'';
  position:absolute;
  left:0; top:0; bottom:0;
  width:2px;
  background:var(--item-accent,var(--color-brand-coral));
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform var(--cc-speed) var(--cc-ease);
}

.cc-nav__sub-link:hover::before { transform:scaleX(1); }

.cc-nav__dropdown.is-open .cc-nav__sub-link {
  animation:subSlideIn 80ms var(--cc-ease) both;
  animation-delay:calc(var(--sub-index,0) * 15ms + 15ms);
}

@keyframes subSlideIn {
  from { opacity:0; transform:translateX(-6px); }
  to   { opacity:1; transform:translateX(0); }
}

.cc-nav__sub-num {
  font-family:var(--cc-font-mono);
  font-size:0.85rem;
  opacity:0.22;
  line-height:1;
  transition:opacity var(--cc-speed) var(--cc-ease), color 60ms var(--cc-ease);
}

.cc-nav__sub-link:hover .cc-nav__sub-num { opacity:0.65; color:var(--item-accent,var(--color-brand-coral)); }

.cc-nav__sub-text {
  font-family:var(--cc-font-nav);
  font-size:0.76rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  line-height:1.2;
}

.cc-nav__sub-arrow {
  font-size:0.65rem;
  opacity:0;
  transform:translateX(-6px);
  transition:opacity var(--cc-speed) var(--cc-ease), transform 100ms var(--cc-spring);
}

.cc-nav__sub-link:hover .cc-nav__sub-arrow { opacity:0.45; transform:translateX(0); }

.cc-nav__shop-all {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:9px 14px;
  font-family:var(--cc-font-body);
  font-size:0.6rem;
  font-weight:800;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:rgb(var(--color-foreground-rgb) / 0.4);
  text-decoration:none;
  border-top:1px solid var(--cc-ink-10);
  position:relative;
  z-index:1;
  transition:color var(--cc-speed) var(--cc-ease), background var(--cc-speed) var(--cc-ease);
}

.cc-nav__shop-all:hover { color:var(--cc-ink); background:var(--cc-ink-10); }

.cc-nav__footer-tag {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:6px 14px;
  font-family:var(--cc-font-mono);
  font-size:0.78rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:rgb(var(--color-foreground-rgb) / 0.28);
  background:rgb(var(--color-foreground-rgb) / 0.03);
  border-top:1px solid var(--cc-ink-10);
  position:relative;
  z-index:1;
}

@media (prefers-reduced-motion:reduce) {
  .cc-nav__link,
  .cc-nav__link::after,
  .cc-nav__star,
  .cc-nav__slash,
  .cc-nav__dropdown,
  .cc-nav__sub-link,
  .cc-nav__sub-link::before,
  .cc-nav__sub-num,
  .cc-nav__sub-arrow,
  .cc-nav__shop-all { transition:none; animation:none; }
}