.product-sticky-shell{--product-sticky-height:68px;position:relative;z-index:880;width:100%;height:var(--product-sticky-height);min-height:var(--product-sticky-height);max-height:var(--product-sticky-height);background:var(--surface-solid)}.product-sticky-nav{--product-sticky-fixed-bg:color-mix(in oklab, var(--surface-solid) 96%, transparent);--product-sticky-fixed-text:var(--text-muted);--product-sticky-fixed-text-active:var(--text);width:100%;height:var(--product-sticky-height);min-height:0;max-height:var(--product-sticky-height);overflow:hidden;border-bottom:1px solid var(--border);background:color-mix(in oklab,var(--surface-solid) 96%,transparent);box-shadow:0 12px 30px #fff0;transition:top .32s ease,background .24s ease,border-color .24s ease,box-shadow .24s ease,backdrop-filter .24s ease}.product-sticky-nav::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;background:var(--surface-solid);transition:opacity .24s ease}.product-sticky-shell.is-fixed .product-sticky-nav{position:fixed;top:var(--product-sticky-top,0);left:0;right:0;width:auto;z-index:880;background:var(--product-sticky-fixed-bg);border-bottom-color:var(--border);box-shadow:0 14px 32px color-mix(in oklab,var(--text) 12%,transparent),inset 0 1px 0 color-mix(in oklab,var(--surface-solid) 68%,transparent);-webkit-backdrop-filter:blur(16px) saturate(1.08);backdrop-filter:blur(16px) saturate(1.08)}.product-sticky-shell.is-fixed .product-sticky-nav::before{opacity:.62}.product-sticky-nav__inner{position:relative;z-index:1;height:100%;min-height:0;display:flex;align-items:stretch}.product-sticky-nav__scroller{position:relative;display:flex;align-items:stretch;gap:clamp(24px, 3vw, 46px);width:100%;min-width:0;height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-inline:contain;transition:padding-right .28s cubic-bezier(.22,1,.36,1)}.product-sticky-nav__scroller::-webkit-scrollbar{display:none}.product-sticky-shell.is-fixed.is-header-hidden .product-sticky-nav__scroller{padding-right:210px}.product-sticky-nav__link{position:relative;z-index:1;display:inline-flex;align-items:center;flex:0 0 auto;height:100%;min-height:0;color:var(--text-muted);font-family:var(--font-title);font-size:14px;line-height:1;white-space:nowrap;transition:color .22s ease,transform .22s ease}.product-sticky-nav__link:hover,.product-sticky-nav__link:focus-visible,.product-sticky-nav__link.is-active{color:var(--text)}.product-sticky-shell.is-fixed .product-sticky-nav__link{color:var(--product-sticky-fixed-text)}.product-sticky-shell.is-fixed .product-sticky-nav__link:hover,.product-sticky-shell.is-fixed .product-sticky-nav__link:focus-visible,.product-sticky-shell.is-fixed .product-sticky-nav__link.is-active{color:var(--product-sticky-fixed-text-active)}.product-sticky-nav__link:hover{transform:translateY(-1px)}.product-sticky-nav__link:focus-visible{outline:2px solid color-mix(in oklab,var(--brand) 72%,white);outline-offset:-5px;border-radius:6px}.product-sticky-nav__indicator{position:absolute;z-index:2;bottom:0;left:0;width:var(--product-sticky-indicator-width,0);height:3px;border-radius:3px 3px 0 0;background:var(--brand);pointer-events:none;opacity:var(--product-sticky-indicator-opacity,0);transform:translate3d(var(--product-sticky-indicator-x,0),0,0);transform-origin:left center;transition:width .34s cubic-bezier(.22,1,.36,1),transform .34s cubic-bezier(.22,1,.36,1),opacity .18s ease;will-change:width,transform}.product-sticky-nav__cta{position:absolute;z-index:4;top:50%;right:0;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:42px;padding:0 18px;border:1px solid color-mix(in oklab,var(--brand) 84%,#ffffff);border-radius:var(--button-radius,9px);background:var(--brand);color:#fff;font-family:var(--font-title);font-size:13px;white-space:nowrap;box-shadow:0 12px 24px rgb(226 27 45 / .2),inset 0 1px 0 rgb(255 255 255 / .16);opacity:0;visibility:hidden;pointer-events:none;transform:translate3d(14px,-50%,0);transition:opacity .24s ease,visibility .24s ease,transform .32s cubic-bezier(.22,1,.36,1),background .2s ease,box-shadow .2s ease}.product-sticky-shell.is-fixed.is-header-hidden .product-sticky-nav__cta{opacity:1;visibility:visible;pointer-events:auto;transform:translate3d(0,-50%,0);box-shadow:0 14px 30px rgb(226 27 45 / .28),inset 0 1px 0 rgb(255 255 255 / .18)}.product-sticky-nav__cta:hover,.product-sticky-nav__cta:focus-visible{background:color-mix(in oklab,var(--brand) 88%,#000000);box-shadow:0 15px 30px rgb(226 27 45 / .26)}.product-sticky-nav__cta:focus-visible{outline:2px solid color-mix(in oklab,var(--brand) 68%,white);outline-offset:3px}.product-sticky-nav__cta span:last-child{transition:transform .22s ease}.product-sticky-nav__cta:hover span:last-child{transform:translateX(3px)}[id][data-sticky-section]{scroll-margin-top:calc(var(--header-height) + var(--product-sticky-height, 68px) + 22px)}@media (max-width:760px){.product-sticky-shell{--product-sticky-height:60px}.product-sticky-nav__inner{width:100%;padding-inline:20px}.product-sticky-nav__scroller,.product-sticky-shell.is-fixed .product-sticky-nav__scroller,.product-sticky-shell.is-fixed.is-header-hidden .product-sticky-nav__scroller{gap:28px;padding-right:0}.product-sticky-nav__link{font-size:13px}.product-sticky-nav__cta{display:none}}@media (prefers-reduced-motion:reduce){.product-sticky-nav,.product-sticky-nav__scroller,.product-sticky-nav__link,.product-sticky-nav__indicator,.product-sticky-nav__cta,.product-sticky-nav__cta span:last-child{transition:none}}
/* 2026-08-04: integrate the static sticky navigation into the rounded content sheet. */
.hero-cover-canvas--nav {
  padding-top: 0;
}

.hero-cover-canvas--nav > .product-sticky-shell {
  --product-sticky-static-radius-x: var(--hero-cover-radius, 30px);
  --product-sticky-static-radius-y: var(--hero-cover-overlap, 14px);
  border-radius:
    var(--product-sticky-static-radius-x) var(--product-sticky-static-radius-x) 0 0 /
    var(--product-sticky-static-radius-y) var(--product-sticky-static-radius-y) 0 0;
  background: transparent;
}

.hero-cover-canvas--nav > .product-sticky-shell:not(.is-fixed) .product-sticky-nav {
  border-radius:
    var(--product-sticky-static-radius-x) var(--product-sticky-static-radius-x) 0 0 /
    var(--product-sticky-static-radius-y) var(--product-sticky-static-radius-y) 0 0;
}

.hero-cover-canvas--nav > .product-sticky-shell.is-fixed .product-sticky-nav {
  border-radius: 0;
}

@media (max-width: 720px) {
  .hero-cover-canvas--nav > .product-sticky-shell {
    --product-sticky-static-radius-x: var(--hero-cover-radius, 24px);
    --product-sticky-static-radius-y: var(--hero-cover-overlap, 12px);
  }
}
