.pageheader{position:sticky;top:0;z-index:100;background:var(--header-bg-col);color:var(--header-text-col);height:var(--header-height);border-bottom:0;transition:background .3s}
.pageheader__inner{height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-inline:var(--container-pad)}
.pageheader__left,.pageheader__right{display:flex;align-items:center;gap:22px}
.pageheader__right{justify-content:flex-end;grid-column:3}
.logo{display:block;color:var(--header-text-col);justify-self:center}
.nav ul{display:flex;gap:40px}
.nav a{font-size:var(--nav-text-size);font-weight:500;text-transform:uppercase;position:relative;padding-block:6px}
.nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.nav li:hover>a::after,.nav a:focus-visible::after{transform:scaleX(1)}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;color:inherit;position:relative}
.cart-count{position:absolute;top:-6px;right:-8px;min-width:16px;height:16px;border-radius:8px;background:#fff;color:#000;font-size:10px;font-weight:700;display:grid;place-items:center}
.has-hero .pageheader{position:fixed;inset:0 0 auto 0;background:linear-gradient(#000a,#0000)}
.has-hero .pageheader.is-scrolled,.pageheader.is-open{background:var(--header-bg-col)}
.mega{position:absolute;top:100%;left:0;right:0;background:#fff;color:rgb(var(--heading-color));border-bottom:1px solid var(--divider-col)}
.mega:not([hidden]){animation:megaIn .2s ease-out}
@keyframes megaIn{from{opacity:0;transform:translateY(-6px)}}
.mega__inner{display:flex;gap:60px;padding:40px var(--container-pad)}
.mega__panel{display:none;gap:60px}
.mega__panel.is-active{display:flex}
.mega__panel li{margin-bottom:12px}
.mega__panel a{font-size:var(--nav-text-size);text-transform:uppercase;letter-spacing:.06em}
.mega__panel a:hover{text-decoration:underline}
.mega__promo{margin-left:auto;font-size:12px;text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.mega__promo img{margin-bottom:8px;object-fit:cover;background:var(--product-bg)}
.mobile-nav{position:fixed;inset:0;z-index:200;background:#000;color:#fff;padding:90px var(--container-pad) 40px;transform:translateX(-100%);transition:transform .35s ease}
.mobile-nav.is-open{transform:none}
.mobile-nav__close{position:absolute;top:24px;right:var(--container-pad)}
.mobile-nav li{border-bottom:1px solid #fff3}
.mobile-nav a{display:block;padding:18px 0;font-size:24px;font-weight:700;text-transform:uppercase}
.search{position:fixed;inset:0;z-index:300;background:#000f;color:#fff;padding:100px var(--container-pad) 40px;overflow:auto}
.search__close{position:absolute;top:30px;right:var(--container-pad)}
.search input{width:100%;background:none;border:0;border-bottom:1px solid #fff6;padding:14px 0;font-size:clamp(24px,4vw,44px);font-weight:700;color:#fff;outline:0}
.search input:focus{border-color:#fff}
.search li a{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid #fff2}
.search li img{width:56px;height:56px;object-fit:contain;background:var(--product-bg)}
.search__empty{padding-top:24px;color:#fff9}
body.no-scroll{overflow:hidden}

/* Tablet: evita que la nav choque con el logo */
@media (min-width:768px) and (max-width:1023.98px){
  .pageheader__inner{padding-inline:28px}.nav ul{gap:22px}.nav a{font-size:13px}.pageheader__left,.pageheader__right{gap:16px}
  .mega__inner{padding-inline:28px}
}
@media (min-width:1600px){.pageheader__inner{max-width:var(--page-container-width);margin-inline:auto}}

/* Breakpoints */
@media (min-width:1024px) and (max-width:1279.98px){.nav ul{gap:30px}}
@media (max-width:479.98px){.pageheader__left,.pageheader__right{gap:14px}.logo svg{width:28px;height:auto}.mobile-nav a{font-size:22px}.search input{font-size:24px}}
