/** Shopify CDN: Minification failed

Line 656:0 Unexpected "{"
Line 656:1 Expected identifier but found "%"
Line 657:36 Expected identifier but found whitespace
Line 659:3 Expected identifier but found "%"
Line 660:0 Unexpected "{"
Line 660:1 Expected identifier but found "%"
Line 661:0 Unexpected "<"
Line 663:5 Expected identifier but found "%"
Line 664:6 Unexpected "<"
Line 665:9 Expected identifier but found "%"
... and 72 more hidden warnings

**/
/* ==========================================================================
   MEGA MENU CUSTOM — R20 PREMIUM v4 (FIXED)
   Fara @media imbricate. Structura plata, valida CSS.
   Desktop 990px+: 3 col | Tablet 750-989px: 2 col | Mobil: drawer
   ========================================================================== */
/* ------------------------------------------------------------------
   FIX CRITIC: scheme-2 aplica text alb (#fff) pe container.
   Suprascriem bg + culoare text + variabile CSS Dawn
   ------------------------------------------------------------------ */
.mega-menu__content {
  background: #ffffff !important;
  background-image: none !important;
  color: #2b2b2b !important;
  --color-background: 255, 255, 255;
  --color-foreground: 43, 43, 43;
  --gradient-base-background: #ffffff;
}
/* Forteaza culoare inchisa pe orice element de text din panel */
.mega-menu__content a,
.mega-menu__content span,
.mega-menu__content p,
.mega-menu__content h2,
.mega-menu__content h3,
.mega-menu__content li {
  color: #2b2b2b;
}
/* ------------------------------------------------------------------
   1. MEGA MENU PANEL — Umbra, borduri, tranzitie
   ------------------------------------------------------------------ */
.mega-menu__content {
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.04),
    0 8px 20px rgba(0, 0, 0, 0.08),
    0 20px 40px rgba(0, 0, 0, 0.06) !important;
  border-top: 3px solid #9f201c !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-left: none !important;
  border-right: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.js .mega-menu__content {
  opacity: 0;
  transform: translateY(-6px);
  transition:
    opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1),
    transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.mega-menu[open] .mega-menu__content {
  opacity: 1;
  transform: translateY(0);
}
/* ------------------------------------------------------------------
   2. NAVBAR — Linkuri nivel 1 (desktop 990px+)
   ------------------------------------------------------------------ */
@media screen and (min-width: 990px) {
  .header__inline-menu .header__menu-item {
    color: #1f4466 !important;
    font-weight: 600;
    font-size: 1.35rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    padding: 0.8rem 1.2rem !important;
    border-radius: 4px;
    transition: color 0.2s ease, background-color 0.2s ease !important;
    position: relative;
  }
  .header__inline-menu .header__menu-item:hover,
  .header__inline-menu .mega-menu[open] > summary.header__menu-item {
    color: #9f201c !important;
    background-color: rgba(159, 32, 28, 0.06) !important;
  }
  .header__inline-menu .header__menu-item > span {
    position: relative;
    padding-bottom: 2px;
  }
  .header__inline-menu .header__menu-item > span::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 0;
    height: 2px;
    background: #9f201c;
    border-radius: 2px;
    transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .header__inline-menu .header__menu-item:hover > span::after,
  .header__inline-menu .mega-menu[open] > summary > span::after {
    width: 100%;
  }
  .header__inline-menu .header__menu-item .icon-caret {
    transition: transform 0.22s ease;
    color: #1f4466 !important;
    fill: #1f4466 !important;
  }
  .header__inline-menu .mega-menu[open] > summary .icon-caret {
    transform: rotate(180deg);
    color: #9f201c !important;
    fill: #9f201c !important;
  }
}
/* ------------------------------------------------------------------
   3. INNER LAYOUT — Grid: stanga (linkuri) + dreapta (promo)
      DESKTOP 990px+: side by side
      TABLET 750-989px: coloana unica, promo ascuns
   ------------------------------------------------------------------ */
