/* NorthOps site search (round 3, 10 Nov 2026): the header button and the search sheet. Shared by every page with the
   site header (homepage + /websites/, /ai-assistants/, /ai-receptionist/, /toolkit/, /privacy/). Classes are ns-*. */

/* header button: quiet, monochrome, like the other nav items */
.ns-btn{display:inline-grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:10px;background:none;
  color:rgba(0,0,0,.8);cursor:pointer;transition:color .2s ease,background-color .2s ease}
.ns-btn:hover{color:#000}
.ns-btn[hidden]{display:none}
/* subpages, phone layout: icons cluster on the right like the reference, [Get a quote] [search] [menu] */
@media (max-width:860px){.nav-right > .ns-btn{order:1}.nav-right > .nav-toggle{order:2}}
.ns-btn svg{width:17px;height:17px}
.ns-btn:focus-visible{outline:2px solid #0071e3;outline-offset:2px}

/* the sheet: a frosted curtain covers the page, the panel drops from the top */
.ns-root{position:fixed;inset:0;z-index:2000;font-family:inherit}
.ns-root[hidden]{display:none}
/* round 3b: the same milky, heavily frosted page as under the Services flyout (values shared via flyout.css) */
.ns-curtain{position:absolute;inset:0;background:var(--nf-frost-bg,rgba(246,246,248,.66));-webkit-backdrop-filter:var(--nf-frost-blur,saturate(140%) blur(40px));backdrop-filter:var(--nf-frost-blur,saturate(140%) blur(40px))}
.ns-sheet{position:relative;max-height:100%;overflow-y:auto;overscroll-behavior:contain;background:rgba(251,251,253,.98);
  box-shadow:0 18px 40px -18px rgba(0,0,0,.25);padding:max(14px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) 28px max(22px,env(safe-area-inset-left))}
.ns-form,.ns-body{max-width:680px;margin:0 auto}
.ns-form{display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(0,0,0,.1)}
.ns-field{flex:1;display:flex;align-items:center;gap:12px;min-width:0;color:#6e6e73;cursor:text}
.ns-field svg{width:22px;height:22px;flex:none}
.ns-input{flex:1;min-width:0;height:64px;padding:0;border:0;background:none;outline:none;color:#1d1d1f;
  font:inherit;font-size:24px;font-weight:600;letter-spacing:-.02em;-webkit-appearance:none;appearance:none}
.ns-input::placeholder{color:#86868b;font-weight:500}
.ns-input::-webkit-search-cancel-button{display:none}
.ns-close{display:inline-grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:none;color:#6e6e73;cursor:pointer}
.ns-close:hover{color:#1d1d1f;background:rgba(0,0,0,.05)}
.ns-close svg{width:18px;height:18px}
.ns-input:focus-visible{outline:none}
.ns-form:focus-within{border-bottom-color:#0071e3}
.ns-close:focus-visible{outline:2px solid #0071e3;outline-offset:2px}

.ns-head{margin:18px 0 6px;font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:#6e6e73}
.ns-list{list-style:none;margin:0 -12px;padding:0}
.ns-hit{display:grid;grid-template-columns:1fr auto;gap:2px 16px;padding:10px 12px;border-radius:10px;color:#1d1d1f;text-decoration:none!important;outline:none}
.ns-hit:hover{background:rgba(0,0,0,.04)}
.ns-hit:focus-visible{background:#e8f0fe;box-shadow:inset 0 0 0 2px #0071e3}
.ns-t{font-size:17px;font-weight:500;letter-spacing:-.015em;line-height:1.3}
.ns-s{align-self:start;padding-top:2px;font-size:12px;color:#6e6e73;white-space:nowrap}
.ns-d{grid-column:1 / -1;font-size:14px;line-height:1.4;color:#515154;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ns-hit mark{background:none;color:inherit;font-weight:700}
.ns-empty{padding:14px 12px;color:#515154;font-size:15px;line-height:1.5}
.ns-empty p+p{margin-top:4px}
.ns-contact{color:#0066cc;text-decoration:underline}
.ns-status{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

@media (prefers-reduced-motion:no-preference){
  .ns-root:not([hidden]):not(.ns-still) .ns-sheet{animation:ns-drop .28s cubic-bezier(.16,1,.3,1)}
  .ns-root:not([hidden]):not(.ns-still) .ns-curtain{animation:ns-fade .24s ease-out}
}
@keyframes ns-drop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@keyframes ns-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-transparency:reduce){.ns-curtain{background:rgba(245,245,247,.95);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media (max-width:640px){
  .ns-input{height:56px;font-size:20px}
  .ns-t{font-size:16px}
  .ns-sheet{min-height:100%}
}
@media print{.ns-btn,.ns-root{display:none!important}}
