:root{ --nav-inset:16px; --page-inset:calc(var(--nav-inset) + 12px + 14px); --nav-height:72px; --nav-height-scrolled:66px; --nav-stack:calc(var(--nav-inset) + var(--nav-height-scrolled)); } :root{ --nav-line:rgb(26 26 25 / 9%); --nav-tint:255 255 255; --nav-wash:250 249 247; --nav-blend:screen; --nav-scrim:250 249 247; } @media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ --nav-line:rgb(255 255 255 / 12%); --nav-tint:255 255 255; --nav-wash:22 22 20; --nav-blend:multiply; --nav-scrim:22 22 20; } } :root[data-theme="dark"]{ --nav-line:rgb(255 255 255 / 12%); --nav-tint:255 255 255; --nav-wash:22 22 20; --nav-blend:multiply; --nav-scrim:22 22 20; } .site-nav.over-hero{ --color-bg:#161614; --color-surface:#1f1e1b; --color-border:#302e29; --color-text:#f2f0eb; --color-text-faint:#949086; --nav-line:rgb(255 255 255 / 12%); --nav-wash:22 22 20; --nav-blend:multiply; --nav-scrim:22 22 20; } .site-nav[data-nav-mode="ghost"]{ --nav-tint:171 171 171; --nav-fill-alpha:0.18; --nav-blur:4px; --nav-wash-alpha:0; --nav-scrim-alpha:0; } .site-nav[data-nav-mode="crisp"]{ --nav-fill-alpha:0.14; --nav-blur:0px; --nav-wash-alpha:0; --nav-scrim-alpha:0; } .site-nav[data-nav-mode="soft"] .site-nav__bar{ background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; } .site-nav[data-nav-mode="soft"] .site-nav__bar::before{ background:rgba(20,20,20,0.35); border-bottom:1px solid rgba(242,240,235,0.10); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); mix-blend-mode:normal; opacity:0; transition:opacity 220ms ease, backdrop-filter 220ms ease; } .site-nav[data-nav-mode="soft"].is-scrolled .site-nav__bar::before{ opacity:1; } .site-nav.over-hero{ --nav-scrim-alpha:0; } .site-nav.over-band .site-nav__bar{ background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; } .site-nav[data-nav-mode="ghost"]:not(.over-band){ --nav-blur:0px; } .site-nav.over-hero::before{ inset:0 0 -64px; } .site-nav.over-directory{ background:transparent; pointer-events:none; transition:background-color 220ms ease; --nav-scrim-alpha:0; } .site-nav.over-directory .site-nav__bar{ box-shadow:none; } .site-nav.over-directory .site-nav__bar{ --nav-blur:0px; background:var(--color-bg); opacity:0; transform:translateY(-10px); visibility:hidden; transition:opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms, height 220ms ease, box-shadow 250ms ease, background-color 220ms ease, backdrop-filter 220ms ease, -webkit-backdrop-filter 220ms ease; } @media (max-width:900px) and (pointer:coarse), (max-width:480px){ .site-nav.over-directory .site-nav__bar{ opacity:1; transform:none; visibility:visible; background:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; } .site-nav.over-directory .site-nav__brand{ opacity:0; visibility:hidden; pointer-events:none; transition:opacity 180ms ease, visibility 0s linear 180ms; } .site-nav.over-directory:not(.dir-pinned) .site-nav__actions{ opacity:0; visibility:hidden; pointer-events:none; } .site-nav.over-directory.dir-pinned .site-nav__actions{ position:fixed; left:var(--dock-left, 47px); bottom:calc(env(safe-area-inset-bottom, 0px) + var(--nav-inset)); padding:0; pointer-events:auto; filter:drop-shadow(0 2px 10px rgb(0 0 0 / 0.18)); animation:nav-dock-in 200ms ease both; } .site-nav.over-directory .site-nav__link{ display:none; } @media (prefers-reduced-motion:no-preference){ .site-nav.over-directory .site-nav__actions{ transition:opacity 180ms ease, visibility 0s linear 180ms; } .site-nav.over-directory.dir-pinned .site-nav__actions{ transition:opacity 180ms ease, visibility 0s; } } @keyframes nav-dock-in{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } } } @media (max-width:900px) and (pointer:coarse) and (prefers-reduced-motion:reduce), (max-width:480px) and (prefers-reduced-motion:reduce){ .site-nav.over-directory .site-nav__actions{ animation:none; } } @media (max-width:900px) and (pointer:coarse), (max-width:480px){ body:has(.company-dialog[data-mode="sheet"][open]) .site-nav.over-directory.dir-pinned .site-nav__actions, :root[data-rail-overlay="open"] .site-nav.over-directory.dir-pinned .site-nav__actions{ opacity:0; visibility:hidden; pointer-events:none; animation:none; } } @media (max-width:480px){ .site-nav.over-directory.dir-pinned .site-nav__actions{ left:var(--space-3); } } .site-nav{ position:sticky; top:0; z-index:90; padding:var(--nav-inset) var(--nav-inset) 0; background:transparent; } .site-nav::before{ content:""; position:absolute; inset:0 0 -28px; pointer-events:none; background:linear-gradient( to bottom, rgb(var(--nav-scrim) / calc(var(--nav-scrim-alpha) * 1)) 0%, rgb(var(--nav-scrim) / calc(var(--nav-scrim-alpha) * 0.7)) 62%, rgb(var(--nav-scrim) / 0) 100%); } .site-nav__bar{ position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:var(--space-6, 1.5rem); height:var(--nav-height); padding-inline:12px; border-radius:10px; border:0; background:rgb(var(--nav-tint) / var(--nav-fill-alpha)); backdrop-filter:blur(var(--nav-blur)); -webkit-backdrop-filter:blur(var(--nav-blur)); box-shadow:0 2px 10px var(--nav-shadow, transparent); transition:height 220ms ease, box-shadow 250ms ease, background-color 220ms ease, backdrop-filter 220ms ease, -webkit-backdrop-filter 220ms ease, opacity 180ms ease, transform 180ms ease, visibility 0s linear 0s; } .site-nav.is-scrolled .site-nav__bar{ --nav-shadow:rgb(0 0 0 / 10%); } :root[data-theme="dark"] .site-nav.is-scrolled .site-nav__bar, .site-nav.over-hero.is-scrolled .site-nav__bar{ --nav-shadow:rgb(0 0 0 / 38%); } @media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .site-nav.is-scrolled .site-nav__bar{ --nav-shadow:rgb(0 0 0 / 38%); } } .site-nav__bar::before{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:rgb(var(--nav-wash) / var(--nav-wash-alpha)); mix-blend-mode:var(--nav-blend); } .site-nav.is-scrolled .site-nav__bar{ height:var(--nav-height-scrolled); } .site-nav__brand, .site-nav__actions{ position:relative; align-self:center; } @supports not (backdrop-filter: blur(2px)){ .site-nav__bar{ background:rgb(var(--nav-tint) / 0.92); } :root[data-theme="dark"] .site-nav__bar{ background:rgb(var(--nav-wash) / 0.92); } .site-nav[data-nav-mode="soft"] .site-nav__bar::before{ background:rgb(var(--nav-tint) / 0.92); opacity:1; } :root[data-theme="dark"] .site-nav[data-nav-mode="soft"] .site-nav__bar::before{ background:rgb(var(--nav-wash) / 0.92); opacity:1; } .site-nav.over-hero .site-nav__bar{ background:rgb(20 20 20 / 0.92); } .site-nav.over-band:not(.over-hero) .site-nav__bar{ background:rgb(var(--nav-tint) / 0.92); } :root[data-theme="dark"] .site-nav.over-band:not(.over-hero) .site-nav__bar{ background:rgb(var(--nav-wash) / 0.92); } } .site-nav__brand{ display:inline-flex; align-items:center; gap:5px; padding:9px 18px 9px 14px; color:var(--color-text); text-decoration:none; } @media (max-width:720px){ .site-nav.over-hero .site-nav__brand{ position:relative; } } .site-nav__mark{ flex:none; width:28.32px; height:17.7px; color:currentColor; } .site-nav__word{ font-size:1.25rem; font-weight:500; font-family:var(--font-sans-system); letter-spacing:0.01em; white-space:nowrap; } .site-nav__actions{ display:flex; align-items:center; gap:18px; padding-inline:8px 14px; } :root{ --nav-tile-bg:#f7f6f3; --nav-tile-ink:#161614; --nav-tile-edge:#161614; } .site-nav__link, .site-nav__util{ display:inline-flex; align-items:center; gap:8px; height:44px; padding-inline:16px; border:1px solid var(--nav-tile-edge); border-radius:2px; background-color:var(--nav-tile-bg); color:var(--nav-tile-ink); font-family:inherit; font-size:0.8125rem; font-weight:500; letter-spacing:0.18em; text-transform:uppercase; text-decoration:none; cursor:pointer; transition:background-color 140ms ease; } .site-nav__link:hover, .site-nav__util:hover, .site-nav__util[aria-expanded="true"]{ background-color:var(--nav-tile-ink); color:var(--nav-tile-bg); border-color:transparent; } .site-nav__util + .site-nav__util{ margin-left:-19px; } .site-nav__link{ position:relative; padding-inline:48px; text-transform:none; letter-spacing:0.01em; font-size:0.875rem; } .site-nav__icon{ flex:none; width:19px; height:19px; } .site-nav__util span{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; } .site-nav__util{ gap:0; padding-inline:13px; } .site-nav ~ .site-header.entity-topbar{ display:none; } .nav-menu[hidden], .nav-search[hidden]{ display:none; } .nav-menu, .nav-search{ position:fixed; inset:0; z-index:150; display:flex; background:rgb(var(--nav-scrim) / 0.88); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); } .nav-menu{ flex-direction:column; padding:calc(var(--nav-inset) + var(--nav-height) + 24px) var(--space-5, 1.25rem) var(--space-8, 3rem); overflow-y:auto; } .nav-menu__grid{ width:100%; max-width:var(--container-max); margin-inline:auto; display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:var(--space-6, 1.5rem); } .nav-menu__group h2{ margin-bottom:var(--space-3, 0.75rem); color:var(--color-text-faint); font-size:var(--text-xs); font-weight:500; letter-spacing:0.16em; text-transform:uppercase; } .nav-menu__group a{ display:block; padding-block:8px; color:var(--color-text); font-size:var(--text-lg); letter-spacing:-0.01em; text-decoration:none; border-bottom:1px solid var(--color-border); } .nav-menu__group a:hover{ color:var(--color-accent); } .nav-menu__note{ width:100%; max-width:var(--container-max); margin:var(--space-7, 2rem) auto 0; color:var(--color-text-faint); font-size:var(--text-sm); } .nav-search{ align-items:flex-start; justify-content:center; padding:calc(var(--nav-inset) + var(--nav-height) + 8vh) var(--space-5, 1.25rem); } .nav-search__form{ width:100%; max-width:720px; } .nav-search__field{ width:100%; padding:0 0 var(--space-4, 1rem); border:0; border-bottom:1px solid var(--color-border-strong); background:none; color:var(--color-text); font-family:inherit; font-size:var(--text-2xl); font-weight:400; letter-spacing:-0.02em; } .nav-search__field:focus{ outline:none; border-bottom-color:var(--color-accent); } .nav-search__field::placeholder{ color:var(--color-text-faint); } .nav-search__hint{ margin-top:var(--space-4, 1rem); color:var(--color-text-faint); font-size:var(--text-sm); } :root.nav-locked, :root.nav-locked body{ overflow:hidden; } @media (prefers-reduced-motion:reduce){ .site-nav__bar{transition:none} .site-nav__bar::before{transition:none} } @media (max-width:720px){ .site-nav[data-nav-mode="ghost"]:not(.over-band){ --nav-blur:12px; } :root{ --nav-inset:12px; --page-inset:calc(var(--nav-inset) + 8px + 10px); --nav-height:64px; --nav-height-scrolled:60px; } .site-nav__bar{ padding-inline:8px; } .site-nav__brand{ padding:7px 12px 7px 10px; gap:4px; } .site-nav__actions{ padding-inline:8px 10px; } .site-nav__word{ letter-spacing:0; } .site-nav__link{ display:none; } .site-nav__link, .site-nav__util{ padding-inline:12px; } .site-nav__icon{ width:19px; height:19px; } .nav-search__field{ font-size:var(--text-xl); } }