/* VARMA CARDS: Apple-style navigation. Desktop-only, mobile Aroma remains native. */
@media(min-width:990px){
 .header__inline-menu>ul.list-menu--inline>li>details-disclosure>details>.header__submenu{display:none!important}
 .header__inline-menu>ul.list-menu--inline>li>details-disclosure>details>summary,.header__inline-menu>ul.list-menu--inline>li>a{cursor:pointer!important}
 .varma-nav-panel{position:fixed;left:0;right:0;top:var(--varma-menu-top,48px);z-index:10030;background:#fafafc;color:#1d1d1f;box-sizing:border-box;max-height:calc(100dvh - var(--varma-menu-top,48px));overflow:auto;visibility:hidden;opacity:0;transform:translateY(-9px);pointer-events:none;transition:opacity .22s ease,transform .22s ease,visibility .22s ease;box-shadow:0 14px 28px rgba(0,0,0,.07)}
 .varma-nav-panel.is-open{visibility:visible;opacity:1;transform:translateY(0);pointer-events:auto}
 .varma-nav-inner{width:min(100% - 64px,1040px);margin:auto;padding:34px 0 66px;display:grid;grid-template-columns:minmax(230px,1.35fr) minmax(170px,.8fr) minmax(150px,.7fr);gap:52px;align-items:start}
 .varma-nav-caption{font:400 12px/1.4 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#6e6e73;margin:0 0 17px}
 .varma-nav-primary{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
 .varma-nav-primary a{font:600 clamp(22px,2.25vw,27px)/1.28 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;letter-spacing:-.035em;color:#1d1d1f;text-decoration:none!important;max-width:100%;transition:color .13s ease;cursor:pointer}
 .varma-nav-primary a:hover,.varma-nav-primary a:focus-visible,.varma-nav-primary a.is-active{color:#0066cc!important}
 .varma-nav-secondary,.varma-nav-tertiary{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
 .varma-nav-secondary a,.varma-nav-tertiary a{font:600 12px/1.4 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#1d1d1f;text-decoration:none!important;cursor:pointer;transition:color .13s ease}
 .varma-nav-secondary a:hover,.varma-nav-tertiary a:hover,.varma-nav-secondary a:focus-visible,.varma-nav-tertiary a:focus-visible{color:#0066cc!important;text-decoration:underline!important}
 .varma-nav-panel a:focus-visible{outline:2px solid #0066cc;outline-offset:4px;border-radius:2px}
 .varma-nav-overlay{position:fixed;inset:0;z-index:10015;background:rgba(0,0,0,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .23s ease,visibility .23s ease}
 .varma-nav-overlay.is-open{opacity:1;visibility:visible;pointer-events:auto}
 body.varma-nav-active .varma-apple-scrim{display:none!important}
 .header-wrapper,sticky-header,.header__inline-menu{z-index:10025!important}
}
@media(max-width:989px){.varma-nav-panel,.varma-nav-overlay{display:none!important}}
@media(prefers-reduced-motion:reduce){.varma-nav-panel,.varma-nav-overlay{transition:none!important}}

/* v10: keep shop subcategories and quick links visible while the long left list scrolls.
   Sticky items are children of the same scrollable panel, so they stop at its boundary. */
@media (min-width:990px) {
  .varma-nav-panel { overflow-x:hidden!important; overflow-y:auto!important; overscroll-behavior:contain; }
  .varma-nav-inner { align-items:start!important; padding-top:38px!important; }
  .varma-nav-inner > div:nth-child(2),
  .varma-nav-inner > div:nth-child(3) {
    position:sticky!important; top:24px!important; align-self:start!important;
    max-height:calc(100dvh - var(--varma-menu-top,48px) - 48px);
    overflow-y:auto; overscroll-behavior:contain;
  }
  .varma-nav-inner > div:nth-child(2)::-webkit-scrollbar,
  .varma-nav-inner > div:nth-child(3)::-webkit-scrollbar {width:4px}
  .varma-nav-inner > div:nth-child(2)::-webkit-scrollbar-thumb,
  .varma-nav-inner > div:nth-child(3)::-webkit-scrollbar-thumb {background:#d2d2d7;border-radius:4px}
}