.site-header{position:sticky;top:0;z-index:var(--ds-z-sticky);background:var(--ds-surface);border-bottom:var(--ds-border-hairline) solid var(--ds-separator-soft)}:root{--wapu-mobile-appbar-height: calc(60px + env(safe-area-inset-bottom, 0px)) }.admin-bar .site-header{top:32px}@media screen and (max-width: 782px){.admin-bar .site-header{top:46px}}.main-navigation{width:100%}.nav-container{max-width:1280px;margin:0 auto;padding:var(--ds-s-2) var(--ds-s-3);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--ds-s-4)}.nav-search-trigger{display:inline-flex;align-items:center;justify-content:flex-start}.nav-search{min-width:0}.nav-search .wapu-search-wrap{max-width:400px}.nav-search-form{display:flex;align-items:center;position:relative;max-width:400px}.nav-search-form__icon{position:absolute;left:var(--ds-s-2);width:16px;height:16px;color:var(--ds-ink-4);pointer-events:none}.site-branding{text-align:center;min-width:0}.site-branding .custom-logo-link{display:inline-flex;align-items:center;justify-content:center}.site-branding .custom-logo-link img{max-height:40px;width:auto}.site-branding .site-name{display:inline-flex;align-items:center;font-size:var(--ds-fs-title-3);font-weight:var(--ds-fw-bold);color:var(--ds-ink);text-decoration:none;letter-spacing:var(--ds-ls-tight)}.nav-actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--ds-s-1)}.nav-action-link{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--ds-s-5);height:var(--ds-s-5);border-radius:var(--ds-r-pill);border:none;background:transparent;color:var(--ds-ink);text-decoration:none;cursor:pointer;transition:background-color var(--ds-dur-fast) var(--ds-ease)}.nav-action-link:hover{background:var(--ds-fill-4)}.nav-action-link svg{width:22px;height:22px}.nav-action-link .cart-count{position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 4px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--ds-r-pill);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-bold);line-height:1;background:var(--ds-action);color:var(--ds-action-ink)}.nav-categories{display:flex;justify-content:center;background:var(--ds-ink);border-top:none;padding:0 var(--ds-s-3)}.nav-categories .nav-menu{display:flex;align-items:center;justify-content:center;gap:var(--ds-s-4);margin:0;padding:0;list-style:none}.nav-categories .nav-menu li{margin:0;padding:0}.nav-categories .nav-menu a,.nav-categories .nav-link{display:inline-flex;align-items:center;padding:var(--ds-s-2) 0;font-size:var(--ds-fs-caption-1);font-weight:var(--ds-fw-semibold);letter-spacing:.08em;text-transform:uppercase;color:var(--ds-surface);text-decoration:none;transition:opacity var(--ds-dur-fast) var(--ds-ease);border-bottom:1.5px solid transparent}.nav-categories .nav-menu a:hover,.nav-categories .nav-link:hover{color:var(--ds-surface);opacity:.7}.nav-categories .current-menu-item>a,.nav-categories .current-menu-parent>a{color:var(--ds-surface);border-bottom-color:var(--ds-surface)}.nav-categories .sub-menu,.nav-mobile-header,.wapu-mobile-bottom-nav{display:none}.wapu-mobile-catalog-drawer{position:fixed;top:0;right:0;bottom:0;left:0;display:block;pointer-events:none;z-index:var(--ds-z-modal);visibility:hidden}.wapu-mobile-catalog-drawer.is-open{pointer-events:auto;visibility:visible}.wapu-mobile-catalog-drawer__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0006;border:none;cursor:default;opacity:0;transition:opacity var(--ds-dur) var(--ds-ease)}.wapu-mobile-catalog-drawer.is-open .wapu-mobile-catalog-drawer__overlay{opacity:1}.wapu-mobile-catalog-drawer__panel{position:absolute;top:0;right:0;bottom:0;width:min(380px,85vw);background:var(--ds-surface);transform:translate(100%);transition:transform var(--ds-dur) var(--ds-ease-spring);display:flex;flex-direction:column;z-index:1;box-shadow:var(--ds-shadow-lg)}.wapu-mobile-catalog-drawer.is-open .wapu-mobile-catalog-drawer__panel{transform:translate(0)}.wapu-mobile-catalog-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:var(--ds-s-2);border-bottom:var(--ds-border-hairline) solid var(--ds-separator-soft);flex-shrink:0}.wapu-mobile-catalog-drawer__title{font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-bold);color:var(--ds-ink);margin:0}.wapu-mobile-catalog-drawer__close{width:var(--ds-s-4);min-height:var(--ds-s-4);border-radius:var(--ds-r-xs)}.wapu-drawer__viewport{flex:1;overflow:hidden;position:relative;min-height:0}.wapu-drawer__slider{display:flex;flex-direction:row;height:100%;transition:transform var(--ds-dur) var(--ds-ease-spring);will-change:transform}.wapu-drawer__level{flex:0 0 100%;width:100%;height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:var(--ds-s-1);padding:var(--ds-s-2)}.wapu-drawer__level[hidden]{display:none}.wapu-drawer__section-title{font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-semibold);line-height:var(--ds-lh-snug);color:var(--ds-ink-3);letter-spacing:var(--ds-ls-wide);text-transform:uppercase;margin:var(--ds-s-2) 0 var(--ds-s-1);padding:0 var(--ds-s-1)}.wapu-drawer__section-title:first-child{margin-top:0}.wapu-drawer__link{-moz-appearance:none;appearance:none;-webkit-appearance:none;margin:0;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:var(--ds-s-1);min-height:44px;padding:var(--ds-s-1) var(--ds-s-2);width:100%;font-family:var(--ds-font-text);font-size:var(--ds-fs-body);font-weight:var(--ds-fw-regular);line-height:var(--ds-lh-snug);text-align:left;color:var(--ds-ink);text-decoration:none;background:transparent;border:0;border-radius:var(--ds-r-sm);transition:background-color var(--ds-dur-fast) var(--ds-ease);-webkit-tap-highlight-color:transparent}.wapu-drawer__link:hover,.wapu-drawer__link:focus-visible{background-color:var(--ds-fill-4);outline:none}.wapu-drawer__link:active{background-color:var(--ds-fill-3)}.wapu-drawer__link--highlight{background-color:var(--ds-ink);color:var(--ds-surface);font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-semibold);letter-spacing:.08em;text-transform:uppercase;border-radius:var(--ds-r-pill);margin-bottom:var(--ds-s-2);padding:14px var(--ds-s-2);min-height:48px}.wapu-drawer__link--highlight:hover,.wapu-drawer__link--highlight:focus-visible{background-color:var(--ds-ink-2);color:var(--ds-surface)}.wapu-drawer__link--highlight .wapu-drawer__chevron{color:currentColor;opacity:.9}.wapu-drawer__link--with-thumb{gap:var(--ds-s-2);padding:var(--ds-s-1);min-height:72px}.wapu-drawer__thumb{width:56px;height:56px;border-radius:var(--ds-r-md);flex-shrink:0;background-color:var(--ds-surface-2);background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;align-items:center;justify-content:center;overflow:hidden}.wapu-drawer__thumb--image{background-color:var(--ds-surface-2)}.wapu-drawer__thumb--grad-v1{background:linear-gradient(135deg,#f5d7d7,#e8a5a5)}.wapu-drawer__thumb--grad-v2{background:linear-gradient(135deg,#f5e9d7,#e6c08a)}.wapu-drawer__thumb--grad-v3{background:linear-gradient(135deg,#d4c4e8,#8a7ba3)}.wapu-drawer__thumb--grad-v4{background:linear-gradient(135deg,#e3f0e8,#8ab896)}.wapu-drawer__thumb--grad-v5{background:linear-gradient(135deg,#ffcecb,#c73c3c)}.wapu-drawer__thumb--grad-v6{background:linear-gradient(135deg,#efe3d0,#b4936b)}.wapu-drawer__thumb--sale{background:var(--ds-danger-soft);color:var(--ds-danger)}.wapu-drawer__thumb--new{background:#f5f1e8;color:var(--ds-ink)}.wapu-drawer__thumb--wishlist{background:var(--ds-accent-wine, #4d0f1f);color:var(--ds-surface)}.wapu-drawer__thumb--brands{background:linear-gradient(135deg,#ffffff 0%,var(--ds-surface-2) 100%);color:var(--ds-ink-2);box-shadow:inset 0 0 0 .5px var(--ds-separator-soft)}.wapu-drawer__thumb-sign{font-family:var(--ds-font-display);font-weight:var(--ds-fw-semibold);font-size:var(--ds-fs-subhead);letter-spacing:-.02em;line-height:1}.wapu-drawer__thumb--sale .wapu-drawer__thumb-sign{font-size:18px}.wapu-drawer__thumb--new .wapu-drawer__thumb-sign{font-size:10px;font-weight:var(--ds-fw-semibold);letter-spacing:.1em;text-transform:uppercase}.wapu-drawer__thumb--brands .wapu-drawer__thumb-sign{font-style:italic;font-weight:300;font-size:20px}.wapu-drawer__content{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;justify-content:center}.wapu-drawer__name{font-family:var(--ds-font-text);font-size:var(--ds-fs-subhead);font-weight:var(--ds-fw-medium);line-height:var(--ds-lh-snug);letter-spacing:-.005em;color:var(--ds-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wapu-drawer__count{font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-regular);color:var(--ds-ink-3);letter-spacing:.02em;line-height:1.3}.wapu-drawer__discount-badge{display:inline-flex;align-items:center;align-self:flex-start;margin-top:4px;padding:3px 8px;font-family:var(--ds-font-display);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-semibold);letter-spacing:-.01em;line-height:1.2;background:var(--ds-ink);color:var(--ds-surface);border-radius:var(--ds-r-pill);white-space:nowrap}.wapu-drawer__discount-badge--inline{margin-top:0;margin-left:var(--ds-s-1);font-size:10px;padding:2px 6px;background:var(--ds-danger);color:var(--ds-danger-ink);letter-spacing:.02em}.wapu-drawer__subcat-name{display:inline-flex;align-items:center;gap:0;flex:1;min-width:0}.wapu-drawer__chevron{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-s-2);height:var(--ds-s-2);color:var(--ds-ink-4)}.wapu-drawer__link:hover .wapu-drawer__chevron{color:var(--ds-ink-3)}.wapu-drawer__search{position:relative;margin-bottom:var(--ds-s-1);flex-shrink:0}.wapu-drawer__search-icon{position:absolute;left:var(--ds-s-2);top:50%;transform:translateY(-50%);width:var(--ds-s-2);height:var(--ds-s-2);color:var(--ds-ink-3);pointer-events:none;z-index:1}.wapu-drawer__search-input.wapu-input{padding-left:var(--ds-s-5)}.wapu-drawer__brands-list{display:flex;flex-direction:column;gap:2px}.wapu-drawer__letter-sep{position:sticky;top:0;z-index:1;font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-semibold);line-height:1;letter-spacing:var(--ds-ls-wide);text-transform:uppercase;color:var(--ds-ink-3);margin:var(--ds-s-2) 0 var(--ds-s-1);padding:var(--ds-s-1) var(--ds-s-2);background:var(--ds-surface)}.wapu-drawer__letter-sep:first-child{margin-top:0}.wapu-drawer__no-results{font-family:var(--ds-font-text);font-size:var(--ds-fs-subhead);color:var(--ds-ink-3);text-align:center;padding:var(--ds-s-4) var(--ds-s-2);margin:0}.wapu-drawer__back{width:var(--ds-s-4);height:var(--ds-s-4);display:flex;align-items:center;justify-content:center;border:0;background:transparent;cursor:pointer;color:var(--ds-ink-2);border-radius:var(--ds-r-xs);flex-shrink:0;transition:background-color var(--ds-dur-fast) var(--ds-ease)}.wapu-drawer__back:hover{background-color:var(--ds-fill-4);color:var(--ds-ink)}.wapu-drawer__back[hidden]{display:none}@media (max-width: 991px){.site-header{position:sticky;top:0;border-bottom:var(--ds-border-hairline) solid var(--ds-separator-soft);background:var(--ds-surface)}.admin-bar .site-header{top:46px}.nav-container,.nav-categories{display:none}.nav-mobile-header{display:grid;grid-template-columns:1fr 40px;align-items:center;gap:var(--ds-s-1);padding:var(--ds-s-1) var(--ds-s-2)}.nav-mobile-header .site-branding{text-align:left}.nav-mobile-header .nav-action-link--search{display:inline-flex;align-items:center;justify-content:center;width:var(--ds-s-5);height:var(--ds-s-5);border-radius:var(--ds-r-pill);color:var(--ds-ink);text-decoration:none}.nav-mobile-header .nav-action-link--search svg{width:22px;height:22px}.nav-mobile-header .site-branding .custom-logo-link img{max-height:32px}.nav-mobile-header .site-branding .site-name{font-size:var(--ds-fs-headline)}.nav-mobile-header .nav-action-link{width:var(--ds-s-5);height:var(--ds-s-5)}.wapu-mobile-bottom-nav{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:4px;padding:7px var(--ds-s-1) calc(7px + env(safe-area-inset-bottom,0px));border-radius:var(--ds-r-lg) var(--ds-r-lg) 0 0;border:0;border-top:var(--ds-border-thin) solid var(--ds-separator-soft);background:#fffffffa;backdrop-filter:var(--ds-blur-sm);-webkit-backdrop-filter:var(--ds-blur-sm);box-shadow:0 -8px 24px #1118271f;z-index:var(--ds-z-dropdown)}body.wapu-has-mobile-bottom-nav:not(.woocommerce-checkout){padding-bottom:calc(var(--wapu-mobile-appbar-height) + var(--ds-s-1))}.wapu-mobile-bottom-nav__item{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px 2px;border-radius:var(--ds-r-md);text-decoration:none;color:var(--ds-ink-3);background:transparent;border:0;outline:none;font:inherit;cursor:pointer;transition:background-color var(--ds-dur) var(--ds-ease),color var(--ds-dur) var(--ds-ease)}.wapu-mobile-bottom-nav__item svg{width:20px;height:20px;display:block}.wapu-mobile-bottom-nav__item span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-bold);line-height:1.1}.wapu-mobile-bottom-nav__item.is-active,.wapu-mobile-bottom-nav__item.is-open{background:var(--ds-action-soft);color:var(--ds-action)}.wapu-mobile-bottom-nav__badge{position:absolute;top:2px;right:10px;min-width:16px;height:16px;padding:0 4px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--ds-r-pill);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-bold);line-height:1;background:var(--ds-action);color:var(--ds-action-ink)}body.is-mobile-catalog-open{overflow:hidden}.wapu-mobile-catalog-drawer__panel{left:0;right:auto;width:min(86vw,360px);box-shadow:var(--ds-shadow-lg);transform:translate(-102%)}.wapu-mobile-catalog-drawer.is-open .wapu-mobile-catalog-drawer__panel{transform:translate(0)}.wapu-mobile-catalog-drawer__head{padding:calc(var(--ds-s-2) + env(safe-area-inset-top,0px)) var(--ds-s-2) var(--ds-s-2)}.wapu-mobile-catalog-drawer__close{width:34px;min-height:34px;box-shadow:inset 0 0 0 var(--ds-border-thin) var(--ds-separator-soft);border-radius:var(--ds-r-sm);background-color:var(--ds-surface);color:var(--ds-ink)}}.site-header{transition:transform .32s cubic-bezier(.4,0,.2,1),background .32s ease,backdrop-filter .32s ease,border-color .32s ease;will-change:transform}.site-header.is-scrolled{background:#ffffffeb;backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6);border-bottom-color:var(--ds-separator-soft)}.site-header.is-scrolled .nav-container{padding-top:var(--ds-s-1);padding-bottom:var(--ds-s-1)}.site-header.is-scrolled .nav-logo img{max-height:32px}.site-header.is-scrolled .nav-logo-text{font-size:var(--ds-fs-title-2)}.site-header.is-scrolled .nav-categories{max-height:0;opacity:0;overflow:hidden;pointer-events:none;padding-top:0;padding-bottom:0;transition:all .25s ease}.site-header .nav-categories{transition:max-height .25s ease,opacity .25s ease,padding .25s ease;max-height:120px}.site-header.is-hidden{transform:translateY(-100%)}@media (prefers-reduced-motion: reduce){.site-header{transition:background .2s ease,border-color .2s ease}.site-header.is-hidden{transform:none;opacity:.85}}body.is-home .site-header:not(.is-scrolled){background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}body.is-home .site-header:not(.is-scrolled) .nav-categories{background:transparent;border-bottom:.5px solid rgba(255,255,255,.18)}body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-categories{border-bottom-color:#00000014}body.is-home[data-header-over=light] .site-header:not(.is-scrolled) .nav-logo img{filter:brightness(0) invert(1)}body.is-home[data-header-over=light] .site-header:not(.is-scrolled) .nav-logo-text{color:var(--ds-surface)}body.is-home[data-header-over=light] .site-header:not(.is-scrolled) .nav-search-trigger,body.is-home[data-header-over=light] .site-header:not(.is-scrolled) .nav-search-form__icon{color:var(--ds-surface)}body.is-home[data-header-over=light] .site-header:not(.is-scrolled) .nav-action-link{color:var(--ds-surface)}body.is-home[data-header-over=light] .site-header:not(.is-scrolled) .nav-action-link:hover{background:#ffffff1f}body.is-home[data-header-over=light] .site-header:not(.is-scrolled) .nav-action-link .cart-count{background:var(--ds-surface);color:var(--ds-ink)}body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-categories .nav-link,body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-categories .nav-menu a{color:var(--ds-ink)}body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-categories .nav-link:hover,body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-categories .nav-menu a:hover{color:var(--ds-ink)}body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-search-trigger,body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-search-form__icon,body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-action-link,body.is-home[data-header-over=dark] .site-header:not(.is-scrolled) .nav-logo-text{color:var(--ds-ink)}body.is-home [data-header-overlay=true]{margin-top:calc(-1 * var(--ds-header-full-h, 100px));position:relative;z-index:1}.wapu-search-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1100;opacity:0;pointer-events:none;transition:opacity var(--ds-dur) var(--ds-ease)}.wapu-search-modal[aria-hidden=false]{opacity:1;pointer-events:auto}.wapu-search-modal__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:transparent;border:0;cursor:default;pointer-events:none}.wapu-search-modal__panel{position:absolute;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;max-width:100vw;max-height:100vh;background:var(--ds-surface);border-radius:0;padding:0;box-shadow:none;display:flex;flex-direction:column;transform:translateY(-16px);transition:transform var(--ds-dur) var(--ds-ease);overflow:hidden}.wapu-search-modal[aria-hidden=false] .wapu-search-modal__panel{transform:translateY(0)}.wapu-search-modal__close{position:absolute;top:24px;right:32px;z-index:2;box-shadow:inset 0 0 0 .5px var(--ds-separator-soft);background-color:var(--ds-surface);color:var(--ds-ink)}.wapu-search-modal__close:hover,.wapu-search-modal__close:focus-visible{background-color:var(--ds-surface-2);box-shadow:inset 0 0 0 .5px var(--ds-separator);outline:none;transform:scale(1.04)}.wapu-search-modal__body{flex:1;width:min(1200px,calc(100vw - 80px));margin:0 auto;padding:88px 0 48px;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;min-height:0}body.wapu-search-modal-open{overflow:hidden}@media (max-width: 768px){.wapu-search-modal__body{width:calc(100vw - 32px);padding:72px 0 32px}.wapu-search-modal__close{top:16px;right:16px;width:40px;min-height:40px}}.wapu-cart-icon{position:relative;display:inline-flex}.wapu-cart-icon__btn{display:flex;align-items:center;justify-content:center;background:transparent;border:none;padding:8px;cursor:pointer;color:var(--ds-ink);border-radius:var(--ds-r-xs);transition:background .15s ease;line-height:1;text-decoration:none}.wapu-cart-icon__btn:hover{background:var(--ds-fill-4)}.wapu-cart-icon__badge{position:absolute;top:-2px;right:-4px;min-width:18px;height:18px;background:var(--ds-ink);color:var(--ds-surface);border-radius:var(--ds-r-pill);font-size:10px;font-weight:var(--ds-fw-bold);display:flex;align-items:center;justify-content:center;border:2px solid var(--ds-surface);padding:0 3px;pointer-events:none}.wapu-cart-icon__badge[data-count="0"]{display:none}


/* ══ [v4.0.3] Wapu Nav Row — fila 2 del header desktop ══════════════════════
 * Pinta los items configurados en Playground → 🧭 Navegación.
 * Auto-fallback al top-5 cats si no hay config custom.
 * ════════════════════════════════════════════════════════════════════════ */
.wapu-nav-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32px;
    padding: 12px 24px;
    border-top: .5px solid rgba(0, 0, 0, .06);
    background: var(--ws-surface, var(--wp-surface, #fff));
    flex-wrap: wrap;
}
.wapu-nav-row__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-weight: 500;
    color: var(--ws-text, var(--wp-text, #1f1a1a));
    text-decoration: none;
    border-bottom: 1.5px solid transparent;
    transition: color .15s, border-color .15s;
}
.wapu-nav-row__item:hover,
.wapu-nav-row__item:focus {
    color: var(--ws-primary, var(--wp-primary, #9B1D4D));
    border-bottom-color: currentColor;
}
.wapu-nav-row__icon {
    font-size: 14px;
    line-height: 1;
}
.wapu-nav-row__label {
    line-height: 1;
}

/* En mobile — la barra se oculta, el drawer es la nav alterna */
@media (max-width: 991px) {
    .wapu-nav-row { display: none; }
}


/* [v4.0.4] Active state — item del nav que matchea la URL actual */
.wapu-nav-row__item.is-active {
    color: var(--wapu-nav-item-accent, var(--ws-primary, var(--wp-primary, #9B1D4D)));
    border-bottom-color: currentColor;
    font-weight: 500;
}
.wapu-nav-row__item.is-active .wapu-nav-row__icon {
    transform: scale(1.1);
    transition: transform .2s;
}


/* ══ [v4.0.5] Wapu Nav Row — Animaciones + hover styles ══════════════════
 * Aplicadas via clases puestas por nav.php según meta del Playground.
 * ════════════════════════════════════════════════════════════════════════ */

/* === Entrance animations === */
@media (prefers-reduced-motion: no-preference) {
    .wapu-nav-row--anim-fade .wapu-nav-row__item,
    .wapu-nav-row--anim-slide-up .wapu-nav-row__item,
    .wapu-nav-row--anim-stagger .wapu-nav-row__item {
        opacity: 0;
        animation-fill-mode: forwards;
        animation-duration: var(--wapu-nav-anim-duration, 400ms);
        animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
    }

    .wapu-nav-row--anim-fade .wapu-nav-row__item {
        animation-name: wapuNavFadeIn;
        animation-delay: 50ms;
    }
    .wapu-nav-row--anim-slide-up .wapu-nav-row__item {
        animation-name: wapuNavSlideUp;
        animation-delay: 50ms;
    }
    .wapu-nav-row--anim-stagger .wapu-nav-row__item {
        animation-name: wapuNavSlideUp;
        animation-delay: calc(var(--wapu-nav-anim-delay, 60ms) * var(--wapu-nav-stagger-i, 0));
    }
}

@keyframes wapuNavFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@keyframes wapuNavSlideUp {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* === Hover styles === */

/* Underline (default — viene en .wapu-nav-row__item:hover ya) */

/* Pill */
.wapu-nav-row--hover-pill .wapu-nav-row__item {
    border-bottom-color: transparent !important;
    padding: 4px 12px;
    border-radius: 999px;
    transition: background .2s, color .2s;
}
.wapu-nav-row--hover-pill .wapu-nav-row__item:hover,
.wapu-nav-row--hover-pill .wapu-nav-row__item.is-active {
    background: rgba(155, 29, 77, .08);
    background: color-mix(in srgb, var(--wapu-nav-item-accent, var(--ws-primary, #9B1D4D)) 12%, transparent);
    color: var(--wapu-nav-item-accent, var(--ws-primary, #9B1D4D));
}

/* Glow */
.wapu-nav-row--hover-glow .wapu-nav-row__item {
    transition: color .2s, text-shadow .25s;
}
.wapu-nav-row--hover-glow .wapu-nav-row__item:hover {
    color: var(--wapu-nav-item-accent, var(--ws-primary, #9B1D4D));
    text-shadow: 0 0 12px rgba(155, 29, 77, .35);
}

/* Scale */
.wapu-nav-row--hover-scale .wapu-nav-row__item {
    transition: color .2s, transform .25s, border-bottom-color .2s;
    transform-origin: center;
}
.wapu-nav-row--hover-scale .wapu-nav-row__item:hover {
    transform: scale(1.08);
    color: var(--wapu-nav-item-accent, var(--ws-primary, #9B1D4D));
}

/* === Sticky / hide-on-scroll === */
.wapu-nav-row.is-sticky {
    position: sticky;
    top: 0;
    z-index: 50;
    backdrop-filter: blur(8px);
    background: color-mix(in srgb, var(--ws-surface, #fff) 85%, transparent);
}

/* Hide on scroll — JS adds .is-scrolling-down */
.wapu-nav-row.is-hide-on-scroll {
    transition: transform .25s ease, opacity .25s ease;
}
.wapu-nav-row.is-hide-on-scroll.is-scrolling-down {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

/* JS-driven scroll behavior — see footer.php for the listener (lazy added in v4.0.5+) */


/* ══ [v4.0.6] Per-item badges en el nav row + mega chevron ══════════════
 * Se renderean en los items del nav cuando el editor del Playground los
 * configura. Tones mapean a tokens del theme (--ws-*).
 * ══════════════════════════════════════════════════════════════════════ */
.wapu-nav-row__badge {
    display: inline-flex;
    align-items: center;
    font-size: 9px;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 3px;
    margin-left: 4px;
    text-transform: uppercase;
    letter-spacing: .04em;
    line-height: 1.5;
    vertical-align: middle;
}
.wapu-nav-row__badge--info    { background: rgba(14, 165, 233, .12);  color: #075985; }
.wapu-nav-row__badge--danger  { background: rgba(225, 29, 72, .12);   color: #9f1239; }
.wapu-nav-row__badge--warning { background: rgba(245, 158, 11, .14);  color: #92400e; }
.wapu-nav-row__badge--accent  { background: rgba(155, 29, 77, .12);   color: #9B1D4D; color: var(--ws-primary, #9B1D4D); background: color-mix(in srgb, var(--ws-primary, #9B1D4D) 12%, transparent); }
.wapu-nav-row__badge--muted   { background: rgba(0, 0, 0, .06);       color: rgba(0, 0, 0, .55); }

.wapu-nav-row__chevron {
    margin-left: 3px;
    font-size: 10px;
    opacity: .55;
    transition: transform .15s, opacity .15s;
}
.wapu-nav-row__item:hover .wapu-nav-row__chevron,
.wapu-nav-row__item.has-mega:hover .wapu-nav-row__chevron {
    opacity: 1;
    transform: translateY(1px);
}


/* ══ [v4.0.7] Tonos del nav row — light/cream/dark/cranberry/glass ══════
 * Configurable desde Playground → 🧭 Navegación → Animaciones → Tono.
 * ════════════════════════════════════════════════════════════════════════ */

/* Light (default) — fondo blanco, texto oscuro. Ya estaba implícito. */
.wapu-nav-row--tone-light {
    background: var(--ws-surface, #fff);
    color: var(--ws-text, #1f1a1a);
}

/* Cream — fondo crema del drop, texto oscuro */
.wapu-nav-row--tone-cream {
    background: var(--ws-surface, #FDF9EE);
    background: var(--ws-surface-alt, var(--ws-surface, #FDF9EE));
    color: var(--ws-text, #1f1a1a);
    border-top: .5px solid var(--ws-border, rgba(0, 0, 0, .06));
}

/* Dark — fondo casi negro, texto claro */
.wapu-nav-row--tone-dark {
    background: #1f1a1a;
    color: rgba(255, 255, 255, .92);
    border-top: none;
}
.wapu-nav-row--tone-dark .wapu-nav-row__item {
    color: rgba(255, 255, 255, .85);
}
.wapu-nav-row--tone-dark .wapu-nav-row__item:hover,
.wapu-nav-row--tone-dark .wapu-nav-row__item.is-active {
    color: #fff;
}
.wapu-nav-row--tone-dark.wapu-nav-row--hover-pill .wapu-nav-row__item:hover,
.wapu-nav-row--tone-dark.wapu-nav-row--hover-pill .wapu-nav-row__item.is-active {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

/* Cranberry — fondo del primary del drop, texto inverso */
.wapu-nav-row--tone-cranberry {
    background: var(--ws-primary, #9B1D4D);
    color: #fff;
    border-top: none;
}
.wapu-nav-row--tone-cranberry .wapu-nav-row__item {
    color: rgba(255, 255, 255, .92);
}
.wapu-nav-row--tone-cranberry .wapu-nav-row__item:hover,
.wapu-nav-row--tone-cranberry .wapu-nav-row__item.is-active {
    color: #fff;
    border-bottom-color: #fff;
}
.wapu-nav-row--tone-cranberry.wapu-nav-row--hover-pill .wapu-nav-row__item:hover,
.wapu-nav-row--tone-cranberry.wapu-nav-row--hover-pill .wapu-nav-row__item.is-active {
    background: rgba(255, 255, 255, .15);
    color: #fff;
}
.wapu-nav-row--tone-cranberry .wapu-nav-row__badge--accent {
    background: rgba(255, 255, 255, .2);
    color: #fff;
}

/* Glass — transparente con blur, intensifica al scroll */
.wapu-nav-row--tone-glass {
    background: rgba(255, 255, 255, .55);
    backdrop-filter: blur(12px) saturate(1.4);
    -webkit-backdrop-filter: blur(12px) saturate(1.4);
    border-top: .5px solid rgba(0, 0, 0, .04);
    border-bottom: .5px solid rgba(0, 0, 0, .04);
}
.wapu-nav-row--tone-glass.is-sticky {
    background: rgba(255, 255, 255, .82);
}


/* ══ [v4.0.8] Mega-menu panel — slide-down al hover ════════════════════
 * Templates: grid (4 cols) / featured (3+1) / minimal (text 2 cols) / editorial (banner)
 * ══════════════════════════════════════════════════════════════════════ */

/* Cell wrapper — necesario para que el panel posicione absoluto */
.wapu-nav-row__cell {
    position: relative;
}

/* Panel oculto por default */
.wapu-megamenu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-8px);
    z-index: 1000;
    background: var(--ws-surface, #fff);
    border: 0.5px solid rgba(0, 0, 0, .08);
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .10);
    padding: 20px;
    min-width: 540px;
    max-width: 880px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, transform .22s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear .2s;
}

/* Hover sobre el cell o el panel mismo abre */
.wapu-nav-row__cell.has-mega-panel:hover .wapu-megamenu,
.wapu-nav-row__cell.has-mega-panel:focus-within .wapu-megamenu,
.wapu-megamenu:hover {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
    transition-delay: 0s;
}

/* Inner grid */
.wapu-megamenu__inner {
    display: grid;
    gap: 14px;
}

/* Templates */
.wapu-megamenu--grid .wapu-megamenu__inner {
    grid-template-columns: repeat(4, 1fr);
}
.wapu-megamenu--featured .wapu-megamenu__inner {
    grid-template-columns: repeat(3, 1fr);
}
.wapu-megamenu--minimal {
    padding: 16px;
    min-width: 320px;
}
.wapu-megamenu--minimal .wapu-megamenu__inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 4px;
}
.wapu-megamenu--editorial {
    min-width: 420px;
}
.wapu-megamenu--editorial .wapu-megamenu__inner {
    grid-template-columns: 1fr;
    gap: 4px;
}

/* Items */
.wapu-megamenu__item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 8px;
    border-radius: 10px;
    text-decoration: none;
    color: var(--ws-text, #1f1a1a);
    transition: background .15s, transform .15s;
}
.wapu-megamenu__item:hover {
    background: var(--ws-surface-alt, rgba(0, 0, 0, .03));
    transform: translateY(-1px);
}
.wapu-megamenu__thumb {
    aspect-ratio: 1;
    background-size: cover;
    background-position: center;
    background-color: var(--ws-surface-alt, #f3f4f6);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: rgba(0, 0, 0, .25);
}
.wapu-megamenu__thumb--ph {
    /* placeholder con emoji */
}
.wapu-megamenu__label {
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--ws-text, #1f1a1a);
    line-height: 1.3;
}
.wapu-megamenu__count {
    font-size: 10px;
    color: var(--ws-text-muted, #6b7280);
}

/* Minimal: text-only, no thumb */
.wapu-megamenu--minimal .wapu-megamenu__item {
    flex-direction: row;
    align-items: center;
    padding: 8px 10px;
}
.wapu-megamenu--minimal .wapu-megamenu__thumb {
    display: none;
}
.wapu-megamenu--minimal .wapu-megamenu__label {
    flex: 1;
    text-transform: none;
    letter-spacing: 0;
    font-size: 13px;
    font-weight: 400;
}
.wapu-megamenu--minimal .wapu-megamenu__count {
    font-size: 11px;
    color: var(--ws-text-muted, #6b7280);
    opacity: .7;
}

/* Editorial: banner-like, big horizontal */
.wapu-megamenu--editorial .wapu-megamenu__item {
    flex-direction: row;
    align-items: center;
    gap: 14px;
    padding: 10px;
}
.wapu-megamenu--editorial .wapu-megamenu__thumb {
    width: 80px;
    aspect-ratio: 1;
    flex-shrink: 0;
}
.wapu-megamenu--editorial .wapu-megamenu__label {
    font-size: 14px;
    font-weight: 500;
}

/* Hide on mobile — drawer maneja la nav en móvil */
@media (max-width: 991px) {
    .wapu-megamenu { display: none !important; }
}