/* Compact, in-flow search: suggestions appear only when a visitor asks for them. */
.project-finder{width:min(100%,36rem);margin:1.5rem auto 0;text-align:left;position:relative;z-index:1}
.project-finder-label{display:block;font-size:.875rem;color:#bacac5;margin-bottom:.5rem}
.project-query-field{display:flex;align-items:center;gap:.65rem;border:1px solid #64797188;border-radius:13px;padding:.15rem .45rem .15rem .9rem;background:#10231fc9;box-shadow:inset 0 1px #ffffff05;transition:border-color .18s,box-shadow .18s}
.project-query-field:focus-within{border-color:#cae99d;box-shadow:0 0 0 3px #c7e69b19}
.project-query-field>svg{width:18px;height:18px;flex:none;color:#b6c7bd}
#project-query{width:100%;min-width:0;border:0;outline:0;border-radius:0;background:transparent;color:#eff4ec;font:inherit;font-size:1rem;padding:.7rem 0;margin:0;box-shadow:none}
#project-query::placeholder{color:#aabcb3;opacity:1}
#project-query::-webkit-search-cancel-button{display:none}
#project-query-clear{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;padding:0;border:0;border-radius:9px;color:#dae6d9;font-size:1.35rem;line-height:1}
#project-query-clear:hover{background:#ffffff0c}
.project-finder-hint{font-size:.8rem;line-height:1.5;color:#9bb0a6;margin:.5rem .1rem 0}
.project-results-panel{margin-top:.65rem;padding:.45rem;background:#132820;border:1px solid #496452;border-radius:14px;box-shadow:0 12px 26px #0002}
.project-search-summary{margin:.35rem .55rem .55rem;font-size:.8rem;color:#b2c8b7;line-height:1.4}
.project-results{list-style:none;margin:0;padding:0;display:grid;gap:.25rem}
.project-result{display:grid;grid-template-columns:64px minmax(0,1fr) 16px;gap:.75rem;align-items:center;text-align:left;width:100%;padding:.6rem;border:0;border-radius:10px;white-space:normal;background:transparent;color:#ecf1e7}
.project-result:hover,.project-result:focus-visible{background:#213c2f}
.project-result img{width:64px;height:48px;object-fit:contain;background:#091812;border:1px solid #60766444;border-radius:5px}
.project-result strong{display:block;font-size:.9rem;line-height:1.4;font-weight:600;overflow-wrap:anywhere}
.project-result-reason{display:block;font-size:.8rem;color:#b7cbb8;line-height:1.5;margin-top:.2rem;overflow-wrap:anywhere}
.project-result-arrow{color:#d4eaa7;font-size:1rem}
#project-search-all{display:block;border:0;border-top:1px solid #44604c;border-radius:0;margin:.6rem .3rem 0;padding:.75rem .3rem .45rem;width:calc(100% - .6rem);text-align:left;white-space:normal;font-size:.85rem;line-height:1.5;color:#d3edaa}
.project-search-empty{padding:.6rem;font-size:.9rem;line-height:1.65;color:#b9ccbc}
.project-search-empty p{margin:0 0 .6rem}
.project-search-empty a{color:#d3edaa;text-underline-offset:4px}
.project-finder [hidden]{display:none!important}
.search-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.project-result:focus-visible,#project-query-clear:focus-visible,#project-search-all:focus-visible{outline:2px solid #e1f7b4;outline-offset:1px}
@media(max-width:550px){.project-finder{margin-top:1.25rem}.project-result{grid-template-columns:48px minmax(0,1fr) 13px;gap:.55rem;padding:.6rem .4rem}.project-result img{width:48px;height:42px}.project-query-field{padding-left:.7rem;gap:.5rem}.project-finder-hint{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){.project-query-field{transition:none}}

/* ---- "alive" search field: strong breath, three ripple rings, a shine sweep ----
   Everything stops on focus, while there is text, when Pause motion is on and
   for prefers-reduced-motion. Rings are injected spans, the sheen is a moving
   background layer, so nothing affects layout or hit testing. */
.project-query-field{position:relative;isolation:isolate;
  background-color:#10231fc9;
  background-image:linear-gradient(115deg,#0000 0%,#0000 36%,#c6ff6318 43%,#eaffc84d 50%,#c6ff6318 57%,#0000 64%,#0000 100%);
  background-size:300% 100%;background-repeat:no-repeat;background-position:190% 0;
  animation:field-sheen 5s ease-in-out infinite,field-edge 3.4s ease-in-out infinite}
.project-query-field::before{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:-1;
  animation:field-breathe 3.4s ease-in-out infinite}
.field-fx{position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:-1}
.field-fx i{position:absolute;inset:0;border-radius:inherit;border:1.5px solid #c6ff63;opacity:0;
  animation:field-ring 4.2s cubic-bezier(.22,.61,.36,1) infinite}
.field-fx i:nth-child(2){animation-delay:1.4s}
.field-fx i:nth-child(3){animation-delay:2.8s}
@keyframes field-breathe{
  0%,100%{box-shadow:0 0 0 1px #c6ff6326,0 0 18px 2px #c6ff632e}
  50%{box-shadow:0 0 0 5px #c6ff6342,0 0 44px 7px #c6ff6366}
}
@keyframes field-ring{
  0%{transform:scale(1);opacity:.8}
  60%{opacity:.18}
  100%{transform:scale(1.16);opacity:0}
}
@keyframes field-sheen{
  0%{background-position:190% 0}
  30%{background-position:-90% 0}
  100%{background-position:-90% 0}
}
@keyframes field-edge{
  0%,100%{border-color:#7b9a8a99}
  50%{border-color:#c6ff63cc}
}
/* calm down the moment it is in use */
.project-query-field:focus-within,
.project-query-field:has(#project-query:not(:placeholder-shown)){animation:none;background-image:none;border-color:#cae99d}
.project-query-field:focus-within::before,
.project-query-field:has(#project-query:not(:placeholder-shown))::before{animation:none;box-shadow:none}
.project-query-field:focus-within .field-fx i,
.project-query-field:has(#project-query:not(:placeholder-shown)) .field-fx i{animation:none;opacity:0}
.hillcraft-motion-off .project-query-field{animation:none;background-image:none}
.hillcraft-motion-off .project-query-field::before{animation:none;box-shadow:none}
.hillcraft-motion-off .field-fx i{animation:none;opacity:0}
@media(prefers-reduced-motion:reduce){
  .project-query-field{animation:none;background-image:none}
  .project-query-field::before{animation:none;box-shadow:none}
  .field-fx i{animation:none;opacity:0}
}
