/* Approved product artwork; the existing navigation layout and text remain native. */
.mega-preview:has(.nav-product-art){background:#f4f7fc}
.mega-preview .preview-illustration.nav-product-art{width:100%;max-width:380px;aspect-ratio:1586/992;min-height:0;align-self:center;overflow:hidden;border-radius:10px}
.mega-preview .preview-illustration.nav-product-art::before{content:none}
.nav-product-art img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;transform:scale(var(--nav-art-scale,1));transform-origin:center;pointer-events:none}
.content-panel .editorial-preview.nav-content-preview{padding:0;background:#f4f7fc;justify-content:center;align-items:center;overflow:hidden}
.nav-content-preview img{display:block;width:100%;height:auto;max-width:343px;aspect-ratio:1/1;object-fit:contain}

/* Figma 24:2129 dropdowns, adapted to the approved 1280px site grid.
   Preview images are the existing approved artwork, without enlarging/cropping. */
body .nav-panel-illustrated{display:grid;grid-template-columns:300px minmax(0,1fr);gap:16px;padding:16px;background:#fff;border:1px solid #fff;border-radius:20px;box-shadow:0 16px 48px #25385814;max-height:calc(100dvh - 108px);overscroll-behavior:contain}
.nav-panel-illustrated .panel-list{gap:4px;min-width:0}
.nav-panel-illustrated .preview-link{padding:10px 16px;border-radius:10px;min-height:68px;color:#333;border:0;background:transparent;text-align:left;width:100%}
.nav-panel-illustrated .preview-link strong{font-size:var(--kl-text-menu,16px);font-weight:500;line-height:24px}
.nav-panel-illustrated .preview-link small{font-size:var(--kl-text-menu-description,13px);line-height:20px;margin-top:4px;color:#666}
.nav-panel-illustrated .preview-link:is(:hover,.is-active){background:#f4f8fe;color:#0a66f0}
.nav-panel-illustrated .panel-bottom{margin:12px 16px 0;padding:20px 0 8px;border-top:1px solid #eceef1;border-radius:0;background:transparent;font-size:14px;line-height:24px;min-height:60px;color:#333}
.nav-panel-illustrated .panel-bottom:hover{color:#0a66f0}
.panel-arrow{display:grid;place-items:center;flex:none;width:26px;height:26px;border:1px solid currentColor;border-radius:50%;font-size:20px;line-height:1}
.nav-artwork{display:flex;align-items:center;justify-content:center;align-self:stretch;min-width:0;border-radius:10px;background:#f4f7fc;overflow:hidden;padding:16px}
.nav-artwork img{display:block;width:100%;height:auto;object-fit:contain;max-width:100%}
.nav-artwork-content img{max-width:390px}
.nav-panel-illustrated[hidden],.nav-artwork[hidden]{display:none!important}
.primary-nav[data-navigation-version] :is(a,button):focus-visible{outline:2px solid #146fe8;outline-offset:3px}
@media(max-width:1279px){
 body .nav-panel-illustrated{display:block;border:0;border-radius:0;box-shadow:none;padding:0 0 16px;max-height:none;background:transparent}
 body .nav-panel-illustrated .nav-artwork{display:none}
 .nav-panel-illustrated .preview-link strong{font-size:15px}
 .nav-panel-illustrated .preview-link{min-height:68px;padding-inline:16px}
 .nav-panel-illustrated .panel-bottom{padding-block:16px;margin-top:8px;min-height:58px}
}
