/* Modaverse: elegant full-width header + western hero */

:root {
  --mv-yellow: #f9f17a;
  --mv-ink: #1a1a1a;
  --mv-header-bg: #ffffff;
  --mv-nav-size: 12px;
  --mv-logo-height: 28px;
}

/* ===== Announcement (yellow) — full bleed ===== */
#shopify-section-announcement-bars,
#shopify-section-announcement-bars .kt-announcements-scrolling-text,
#shopify-section-announcement-bars .kt-scrolling-text {
  background: var(--mv-yellow) !important;
  position: relative;
  z-index: 1001;
  width: 100% !important;
  max-width: none !important;
  border-radius: 0 !important;
}

#shopify-section-announcement-bars .kt-announcement-text,
#shopify-section-announcement-bars .mv-marquee-item {
  padding: 0.55rem 0 !important;
  white-space: nowrap !important;
  letter-spacing: 0.04em !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
}

#shopify-section-announcement-bars .mv-marquee-group {
  gap: 2.5rem !important;
}

/* ===== Primary header row — white, full width, no yellow box ===== */
#shopify-section-header,
#header-container,
#header-container.kt-header-wrapper,
#header-container.kt-header-wrapper--transparent,
#header-container.kt-header-wrapper--solid,
#header-container.kt-header-wrapper--alternate-colors,
#header-container.kt-header-wrapper--wide,
#header-container.kt-header-wrapper-width--fit,
#header-element,
.kt-header,
.kt-header__main,
main-header.kt-header__main {
  --background-opacity: 1 !important;
  --color-scheme-background: var(--mv-header-bg) !important;
  --color-scheme-background-main: var(--mv-header-bg) !important;
  --color-scheme-text-alternate: var(--mv-ink) !important;
  --color-scheme-text-original: var(--mv-ink) !important;
  background: var(--mv-header-bg) !important;
  position: relative !important;
  z-index: 1000 !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  width: 100% !important;
  max-width: none !important;
}

#header-container:before {
  opacity: 1 !important;
  background: var(--mv-header-bg) !important;
  border-radius: 0 !important;
}

/* Kill boxed / fit-width header so the row is edge-to-edge */
#shopify-section-header .kt-container--large,
#header-container .kt-container--large,
#header-container.kt-header-wrapper-width--fit .kt-container--large {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 !important;
}

body.kt-header-is-floating #header-container,
body.kt-header-is-sticky-when-scrolling #header-container {
  position: sticky !important;
  top: 0 !important;
}

body {
  --header-logo: var(--mv-logo-height) !important;
}
@media screen and (max-width: 767px) {
  body {
    --header-logo: 24px !important;
  }
}

.kt-logo {
  opacity: 1 !important;
  visibility: visible !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  z-index: 5 !important;
  height: auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: visible !important;
}

.kt-logo-img {
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
  height: var(--header-logo) !important;
  width: auto !important;
  max-height: var(--header-logo) !important;
  object-fit: contain !important;
  filter: none !important;
}

.kt-logo-img--alternate {
  display: none !important;
}

.kt-menu--is-compacted {
  display: none !important;
}

.kt-menu.kt-menu--is-classic,
.kt-menu.kt-menu--is-classic.kt-element--hide-on-portable,
nav.kt-menu {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}

ul.kt-menu--main-level {
  display: flex !important;
  align-items: center !important;
  gap: 1.5rem !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.kt-menu--main-level > li {
  display: inline-flex !important;
}

.kt-menu--main-level .kt-menu__link,
.kt-menu--main-level .kt-menu__link-label,
.kt-header__icons .kt-menu__link {
  color: var(--mv-ink) !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.kt-menu--main-level .kt-menu__link-label {
  font-size: var(--mv-nav-size) !important;
}

.kt-menu__link-icon svg,
.kt-menu__link-icon svg [stroke],
.kt-menu__link-icon svg path,
.kt-menu__link-icon svg rect,
.kt-menu__link-icon .change-fill {
  stroke: var(--mv-ink) !important;
  fill: var(--mv-ink) !important;
  color: var(--mv-ink) !important;
}

@media screen and (max-width: 899px) {
  .kt-menu.kt-menu--is-classic {
    display: none !important;
  }
  .kt-menu--is-compacted,
  .kt-header__compact-icons {
    display: flex !important;
  }
}

/* ===== Category links cards (Men/Women/Boys/Girls) ===== */
#shopify-section-template--21535717097526__section_grid_ddYExW .kt-container,
#shopify-section-template--21535717097526__section_grid_ddYExW .kt-grid {
  gap: 0 !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
}

#shopify-section-template--21535717097526__section_grid_ddYExW .kt-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
}