@media screen and (min-width: 990px) {
  .mega-menu__inner {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 0;
    align-items: stretch;
    min-height: 280px;
  }
  .mega-menu__promo {
    display: flex;
    align-items: stretch;
    position: relative;
  }
}
@media screen and (min-width: 750px) and (max-width: 989px) {
  .mega-menu__inner {
    display: block;
  }
  .mega-menu__promo {
    display: none !important;
  }
}
/* ------------------------------------------------------------------
   4. GRID SUBCATEGORII (nivel 2 + 3)
   ------------------------------------------------------------------ */
/* DESKTOP: 3 coloane */
@media screen and (min-width: 990px) {
  .mega-menu__list {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0 !important;
    list-style: none !important;
    padding: 2.8rem 3rem !important;
    margin: 0 !important;
  }
}
/* TABLET: 2 coloane */
@media screen and (min-width: 750px) and (max-width: 989px) {
  .mega-menu__list {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0 !important;
    list-style: none !important;
    padding: 2rem 2.4rem !important;
    margin: 0 !important;
  }
}
/* ------------------------------------------------------------------
   5. COLOANE — stilizare fiecare item nivel 2 + copii
   ------------------------------------------------------------------ */
/* Comun desktop + tablet */
@media screen and (min-width: 750px) {
  .mega-menu__list > li {
    padding: 0.8rem 1.6rem !important;
    border-right: 1px solid rgba(0, 0, 0, 0.06);
    transition: background-color 0.18s ease;
    border-radius: 6px;
  }
  .mega-menu__list > li:hover {
    background-color: rgba(31, 68, 102, 0.04);
  }
  /* Titlul coloanei — nivel 2 */
  summary.mega-menu__link--level-2 {
    list-style: none;
    cursor: pointer;
  }
  
  summary.mega-menu__link--level-2::-webkit-details-marker {
    display: none;
  }
  .mega-menu__link--level-2 {
    color: #1f4466 !important;
    font-weight: 700 !important;
    font-size: 1.3rem !important;
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    padding-bottom: 1rem !important;
    margin-bottom: 0.8rem !important;
    border-bottom: 2px solid rgba(31, 68, 102, 0.12) !important;
    transition: color 0.2s ease !important;
    display: block !important;
  }
  .mega-menu__summary-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
  .mega-menu__link--level-2-title {
    display: flex;
    align-items: center;
    gap: 0.6rem;
  }
  /* Red dot indicator */
  .mega-menu__link--level-2-title::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    background: #9f201c;
    border-radius: 50%;
    flex-shrink: 0;
    transition: transform 0.2s ease;
  }
  .mega-menu__link--level-2:hover {
    color: #9f201c !important;
    border-bottom-color: rgba(159, 32, 28, 0.25) !important;
  }
  .mega-menu__link--level-2:hover .mega-menu__link--level-2-title::before {
    transform: scale(1.5);
  }
  /* Caret icon for collapsible level 2 */
  .mega-menu__link--level-2 .icon-caret {
    transition: transform 0.2s ease;
    width: 1rem;
    height: 1rem;
    fill: currentColor;
  }
  details[open] > summary.mega-menu__link--level-2 .icon-caret {
    transform: rotate(180deg);
  }
  /* Force hide content when not open (overrides Dawn base.css which might force block) */
  details.mega-menu__details:not([open]) > .mega-menu__submenu {
    display: none !important;
  }
  .mega-menu__submenu {
    animation: submenuSlideDown 0.2s ease-out forwards;
    transform-origin: top;
  }
  @keyframes submenuSlideDown {
    0% {
      opacity: 0;
      transform: translateY(-5px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  /* Lista nivel 3 */
  .mega-menu__list .list-unstyled {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .mega-menu__list .list-unstyled li {
    margin-bottom: 0;
    position: relative;
  }
  /* Separator intre sub-linkuri */
  .mega-menu__list .list-unstyled li + li::before {
    content: '';
    display: block;
    height: 1px;
    background: linear-gradient(
      to right,
      transparent,
      rgba(31, 68, 102, 0.12) 20%,
      rgba(31, 68, 102, 0.12) 80%,
      transparent
    );
    margin: 0.1rem 0;
  }
  /* Linkuri nivel 3 */
  .mega-menu__list .list-unstyled a.mega-menu__link {
    color: #5a6a7a !important;
    font-size: 1.3rem !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    padding: 0.5rem 0 !important;
    display: flex !important;
    align-items: center;
    border-bottom: none !important;
    transition: color 0.18s ease, padding-left 0.18s ease !important;
    line-height: 1.45;
  }
  .mega-menu__list .list-unstyled a.mega-menu__link::before {
    content: '›';
    font-size: 1.4rem;
    line-height: 1;
    color: transparent;
    transition: color 0.18s ease;
    flex-shrink: 0;
    margin-right: 0.2rem;
  }
  .mega-menu__list .list-unstyled a.mega-menu__link:hover {
    color: #9f201c !important;
    padding-left: 0.6rem !important;
  }
  .mega-menu__list .list-unstyled a.mega-menu__link:hover::before {
    color: #9f201c;
  }
  .mega-menu__link--active {
    color: #9f201c !important;
    font-weight: 600 !important;
  }
}
/* Bordura dreapta: ultimul din rand pe desktop (al 3-lea) */
@media screen and (min-width: 990px) {
  .mega-menu__list > li:nth-child(3n) {
    border-right: none;
  }
}
/* Bordura dreapta: ultimul din rand pe tablet (al 2-lea) */
@media screen and (min-width: 750px) and (max-width: 989px) {
  .mega-menu__list > li:nth-child(2n) {
    border-right: none;
  }
}
/* ------------------------------------------------------------------
   6. PROMO BANNER — Coloana dreapta (desktop only)
   ------------------------------------------------------------------ */
@media screen and (min-width: 990px) {
  .mega-menu__promo::before {
    content: '';
    position: absolute;
    left: 0;
    top: 2.5rem;
    bottom: 2.5rem;
    width: 1px;
    background: linear-gradient(
      to bottom,
      transparent,
      rgba(0, 0, 0, 0.08) 20%,
      rgba(0, 0, 0, 0.08) 80%,
      transparent
    );
  }
  .mega-menu__promo-banner {
    background: linear-gradient(145deg, #1c2956 0%, #1f4466 40%, #9f201c 100%) !important;
    padding: 3.5rem 2.8rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    overflow: hidden;
  }
  .mega-menu__promo-banner::before {
    content: '';
    position: absolute;
    top: -60px;
    right: -60px;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    border: 40px solid rgba(255, 255, 255, 0.06);
    pointer-events: none;
  }
  .mega-menu__promo-banner::after {
    content: '';
    position: absolute;
    bottom: -40px;
    left: -40px;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    border: 30px solid rgba(255, 255, 255, 0.05);
    pointer-events: none;
  }
  .mega-menu__promo-badge {
    display: inline-block;
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff !important;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.3rem 1rem;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    margin-bottom: 1.4rem;
    position: relative;
    z-index: 1;
  }
  .mega-menu__promo-title {
    font-size: 2rem !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin: 0 0 0.5rem 0 !important;
    letter-spacing: 0.02em;
    line-height: 1.15 !important;
    position: relative;
    z-index: 1;
  }
  .mega-menu__promo-subtitle {
    font-size: 2.6rem !important;
    font-weight: 900 !important;
    color: rgba(255, 255, 255, 0.95) !important;
    margin: 0 0 1.2rem 0 !important;
    line-height: 1 !important;
    letter-spacing: -0.02em;
    position: relative;
    z-index: 1;
  }
  .mega-menu__promo-desc {
    font-size: 1.25rem !important;
    color: rgba(255, 255, 255, 0.78) !important;
    margin: 0 0 2.5rem 0 !important;
    line-height: 1.55 !important;
    position: relative;
    z-index: 1;
  }
  .mega-menu__promo-desc strong {
    color: rgba(255, 255, 255, 0.96) !important;
    font-weight: 700;
  }
  .mega-menu__promo-button {
    display: inline-flex !important;
    align-items: center;
    gap: 0.7rem;
    background-color: #ffffff !important;
    color: #9f201c !important;
    font-weight: 700 !important;
    font-size: 1.2rem !important;
    padding: 0.9rem 1.8rem !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
    transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative;
    z-index: 1;
    overflow: hidden;
  }
  .mega-menu__promo-button::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(159, 32, 28, 0.07);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.22s ease;
    z-index: 0;
  }
  .mega-menu__promo-button:hover::before {
    transform: scaleX(1);
  }
  .mega-menu__promo-button > span {
    position: relative;
    z-index: 1;
  }
  .mega-menu__promo-arrow {
    display: inline-block;
    transition: transform 0.22s ease;
    font-size: 1.4rem;
  }
  .mega-menu__promo-button:hover {
    background-color: #fff9f9 !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
    transform: translateY(-1px);
  }
  .mega-menu__promo-button:hover .mega-menu__promo-arrow {
    transform: translateX(4px);
  }
}
/* ------------------------------------------------------------------
   7. CONDENSED MODE (meniuri fara nivel 3)
   ------------------------------------------------------------------ */
@media screen and (min-width: 750px) {
  .mega-menu__list--condensed {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;
  }
  .mega-menu__list--condensed .mega-menu__link--level-2 {
    font-weight: 500 !important;
    border-bottom: none !important;
    text-transform: none;
    letter-spacing: 0.02em;
    font-size: 1.35rem !important;
  }
  .mega-menu__list--condensed .mega-menu__link--level-2::before {
    display: none;
  }
}
/* ------------------------------------------------------------------
   8. MOBILE DRAWER — Stilizare premium acordeon
   ------------------------------------------------------------------ */
@media screen and (max-width: 989px) {
  #menu-drawer {
    background: #ffffff !important;
    background-image: none !important;
    border-right: 1px solid rgba(0, 0, 0, 0.07) !important;
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.12) !important;
  }
  .header__icon--menu {
    color: #1f4466;
    transition: color 0.2s ease;
  }
  .header__icon--menu:hover {
    color: #9f201c;
  }
  .menu-drawer__menu-item {
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    color: #1f4466 !important;
    padding: 1.4rem 2rem !important;
    border-bottom: 1px solid rgba(31, 68, 102, 0.08) !important;
    letter-spacing: 0.02em;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: background-color 0.18s ease, color 0.18s ease !important;
    min-height: 52px;
  }
  .menu-drawer__menu-item:hover,
  .menu-drawer__menu-item--active {
    background-color: rgba(31, 68, 102, 0.05) !important;
    color: #9f201c !important;
  }
  .menu-drawer__menu-item .icon-caret {
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    color: #1f4466;
    opacity: 0.6;
  }
  details[open] > summary .icon-caret {
    transform: rotate(180deg);
    color: #9f201c;
    opacity: 1;
  }
  .menu-drawer__menu-item .svg-wrapper:first-of-type {
    display: none;
  }
  .menu-drawer__submenu {
    background: #f7f9fc !important;
    background-image: none !important;
    border-left: 3px solid #9f201c !important;
    margin-left: 1.6rem;
    border-radius: 0 0 0 4px;
    transition: opacity 0.2s ease !important;
  }
  .menu-drawer__close-button {
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    color: #1f4466 !important;
    padding: 1.2rem 2rem !important;
    border-bottom: 2px solid rgba(31, 68, 102, 0.1) !important;
    display: flex !important;
    align-items: center;
    gap: 0.8rem;
    letter-spacing: 0.02em;
    width: 100%;
    background: rgba(31, 68, 102, 0.04);
    text-align: left;
  }
  .menu-drawer__close-button:hover {
    color: #9f201c !important;
    background: rgba(31, 68, 102, 0.08);
  }
  .menu-drawer__submenu .menu-drawer__menu-item {
    font-size: 1.4rem !important;
    font-weight: 500 !important;
    color: #2b2b2b !important;
    padding: 1.2rem 2rem 1.2rem 2.4rem !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
    background: transparent !important;
    min-height: 48px;
  }
  .menu-drawer__submenu .menu-drawer__menu-item:hover {
    color: #9f201c !important;
    background-color: rgba(159, 32, 28, 0.04) !important;
    padding-left: 3rem !important;
  }
  .menu-drawer__submenu .menu-drawer__submenu {
    border-left: 2px solid rgba(159, 32, 28, 0.3) !important;
    margin-left: 1.2rem;
    background: rgba(255, 255, 255, 0.7) !important;
  }
  .menu-drawer__submenu .menu-drawer__submenu .menu-drawer__menu-item {
    font-size: 1.3rem !important;
    font-weight: 400 !important;
    color: #5a6a7a !important;
    padding: 1rem 2rem 1rem 2.8rem !important;
    min-height: 44px;
  }
  .menu-drawer__submenu .menu-drawer__submenu .menu-drawer__menu-item:hover {
    color: #9f201c !important;
    padding-left: 3.2rem !important;
  }
  .menu-drawer__utility-links {
    border-top: 2px solid rgba(31, 68, 102, 0.08);
    padding: 2rem !important;
    margin-top: auto;
  }
  .menu-drawer__account {
    font-size: 1.4rem !important;
    font-weight: 600 !important;
    color: #1f4466 !important;
    padding: 1rem 0 !important;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 1.2rem;
  }
  .menu-drawer__account:hover {
    color: #9f201c !important;
  }
  .menu-drawer__utility-links .list-social__link {
    color: #1f4466 !important;
    padding: 0.8rem !important;
    border-radius: 50%;
    transition: background-color 0.18s ease, color 0.18s ease !important;
  }
  .menu-drawer__utility-links .list-social__link:hover {
    background-color: rgba(31, 68, 102, 0.08);
    color: #9f201c !important;
  }
}
/* ------------------------------------------------------------------
   9. ACCESIBILITATE & FOCUS
   ------------------------------------------------------------------ */
.mega-menu__link:focus-visible,
.menu-drawer__menu-item:focus-visible {
  outline: 2px solid #9f201c;
  outline-offset: 3px;
  border-radius: 3px;
}
/* ------------------------------------------------------------------
   10. Z-INDEX & STICKY HEADER
   ------------------------------------------------------------------ */
.section-header {
  z-index: 100 !important;
}
.shopify-section-header-sticky .mega-menu__content {
  max-height: calc(100vh - var(--header-bottom-position-desktop, 8rem) - 2rem);
  overflow-y: auto;
}
{% comment %}
  Renders a megamenu for the header.
  Usage:
  {% render 'header-mega-menu' %}
{% endcomment %}
<nav class="header__inline-menu">
  <ul class="list-menu list-menu--inline" role="list">
    {%- for link in section.settings.menu.links -%}
      <li>
        {%- if link.links != blank -%}
          <header-menu>
            <details id="Details-HeaderMenu-{{ forloop.index }}" class="mega-menu">
              <summary
                id="HeaderMenu-{{ link.handle }}"
                class="header__menu-item list-menu__item link focus-inset"
              >
                <span
                  {%- if link.child_active %}
                    class="header__active-menu-item"
                  {% endif %}
                >
                  {{- link.title | escape -}}
                </span>
                {{- 'icon-caret.svg' | inline_asset_content -}}
              </summary>
              <div
                id="MegaMenu-Content-{{ forloop.index }}"
                class="mega-menu__content color-{{ section.settings.menu_color_scheme }} gradient motion-reduce global-settings-popup"
                tabindex="-1"
              >
                <div class="mega-menu__inner page-width">
                  <ul
                    class="mega-menu__list{% if link.levels == 1 %} mega-menu__list--condensed{% endif %}"
                    role="list"
                  >
                    {%- for childlink in link.links -%}
                      <li>
                        {%- if childlink.links != blank -%}
                          <details id="Details-MegaMenu-{{ link.handle }}-{{ childlink.handle }}" class="mega-menu__details">
                            <summary
                              id="HeaderMenu-{{ link.handle }}-{{ childlink.handle }}"
                              class="mega-menu__link mega-menu__link--level-2 link{% if childlink.current %} mega-menu__link--active{% endif %}"
                              {% if childlink.current %}
                                aria-current="page"
                              {% endif %}
                            >
                              <span class="mega-menu__link--level-2-title">
                                {{ childlink.title | escape }}
                              </span>
                              {{- 'icon-caret.svg' | inline_asset_content -}}
                              <div class="mega-menu__summary-inner">
                                <span class="mega-menu__link--level-2-title">
                                  {{ childlink.title | escape }}
                                </span>
                                {{- 'icon-caret.svg' | inline_asset_content -}}
                              </div>
                            </summary>
                            <ul class="list-unstyled mega-menu__submenu" role="list">
                              {%- for grandchildlink in childlink.links -%}
                                <li>
                                  <a
                                    id="HeaderMenu-{{ link.handle }}-{{ childlink.handle }}-{{ grandchildlink.handle }}"
                                    href="{{ grandchildlink.url }}"
                                    class="mega-menu__link link{% if grandchildlink.current %} mega-menu__link--active{% endif %}"
                                    {% if grandchildlink.current %}
                                      aria-current="page"
                                    {% endif %}
                                  >
                                    {{ grandchildlink.title | escape }}
                                  </a>
                                </li>
                              {%- endfor -%}
                            </ul>
                          </details>
                        {%- else -%}
                          <a
                            id="HeaderMenu-{{ link.handle }}-{{ childlink.handle }}"
                            href="{{ childlink.url }}"
                            class="mega-menu__link mega-menu__link--level-2 link{% if childlink.current %} mega-menu__link--active{% endif %}"
                            {% if childlink.current %}
                              aria-current="page"
                            {% endif %}
                          >
                            {{ childlink.title | escape }}
                          </a>
                        {%- endif -%}
                      </li>
                    {%- endfor -%}
                  </ul>
                  <div class="mega-menu__promo">
                    <div class="mega-menu__promo-banner">
                      <div class="mega-menu__promo-badge">OFERTA ZILEI</div>
                      <h3 class="mega-menu__promo-title">REDUCERI SPECIALE!</h3>
                      <p class="mega-menu__promo-subtitle">Până la 40% DISCOUNT</p>
                      <p class="mega-menu__promo-desc">La selecția de scule electrice <strong>Raider, Topmaster & Gardex</strong>.</p>
                      <a href="/collections/promotii" class="mega-menu__promo-button">
                        <span>VEZI OFERTA</span>
                        <span class="mega-menu__promo-arrow">→</span>
                      </a>
                    </div>
                  </div>
                </div>
              </div>
            </details>
          </header-menu>
        {%- else -%}
          <a
            id="HeaderMenu-{{ link.handle }}"
            href="{{ link.url }}"
            class="header__menu-item list-menu__item link link--text focus-inset"
            {% if link.current %}
              aria-current="page"
            {% endif %}
          >
            <span
              {%- if link.current %}
                class="header__active-menu-item"
              {% endif %}
            >
              {{- link.title | escape -}}
            </span>
          </a>
        {%- endif -%}
      </li>
    {%- endfor -%}
  </ul>
</nav>