/** Shopify CDN: Minification failed

Line 218:2 Unexpected "/"

**/
/* ==========================================================================
   IWAO Header Styles
   ========================================================================== */

a {
  text-decoration: none;
}

/* --- CSS Custom Property for header foreground color --- */
.header-wrapper {
  --header-fg: var(--color-foreground);
  transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1),
              backdrop-filter 0.4s ease;
}

/* === HEADER LINK RESETS === */
/* Override base.css .link { text-decoration: underline } for all header elements */
/* Use --header-fg so colors adapt to transparent/scrolled state automatically */
.header-wrapper a,
.header-wrapper a:visited,
.header-wrapper a.link,
.header-wrapper .header__menu-item,
.header-wrapper .header__menu-item:visited,
.header-wrapper .header__icon.link,
.header-wrapper .header__heading-link.link,
.header-wrapper .header__icon--search.link,
.header-wrapper summary.link {
  text-decoration: none;
  color: rgb(var(--header-fg));
  transition: color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.header-wrapper .header__inner_btns a,
.header-wrapper .header__inner_btns a:visited {
  text-decoration: none;
  color: rgb(var(--header-fg));
  transition: color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.header__icon,
.header__icon:visited,
.header__icon.link {
  text-decoration: none;
}

/* === TRANSPARENT HEADER (homepage at top) === */
.header-wrapper--transparent {
  --header-fg: 255, 255, 255;
  background-color: transparent;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 999;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Dark gradient overlay – ensures menu items are always readable */
.header-wrapper--transparent::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: -40px;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.55) 0%,
    rgba(0, 0, 0, 0.18) 70%,
    rgba(0, 0, 0, 0) 100%
  );
  pointer-events: none;
  opacity: 1;
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Ensure header content sits above the gradient overlay */
.header-wrapper--transparent header.header {
  z-index: 1;
}

/* Fade out gradient when scrolled, mega-menu or drawer open */
.scrolled-past-header .header-wrapper--transparent::before,
.header-wrapper--transparent.mega-menu-is-open::before,
.header-wrapper--transparent.open_drawer::before {
  opacity: 0;
}

/* States that trigger white/solid header */
.scrolled-past-header .header-wrapper--transparent,
.header-wrapper--transparent.mega-menu-is-open,
.header-wrapper--transparent.open_drawer {
  --header-fg: var(--color-foreground);
  background-color: rgb(var(--color-background));
}

/* === HEADER FOREGROUND COLORS === */
.header-wrapper--transparent .header__menu-item,
.header-wrapper--transparent .header__menu-item:visited,
.header-wrapper--transparent .header__active-menu-item,
.header-wrapper--transparent .header__icon,
.header-wrapper--transparent .header__inner_btns a,
.header-wrapper--transparent .header__inner_btns a:visited,
.header-wrapper--transparent a.header__heading-link {
  color: rgb(var(--header-fg));
  transition: color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* All SVGs in header icons use fill: currentColor, inherit from parent */
.header-wrapper--transparent .header__icon svg {
  fill: rgb(var(--header-fg));
  transition: fill 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Caret icon uses stroke */
.header-wrapper--transparent .header__menu-item svg.icon.icon-caret,
.header-wrapper--transparent .header__menu-item svg.icon.icon-caret * {
  stroke: rgb(var(--header-fg));
  transition: stroke 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Chevron icon uses stroke */
.header-wrapper--transparent .chevron__icon,
.header-wrapper--transparent .chevron__icon path {
  stroke: rgb(var(--header-fg));
  transition: stroke 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hamburger icon uses stroke */
.header-wrapper--transparent .header__icon--menu svg *,
.header-wrapper--transparent svg.icon.icon-hamburger * {
  stroke: rgb(var(--header-fg));
  transition: stroke 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Button border color adapts */
.header-wrapper--transparent a.header__inner_btn_item {
  border-color: rgb(var(--header-fg));
  color: rgb(var(--header-fg));
  transition: border-color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
              color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
              background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Store/showroom icon - uses fill:currentColor, override stroke from old SVG */
.header-wrapper--transparent span.store__icon svg {
  fill: rgb(var(--header-fg));
  transition: fill 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Submenus always black text */
.header-wrapper--transparent ul.header__submenu .header__menu-item {
  color: rgb(var(--color-foreground));
}

/* Close icon always black */
svg.icon.icon-close * {
  stroke: black;
}

/* === LOGO SWITCHING === */
.header__heading-logo-wrapper {
  position: relative;
}

.header__transperant-logo {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.header__sticky-logo {
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Show black logo when scrolled, mega open, or drawer open */
.scrolled-past-header .header__transperant-logo,
.mega-menu-is-open .header__transperant-logo,
.open_drawer .header__transperant-logo {
  opacity: 0;
}

.scrolled-past-header .header__sticky-logo,
.mega-menu-is-open .header__sticky-logo,
.open_drawer .header__sticky-logo {
  opacity: 1;
}

/* When not transparent (subpages), always show sticky logo */
.header-wrapper:not(.header-wrapper--transparent) .header__sticky-logo {
  opacity: 1;
}

/* === HEADER BOTTOM BORDER === */
.header-wrapper header.header {
  position: relative;
  overflow: visible;
}

.header-wrapper::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(0, 0, 0, 0.1);
  transition: background 0.4s ease;
}*/

/* Transparent state: white subtle border */
.header-wrapper--transparent:not(.scrolled-past-header):not(.mega-menu-is-open):not(.open_drawer) header.header::after {
  background: rgba(255, 255, 255, 0.2);
}

/* Drawer open: gray border */
.open_drawer header.header::after {
  background: rgba(128, 128, 128, 0.2);
}

/* === STICKY HEADER SHADOW === */
.shopify-section-header-sticky {
  transition: box-shadow 0.3s ease;
}

.scrolled-past-header sticky-header {
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
}

/* === MENU ITEMS === */
.header__menu-item {
  color: rgba(var(--color-foreground));
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 5px;
  gap: 8px;
  position: relative;
}

/* Menu underline animation */
.header__inline-menu .header__menu-item::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -2px;
  height: 1.5px;
  width: 0;
  background: rgb(var(--header-fg, var(--color-foreground)));
  transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.header__inline-menu .header__menu-item:hover::after {
  width: 100%;
}

.header__inline-menu ul.list-menu {
  column-gap: 15px;
  flex-wrap: nowrap;
}

.header__inline-menu .header__menu-item {
  white-space: nowrap;
}

/* === CARET / CHEVRON ICONS === */
svg.chevron__icon {
  width: 12px;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.chevron__icon path {
  transition: stroke 0.4s ease;
}

/* Caret icon in menus - smaller and cleaner */
.header__menu-item svg.icon.icon-caret {
  width: 10px;
  height: 6px;
  position: relative;
  top: 1px;
}

/* Caret stroke adapts to color */
.header__menu-item svg.icon.icon-caret path {
  stroke: currentColor;
  stroke-width: 1.5;
}

/* === HEADER ICONS === */
.header__icon svg {
  width: 24px;
  height: 24px;
  stroke: none;
}

/* Remove any inherited strokes from new fill-based icons */
.header__icon--search svg,
.header__icon--account svg,
.header__icon--cart svg {
  stroke: none;
}

/* === CUSTOM BUTTONS (Quiz + Showroom) === */
.header__inner_btns {
  display: flex;
  align-items: center;
  gap: 20px;
}

.header__inner_btns a {
  color: rgb(var(--color-foreground));
  text-decoration: none;
}

a.header__inner_btn_item {
  border: 1px solid;
  padding: 7px 15px;
  border-radius: 50px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  position: relative;
  overflow: hidden;
}

a.header__inner_btn_2 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

span.store__icon {
  display: flex;
  align-items: center;
}

span.store__icon svg {
  width: 22px;
  height: 22px;
}

/* === PRODUCT INSTALLMENT (non-header but was here) === */
.product_instelment span img {
  width: 23px;
  height: 26px;
  object-fit: contain;
}

.product_instelment a.download-btn {
  color: black;
  text-decoration: underline;
  font-weight: 700;
}

/* === FACETS (non-header but was here) === */
.FacetsWrapperDesktop___row * {
  color: black;
}

/* ==========================================================================
   RESPONSIVE BREAKPOINTS

   >= 1350px : Full desktop (all visible, single line)
   1280-1349px : Hide quiz button, keep showroom
   1200-1279px : Hide all buttons, tighter spacing
   < 1200px : Hamburger menu (logo always centered)
   ========================================================================== */

/* --- 1350px: Hide quiz button first (widest element) --- */
@media (max-width: 1349px) {
  a.header__inner_btn_item {
    display: none;
  }

  .header__inner_btns {
    gap: 12px;
  }

  /* Tighter menu spacing */
  .header__inline-menu ul.list-menu {
    column-gap: 10px;
  }

  .header__menu-item {
    font-size: 13px;
  }
}

/* --- 1280px: Hide all custom buttons --- */
@media (max-width: 1279px) {
  .header__inner_btns {
    display: none;
  }
}

/* --- 1200-1279px: Compact desktop nav --- */
@media (min-width: 1200px) and (max-width: 1279px) {
  .header__inline-menu ul.list-menu {
    column-gap: 8px;
  }

  .header__menu-item {
    font-size: 12px;
  }
}

/* --- < 1200px: Switch to hamburger menu --- */
/* Hide desktop nav, show drawer at this wider breakpoint */
@media (max-width: 1199px) {
  .header__inline-menu {
    display: none !important;
  }

  /* Ensure drawer/hamburger is visible */
  header-drawer {
    display: flex !important;
  }

  /* Hide desktop-only localization */
  .desktop-localization-wrapper {
    display: none;
  }
}

/* ==========================================================================
   RESPONSIVE - Mobile drawer adjustments (<= 1050px)
   ========================================================================== */
@media (max-width: 1050px) {
  /* Drawer contents: black text */
  .menu-drawer__inner-container * {
    color: rgb(var(--color-foreground));
  }

  /* Drawer open on transparent: solid background */
  .section-header:not(.scrolled-past-header) .open_drawer.header-wrapper--transparent {
    background: rgb(var(--color-background));
  }

  /* Drawer menu height */
  .section-header:not(.scrolled-past-header) .header-wrapper--transparent .menu-drawer {
    height: calc(var(--viewport-height, 100vh) - 139px);
  }

  .section-header.scrolled-past-header .header-wrapper--transparent .menu-drawer {
    height: calc(var(--viewport-height, 100vh) - 88px);
  }

  /* Drawer buttons wrapper */
  .menu-drawer__btn___wrapper {
    display: flex;
    padding: 10px 15px 20px;
    gap: 12px;
  }

  /* Social links in drawer */
  .menu-drawer__utility-links ul.list.list-social {
    margin: 0;
    gap: 10px;
  }

  .menu-drawer__utility-links {
    padding-top: 0;
    background: transparent;
  }

  /* Mobile mega menu images */
  .menu_drawer-mega_images {
    display: flex;
    padding: 10px 15px 0;
    gap: 10px;
  }

  .menu_drawer-mega_item {
    width: calc(100% / 2);
    position: relative;
  }

  .menu_drawer-mega_item-info a::after {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    left: 0;
    z-index: 22;
  }

  .menu_drawer-mega_item-image img {
    width: 100%;
    height: 100%;
    aspect-ratio: 1.5;
    object-fit: cover;
    object-position: center;
  }

  .menu_drawer-mega_item-image {
    display: flex;
    overflow: hidden;
    border-radius: 6px;
  }

  .menu_drawer-mega_item-info a {
    font-size: 14px;
    letter-spacing: 0;
    font-weight: 500;
    text-decoration: none;
  }

  .menu_drawer-mega_item-info {
    margin-top: 5px;
    display: flex;
    flex-direction: column;
  }

  .mega_item-info-text {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #5d5c5b;
    font-size: 14px;
    line-height: 1;
  }

  .mega_item-info-text svg {
    width: 12px;
    height: 13px;
    margin-top: 2px;
  }

  .mega_item-info-text svg path {
    fill: #5d5c5b;
  }
}
