.blog-nav{--blog-nav-panel-shift: 20px;--blog-nav-panel-duration: .4s;--blog-nav-dot: 4px;--blog-nav-accent: #00a86b;--blog-nav-field-rule: #e1e1e1;--blog-nav-results-rule: #ededed;color:rgb(var(--color-foreground))}.blog-nav__row{position:relative;display:flex;align-items:center;gap:12px;block-size:32px;box-sizing:content-box;padding-block-end:10px;border-block-end:1px solid rgb(var(--color-foreground))}@media screen and (min-width:750px){.blog-nav__row{justify-content:space-between;gap:24px;block-size:39px;padding-block-end:0}}.blog-nav__items{display:flex;flex:1 1 0;align-items:center;gap:2px;min-inline-size:0;block-size:100%;margin:0;padding:0;overflow-x:auto;list-style:none;scrollbar-width:none}@media screen and (min-width:750px){.blog-nav__items{flex:0 1 auto;gap:0;overflow:visible}}.blog-nav__items::-webkit-scrollbar{display:none}.blog-nav__item{flex:none}.blog-nav__link,.blog-nav__search-toggle{font-family:var(--font-brand-family);font-size:12px;font-weight:var(--font-weight-semibold);line-height:16px;letter-spacing:1.2px;text-transform:uppercase;white-space:nowrap;color:inherit}@media screen and (min-width:750px){.blog-nav__link,.blog-nav__search-toggle{letter-spacing:2.4px}}.blog-nav__link{position:relative;display:block;padding-inline:7px;text-decoration:none}@media screen and (min-width:750px){.blog-nav__link{padding-inline:12px}}.blog-nav__link:focus-visible{outline:2px solid rgb(var(--color-foreground));outline-offset:4px}@media screen and (min-width:750px){.blog-nav__link--current:before{position:absolute;inset-block-start:-16px;inset-inline-start:calc(50% - 1.2px - var(--blog-nav-dot) / 2);inline-size:var(--blog-nav-dot);block-size:var(--blog-nav-dot);border-radius:50%;background-color:currentColor;content:""}}@media screen and (min-width:750px){.blog-nav__label-mobile{display:none}}.blog-nav__link:has(.blog-nav__label-mobile) .blog-nav__label{display:none}@media screen and (min-width:750px){.blog-nav__link:has(.blog-nav__label-mobile) .blog-nav__label{display:inline}}.blog-nav__search-toggle{display:flex;min-inline-size:24px;min-block-size:24px;flex:none;align-items:center;padding:0;border:0;background:none;cursor:pointer}.blog-nav__search-toggle:focus-visible{outline:2px solid rgb(var(--color-foreground));outline-offset:4px}.blog-nav__search-text{display:none}@media screen and (min-width:750px){.blog-nav__search-text{display:inline}}.blog-nav__search-icon{display:flex}.blog-nav__search-icon svg{width:16px;height:16px}@media screen and (min-width:750px){.blog-nav__search-icon{display:none}}@media screen and (min-width:750px){.blog-nav__search-name{display:none}}.blog-nav__panel{position:absolute;inset-block-start:100%;inset-inline:0;z-index:10;border-block-start:3px solid var(--blog-nav-accent);background-color:rgb(var(--color-background));box-shadow:0 2px 6px #0003;opacity:0;transform:translateY(var(--blog-nav-panel-shift));transition:opacity var(--blog-nav-panel-duration),transform var(--blog-nav-panel-duration)}@media screen and (min-width:750px){.blog-nav__panel{inset-inline-start:auto;inline-size:300px}}@media screen and (min-width:750px){.blog-nav__panel:before{position:absolute;inset-block-end:calc(100% + 3px);inset-inline-end:0;border-style:solid;border-width:0 6.5px 7px;border-color:transparent transparent var(--blog-nav-accent);content:""}}.blog-nav__panel--open{opacity:1;transform:none}.blog-nav__form{display:flex;flex-direction:column;padding:20px 16px}@media screen and (min-width:750px){.blog-nav__form{padding:20px}}.blog-nav__field-label{font-family:var(--font-brand-family);font-size:12px;line-height:28px;text-align:center;opacity:.8}@media screen and (min-width:750px){.blog-nav__field-label{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}.blog-nav__field{display:flex;border-block-end:1px solid var(--blog-nav-field-rule)}.blog-nav__field:has(:focus-visible){border-color:rgb(var(--color-foreground))}@media screen and (min-width:750px){.blog-nav__field{border:1px solid var(--blog-nav-field-rule)}}.blog-nav__input{flex:1 1 0;min-inline-size:0;block-size:46px;padding:0;border:0;border-radius:0;background-color:transparent;font-family:var(--font-brand-family);font-size:26px;font-weight:var(--font-weight-semibold);line-height:36px;text-align:center;color:inherit;-webkit-appearance:none;appearance:none}.blog-nav__input:focus-visible{outline:0}.blog-nav__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}@media screen and (min-width:750px){.blog-nav__input{block-size:30px;padding-inline:9px;font-family:var(--font-accent-family);font-size:12px;font-weight:var(--font-weight-regular);line-height:21px;text-align:start}}.blog-nav__submit{display:none;flex:none;padding-inline:15px;border:1px solid rgb(var(--color-foreground));background-color:rgb(var(--color-foreground));font-family:var(--font-brand-family);font-size:13px;font-weight:var(--font-weight-semibold);line-height:24px;color:rgb(var(--color-background));cursor:pointer;transition:background-color var(--transition-slow),color var(--transition-slow)}.blog-nav__submit:hover,.blog-nav__submit:focus-visible{background-color:transparent;color:rgb(var(--color-foreground))}@media screen and (min-width:750px){.blog-nav__submit{display:block;margin:-1px -1px -1px 0}}.blog-nav__suggestions{display:flex;flex-direction:column;gap:20px;margin:0;padding:0 16px 20px;list-style:none}@media screen and (min-width:750px){.blog-nav__suggestions{padding:20px;border-block:1px solid var(--blog-nav-results-rule)}}.blog-nav__suggestion{scroll-margin-block:20px}.blog-nav__message{margin:0;padding:0 16px 20px;font-family:var(--font-accent-family);font-size:12px;font-style:italic;line-height:28px}@media screen and (min-width:750px){.blog-nav__message{padding:4px 20px 6px;text-align:end}}.blog-nav__view-all{display:block;background-color:rgb(var(--color-foreground));font-family:var(--font-brand-family);font-size:17px;font-style:normal;line-height:50px;text-align:center;text-decoration:none;text-transform:uppercase;color:rgb(var(--color-background));transition:color var(--transition-base)}.blog-nav__view-all:focus-visible{outline:2px solid rgb(var(--color-foreground));outline-offset:2px}@media screen and (min-width:750px){.blog-nav__view-all{display:inline;background-color:transparent;font-family:inherit;font-size:inherit;font-style:italic;line-height:inherit;text-transform:none;color:inherit}.blog-nav__view-all:hover{color:var(--blog-nav-accent)}}@media(prefers-reduced-motion:reduce){.blog-nav__panel,.blog-nav__submit,.blog-nav__view-all{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/926/assets/section-blog-nav.css.map */