.search-trigger{position:relative;display:flex;align-items:center;height:50px;width:100%;background-color:var(--color-input);border-radius:var(--radius-m);transition:all .3s ease;container-type:inline-size;&:hover{background-color:var(--color-input-dark)}}.search-trigger__icon{height:20px;width:20px;margin:0 10px 0 15px;path{stroke:var(--color-text)}@container (max-width: 200px){@media (pointer: fine){height:16px;width:16px;margin:0 10px}}}.search-trigger__text{white-space:nowrap;@container (max-width: 200px){@media (pointer: fine){font-size:.875rem}}}.search-trigger__hotkey{display:inline-flex;margin-left:auto;margin-right:15px;@container (max-width: 200px){margin-right:10px}}.search-overlay{position:fixed;z-index:999;top:0;left:0;height:100%;width:100%;background:var(--color-overlay);opacity:0;transition:all .15s var(--ease);pointer-events:none;&[data-isvisible=true]{transition:all .3s var(--ease);opacity:1;pointer-events:all}}.search-popup{--top: 80px;--header-height: 80px;--line-color: hsl(var(--hs-periwinkle), 70%);--hover-color: hsl(var(--hs-periwinkle), 96%);position:fixed;z-index:1000;display:flex;flex-direction:column;width:600px;max-width:calc(100% - 60px);top:var(--top);left:50%;transform:translate(-50%,5px) scale(.99);opacity:0;transition:all .15s var(--ease);pointer-events:none;background-color:#fff;border-radius:var(--radius-l);box-shadow:0 0 0 4px #0000000d;overflow:hidden;&[data-isvisible=true]{transition:all .3s var(--ease);opacity:1;transform:translate(-50%) scale(1);pointer-events:all}@media all and (max-width: 600px){--top: 20px;max-width:calc(100% - 40px)}}.search-close{position:absolute;z-index:1;top:20px;right:20px;display:flex;align-items:center;justify-content:center;height:40px;width:40px;border-radius:var(--radius-m);transition:all .2s ease;&:hover{background-color:var(--color-linen)}svg{height:14px;width:14px;path{stroke-width:1.25;stroke:var(--color-text)}}}.popup__header{display:flex;align-items:center;height:var(--header-height);padding:0 20px;svg{height:20px;width:20px}}.search-input{height:var(--header-height);width:100%;padding:0 15px;font-size:1.125rem}.search-results{display:flex;flex-direction:column;padding:5px 20px 20px 15px;margin-top:-5px;overflow:auto;max-height:calc(100vh - var(--top) - var(--header-height) - 80px);scrollbar-width:thin;mark{background-color:var(--color-sage);border-radius:6px}&:empty{padding:0;border-top:0}}.search-result__link{position:relative;display:flex;padding:16px 25px 16px 11px;align-items:center;border-radius:var(--radius-s);font-weight:500;font-size:1.125em;&:focus-visible{box-shadow:0 0 0 2px var(--color-focus-outline);z-index:1}@media all and (min-width: 351px){&:after{content:"";display:inline-block;height:10px;width:20px;margin:0 0 0 auto;background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20xmlns='http://www.w3.org/2000/svg'%20version='1.1'%20viewBox='0%200%2017.2%2012.2'%3e%3c!--%20Generator:%20Adobe%20Illustrator%2029.5.0,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%202.1.0%20Build%20137)%20--%3e%3cpath%20d='M11.3.6l1.8,3.3,3.3,1.8c.2,0,.2.2.2.4s0,.3-.2.4l-3.3,1.8-1.8,3.3M.6,6.1h16'%20fill='none'%20stroke='%23191919'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='1.2'/%3e%3c/svg%3e") center right no-repeat;background-size:contain;transition:all .3s var(--ease);flex-shrink:0}}&:hover{background-color:var(--hover-color);&:after{transform:translate(3px)}}.sub-search-result &{padding-left:20px}}.search-result__sublink{--bg: #fff;position:relative;display:block;padding:7px 7px 7px 45px;border-radius:var(--radius-s);background-color:var(--bg);&:focus-visible{box-shadow:0 0 0 2px var(--color-focus-outline);z-index:1}&:before{content:"";position:absolute;z-index:1;top:18px;left:17px;height:5px;width:5px;border-radius:50%;background-color:var(--line-color);box-shadow:0 0 0 4px var(--bg)}&:after{content:"";position:absolute;top:0;left:19px;display:block;height:100%;width:1px;background-image:repeating-linear-gradient(180deg,var(--line-color),var(--line-color) 4px,transparent 4px,transparent 8px)}&:last-child:after{height:15px}&:hover{--bg: var(--hover-color)}}.search-result__sublink-title{position:relative}.search-excerpt{font-size:.9em;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--color-text-faded)}.search-no-results{padding:20px 30px 30px;margin:0 0 0 5px;line-height:1.5;font-size:1.25em;background-color:var(--color-linen);border-radius:var(--radius-l);small{display:block;margin-top:10px;font-size:.85;a{display:inline-block;margin-left:5px;text-decoration:underline;color:var(--color-dark-green)}}}