:root{--motion-ease:cubic-bezier(.16,1,.3,1)}

/* v40: A softly tinted glass body, a rounded optical rim and a sharper inner lip.
   Backdrop layers stay behind the logo and controls so the artwork stays crisp. */
.floating-header{
  --header-glass-blur:4.8px;
  --glass-edge-blur:8px;
  --glass-glint-alpha:.075;
  --glass-surface-tint:rgba(36,41,49,.10);
  --glass-surface-brightness:1;
  --glass-rim-opacity:.94;
  --header-ink:#17191b;
  --header-link-accent:#806100;
  background:transparent;
  border:0;
  padding:1px;
  outline:0;
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
.floating-header::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border:0;
  border-radius:inherit;
  background:linear-gradient(130deg,rgba(255,255,255,.18),rgba(255,255,255,.025) 46%,rgba(10,18,28,.055)),var(--glass-surface-tint);
  outline:0;
  box-shadow:0 9px 28px rgba(7,19,32,.10),0 2px 5px rgba(7,19,32,.055),inset 0 1px 1px rgba(255,255,255,.30),inset 0 -1px 2px rgba(5,16,29,.14);
  -webkit-backdrop-filter:blur(var(--header-glass-blur)) saturate(145%) brightness(var(--glass-surface-brightness));
  backdrop-filter:blur(var(--header-glass-blur)) saturate(145%) brightness(var(--glass-surface-brightness));
  transform-origin:center;
  transition:transform .42s var(--motion-ease),background-color .2s;
  pointer-events:none;
}
.floating-header::after{content:none;display:none;border:0;outline:0;box-shadow:none;background:none}
.floating-header.has-glass-capsule::after{
  content:"";
  display:block;
  position:absolute;
  inset:0;
  z-index:0;
  border:0;
  outline:0;
  border-radius:inherit;
  box-shadow:none;
  opacity:var(--glass-rim-opacity);
  background:radial-gradient(ellipse 330px 100px at var(--header-light-x,17%) var(--header-light-y,0%),rgba(255,255,255,.72),transparent 75%),linear-gradient(132deg,rgba(255,255,255,.72),rgba(255,255,255,.20) 24%,rgba(255,255,255,.035) 47%,rgba(255,255,255,.48) 76%,rgba(255,255,255,.18));
  -webkit-backdrop-filter:blur(var(--glass-edge-blur)) saturate(170%) brightness(1.10);
  backdrop-filter:blur(var(--glass-edge-blur)) saturate(170%) brightness(1.10);
  -webkit-mask-image:var(--glass-capsule-mask);
  mask-image:var(--glass-capsule-mask);
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  transform-origin:center;
  transition:transform .42s var(--motion-ease);
  pointer-events:none;
}
.floating-header.has-glass-lens::before{
  -webkit-backdrop-filter:url("#lube-cube-header-lens") saturate(145%) brightness(var(--glass-surface-brightness));
  backdrop-filter:url("#lube-cube-header-lens") saturate(145%) brightness(var(--glass-surface-brightness));
}
.floating-header.has-glass-lens::after{-webkit-backdrop-filter:none;backdrop-filter:none}
.floating-header .header-inner{position:relative;z-index:1;border-radius:inherit}
.floating-header .header-inner::before{
  content:"";
  position:absolute;
  inset:3px;
  z-index:-1;
  border:0;
  border-radius:inherit;
  background:radial-gradient(ellipse 300px 76px at var(--header-light-x,var(--glass-light-x,42%)) var(--header-light-y,var(--glass-light-y,28%)),rgba(255,255,255,var(--glass-glint-alpha)),transparent 76%);
  pointer-events:none;
}
.floating-header.is-scrolled::before{border:0;outline:0}
.floating-header.is-glass-pressed::before,.floating-header.is-glass-pressed::after{transform:scale(1.006,1.025)}
.floating-header.glass-over-dark{
  --header-ink:#fff;
  --header-link-accent:#fff;
  --glass-surface-tint:rgba(61,64,70,.24);
  --glass-surface-brightness:1.13;
  --glass-rim-opacity:.72;
}
/* The permanent vector logo inherits the header's light or dark ink. */
.floating-header .brand{position:relative;background:transparent;box-shadow:none}
.floating-header .site-nav>a:not(.button){
  position:relative;
  isolation:isolate;
  color:var(--header-ink);
  text-shadow:0 1px 2px rgba(255,255,255,.25);
  transition:color .2s,text-shadow .2s;
}
.floating-header.glass-over-dark .site-nav>a:not(.button){text-shadow:0 1px 3px rgba(0,20,40,.28)}
.floating-header .site-nav>a:not(.button)::before{
  content:"";
  position:absolute;
  inset:7px -7px;
  z-index:-1;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 2px 5px rgba(4,25,47,.05);
  opacity:0;
  pointer-events:none;
  transition:opacity .2s;
}
.floating-header .site-nav>a[aria-current=page]:not(.button){color:var(--header-link-accent);box-shadow:none}
.floating-header .site-nav>a[aria-current=page]:not(.button)::before,.floating-header .site-nav>a:not(.button):focus-visible::before{opacity:1}
.floating-header .nav-call{
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  color:var(--header-ink);
  background:rgba(255,255,255,.12);
  text-shadow:0 1px 2px rgba(255,255,255,.25);
  box-shadow:0 2px 7px rgba(4,25,47,.08),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 2px rgba(7,33,57,.06);
}
.floating-header.glass-over-dark .nav-call{text-shadow:0 1px 3px rgba(0,20,40,.30)}
.floating-header .menu-toggle{
  border:1px solid rgba(255,255,255,.26);
  background:rgba(255,255,255,.12);
  box-shadow:0 2px 7px rgba(4,25,47,.08),inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 2px rgba(7,33,57,.07);
  color:var(--header-ink);
}
.header-glass-filters{position:absolute;left:0;top:0;width:0;height:0;overflow:hidden;pointer-events:none}