@media screen and (max-width: 767px) {
  #shopify-section-template--21535717097526__section_grid_ddYExW .kt-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

#shopify-section-template--21535717097526__section_grid_ddYExW .kt-grid__item,
#shopify-section-template--21535717097526__section_grid_ddYExW .kt-card--links {
  margin: 0 !important;
  padding: 0 !important;
  height: 100% !important;
}

/* Match reference panel height (~2:3 portrait per column) */
#shopify-section-template--21535717097526__section_grid_ddYExW .kt-links-card {
  --min-height-user: 0px !important;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 2 / 3;
  cursor: pointer;
  overflow: hidden;
}

#shopify-section-template--21535717097526__section_grid_ddYExW .kt-links-card .kt-image,
#shopify-section-template--21535717097526__section_grid_ddYExW .kt-links-card .kt-image__figure {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding-top: 0 !important;
  margin: 0 !important;
}

#shopify-section-template--21535717097526__section_grid_ddYExW .kt-links-card .kt-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
}

.kt-links-card {
  cursor: pointer;
}

.kt-links-card .kt-links-card__texts-wrapper {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 0.75rem !important;
  transform: none !important;
  pointer-events: none;
}

.kt-links-card .kt-links-card__title,
.kt-links-card .kt-links-card__links a {
  pointer-events: auto;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.kt-links-card .kt-links-card__title {
  height: auto !important;
  opacity: 1 !important;
  padding: 0 !important;
  transition: opacity 150ms ease !important;
  font-size: clamp(1.35rem, 2vw, 1.85rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
}

.kt-links-card .kt-links-card__links {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  overflow: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  transition: height 0.25s ease, opacity 0.25s ease !important;
}

.kt-links-card .kt-links-card__link {
  opacity: 0;
  transform: none !important;
  transition: opacity 120ms ease !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  width: auto !important;
}

/* Must stay inline so underline matches text width, not the full column */
.kt-links-card .kt-links-card__link a,
.kt-links-card .kt-links-card__link a.kt-text-animation--underline {
  color: #fff !important;
  text-decoration: none !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  display: inline !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 0 2px !important;
  margin: 0 !important;
  background-image: linear-gradient(to right, currentColor, currentColor) !important;
  background-repeat: no-repeat !important;
  background-position: left calc(100% - 1px) !important;
  background-size: 0 1px !important;
  transition: background-size 175ms linear !important;
}

.no-touchevents .kt-links-card .kt-links-card__link a.kt-text-animation--underline:hover,
.kt-links-card .kt-links-card__link a.kt-text-animation--underline:hover,
.kt-links-card .kt-links-card__link a.kt-text-animation--underline:focus {
  background-size: 100% 1px !important;
  background-position: left calc(100% - 1px) !important;
}

/* Kill theme spacing that inflates hover list gaps */
.kt-spacing--xsmall .kt-links-card .kt-links-card__links .kt-links-card__link,
.kt-spacing--small .kt-links-card .kt-links-card__links .kt-links-card__link,
.kt-spacing--regular .kt-links-card .kt-links-card__links .kt-links-card__link,
.kt-spacing--large .kt-links-card .kt-links-card__links .kt-links-card__link,
.kt-links-card .kt-links-card__links .kt-links-card__link {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Hover / active: show subcategory list, hide main title */
.kt-links-card:hover .kt-links-card__title,
.kt-links-card:focus-within .kt-links-card__title,
.kt-links-card.kt-active.kt-links-card--hide-heading-on-hover .kt-links-card__title {
  height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}

.kt-links-card:hover .kt-links-card__links,
.kt-links-card:focus-within .kt-links-card__links,
.kt-links-card.kt-active .kt-links-card__links {
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.kt-links-card:hover .kt-links-card__link,
.kt-links-card:focus-within .kt-links-card__link,
.kt-links-card.kt-active .kt-links-card__link {
  opacity: 1 !important;
  transform: none !important;
}

.kt-links-card:hover .kt-image:before,
.kt-links-card:focus-within .kt-image:before,
.kt-links-card.kt-active .kt-image:before {
  background-color: rgba(0, 0, 0, 0.28) !important;
}

.kt-links-card:hover .kt-image,
.kt-links-card:focus-within .kt-image,
.kt-links-card.kt-active .kt-image {
  transform: scale(1.02);
}

.kt-links-card .kt-image img {
  object-position: top center !important;
}

/* ===== Hero ===== */
.mv-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #111;
}

.mv-hero__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}

.mv-hero__shade {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  pointer-events: none;
}

.mv-hero__content {
  position: relative;
  z-index: 2;
  min-height: clamp(420px, 72vh, 760px);
  display: flex;
  align-items: center;
  padding: clamp(2rem, 5vw, 4.5rem) clamp(1.25rem, 6vw, 6rem);
  text-decoration: none;
  color: inherit;
}

.mv-hero__copy {
  max-width: 34rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.35rem;
}

.mv-hero__eyebrow {
  margin: 0;
  font-family: Arial Black, Arial, Helvetica, sans-serif;
  font-size: clamp(0.95rem, 1.6vw, 1.25rem);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #ffffff;
  font-weight: 900;
}

.mv-hero__title {
  margin: 0.15rem 0 0;
  font-family: Arial Black, Arial, Helvetica, sans-serif;
  font-size: clamp(4.2rem, 10vw, 7.5rem);
  line-height: 0.88;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  color: #ffffff;
  font-weight: 900;
}

.mv-hero__sub {
  margin: 0.45rem 0 0;
  max-width: none;
  font-family: Arial Black, Arial, Helvetica, sans-serif;
  font-size: clamp(1.1rem, 2vw, 1.55rem);
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #ffffff;
  font-weight: 900;
}

.mv-hero__ribbon {
  margin-top: 1.1rem;
  display: inline-block;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.55);
  color: #ffffff;
  font-family: Arial Black, Arial, Helvetica, sans-serif;
  font-size: clamp(0.78rem, 1.2vw, 0.95rem);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 900;
  padding: 0.7rem 1.15rem;
  transform: rotate(-6deg);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

.mv-hero__cta {
  margin-top: 1.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 10.5rem;
  padding: 0.95rem 1.5rem;
  background: #ffffff;
  color: #111111 !important;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  transition: transform 180ms ease, background 180ms ease, color 180ms ease;
}

.mv-hero__cta:hover {
  background: transparent;
  color: #ffffff !important;
  outline: 1px solid #ffffff;
  transform: translateY(-2px);
}

@media screen and (max-width: 749px) {
  .mv-hero__media {
    object-position: top center;
  }

  .mv-hero__shade {
    background: rgba(0, 0, 0, 0.65);
  }

  .mv-hero__content {
    min-height: 70vh;
    align-items: center;
    padding-bottom: 2.5rem;
  }

  .mv-hero__title {
    font-size: clamp(3.6rem, 18vw, 5.2rem);
  }
}


/* Text logo helpers */
.mv-logo-wordmark {
  text-decoration: none !important;
  overflow: visible !important;
}
.mv-logo-wordmark .mv-logo-text {
  display: none !important;
}

/* ===== Clean always-visible primary header ===== */
main-header.kt-header__main {
  position: relative !important;
  display: block !important;
  min-height: 56px !important;
  background: var(--mv-header-bg) !important;
}

main-header.kt-header__main > .kt-header__cell.mv-header-cell--hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.mv-clean-header {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  gap: 16px !important;
  min-height: 56px !important;
  width: 100% !important;
  max-width: none !important;
  padding: 10px 40px !important;
  box-sizing: border-box !important;
  background: var(--mv-header-bg) !important;
  position: relative !important;
  z-index: 5 !important;
  border-radius: 0 !important;
}

.mv-clean-left {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-width: 0 !important;
}

.mv-clean-nav {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 1.65rem !important;
}

.mv-clean-nav__link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  color: var(--mv-ink) !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: var(--mv-nav-size) !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.mv-clean-nav__link:after {
  content: "" !important;
  display: inline-block !important;
  width: 0 !important;
  height: 0 !important;
  margin-top: 1px !important;
  border-left: 3.5px solid transparent !important;
  border-right: 3.5px solid transparent !important;
  border-top: 4px solid var(--mv-ink) !important;
  opacity: 0.85 !important;
}

.mv-clean-nav__link:hover {
  opacity: 0.7 !important;
}

.mv-clean-logo {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  line-height: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.mv-clean-logo__img {
  display: block !important;
  height: var(--mv-logo-height) !important;
  width: auto !important;
  max-width: min(220px, 36vw) !important;
  object-fit: contain !important;
}

.mv-clean-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

.mv-clean-actions .kt-header__icons {
  display: flex !important;
  align-items: center !important;
  gap: 1.25rem !important;
}

.mv-clean-menu-btn {
  display: none !important;
  appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--mv-ink) !important;
  font-size: 20px !important;
  line-height: 1 !important;
  padding: 6px 8px !important;
  cursor: pointer !important;
}

/* Footer logo */
.kt-icon-content__image[src*="modaverse_logo"],
.kt-icon-content img[src*="modaverse_logo"],
footer img[src*="modaverse_logo"],
.shopify-section img[src*="modaverse_logo"] {
  width: auto !important;
  height: auto !important;
  max-height: 36px !important;
  max-width: 200px !important;
  object-fit: contain !important;
}

@media screen and (max-width: 899px) {
  .mv-clean-header {
    padding: 10px 16px !important;
  }
  .mv-clean-nav {
    display: none !important;
  }
  .mv-clean-menu-btn {
    display: inline-flex !important;
  }
  .mv-clean-logo__img {
    height: 24px !important;
  }
}