/* Desktop header spacing and actions. */
.floating-header .site-nav>.desktop-header-coupons{display:none}
@media(min-width:1200px){
  .floating-header .header-inner{gap:clamp(24px,2.4vw,36px)}
  .floating-header .site-nav{flex:1 1 auto;min-width:0;justify-content:space-between;gap:clamp(10px,1.1vw,16px)}
  .floating-header .site-nav>a:not(.button){flex:0 0 auto;font-size:clamp(14px,1.12vw,16px);font-weight:600}
  .floating-header .site-nav>.nav-call{flex:0 0 auto;gap:10px;padding-inline:clamp(14px,1.2vw,18px);white-space:nowrap}
  .floating-header .site-nav>.desktop-header-coupons{display:inline-flex}
}

@media(max-width:1199px){
.floating-header .site-nav{
  top:calc(100% + 8px);
  border:1px solid rgba(255,255,255,.34);
  border-radius:28px;
  background:linear-gradient(135deg,rgba(255,255,255,.38),rgba(255,255,255,.15)),rgba(255,255,255,.94);
  box-shadow:0 20px 46px rgba(4,25,47,.18),0 3px 9px rgba(4,25,47,.08),inset 0 1px 1px rgba(255,255,255,.52),inset 0 -2px 5px rgba(7,33,57,.07);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
  backdrop-filter:blur(18px) saturate(145%);
  max-height:calc(100dvh - 120px - env(safe-area-inset-bottom));
  overscroll-behavior:contain;
}
.floating-header.glass-over-dark .site-nav{background-color:rgba(25,27,29,.96);background-image:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.025))}
.floating-header .site-nav>a:not(.button){color:var(--header-ink);border-bottom-color:transparent;margin-block:3px;text-shadow:0 1px 2px rgba(255,255,255,.50)}
.floating-header.glass-over-dark .site-nav>a:not(.button){text-shadow:0 1px 2px rgba(0,20,40,.60)}
.floating-header .site-nav>a:not(.button)::before{inset:2px 0;border:0;border-radius:14px;background:rgba(23,42,59,.025);box-shadow:none;opacity:.60}
.floating-header .site-nav>a[aria-current=page]:not(.button){color:var(--header-link-accent)}
.floating-header .site-nav>a[aria-current=page]:not(.button)::before{background:rgba(23,42,59,.07);border:0;opacity:1}
.brand.logo-entrance>.brand-animated-logo{max-height:58px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
.floating-header::before{background:#fff}
.floating-header.glass-over-dark::before{background:#191b1d}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
.floating-header,.floating-header.glass-over-dark,.floating-header .site-nav,.floating-header.glass-over-dark .site-nav{
  --header-ink:#17191b;
  --header-link-accent:#806100;
  background:#fff;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  border:0;
  outline:0;
  box-shadow:none;
}
.floating-header::before,.floating-header::after,.floating-header.has-glass-capsule::after,.floating-header .header-inner::before{display:none}
.floating-header .site-nav>a:not(.button),.floating-header.glass-over-dark .site-nav>a:not(.button){text-shadow:none;color:#17191b}
.floating-header .site-nav>a[aria-current=page]:not(.button){color:#806100}
.floating-header .site-nav>a:not(.button)::before{background:#f6f2e8;border-color:#d4cab3;box-shadow:none}
.floating-header .menu-toggle{background:#f6f2e8;border-color:#d4cab3}
}

@media(prefers-reduced-motion:reduce){.floating-header::before,.floating-header::after{transition:none}}