/* Lente di ricerca nell'header — sos-casa-check-up.it
   Foglio autonomo: le pagine del sito hanno CSS ora inline ora linkato,
   questo file e' l'unico punto in cui vive lo stile della lente. */

.hsearch{position:relative;display:flex;align-items:center;flex:0 0 auto;margin-left:10px}

.hsearch-btn{
  display:inline-grid;place-items:center;
  width:44px;height:44px;padding:0;margin:0;
  border:1.5px solid var(--linea,#e2e8ee);border-radius:50%;
  background:#fff;color:var(--navy,#16283c);
  cursor:pointer;line-height:0;-webkit-appearance:none;appearance:none;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease
}
.hsearch-btn:hover{background:var(--rosso,#d8232a);border-color:var(--rosso,#d8232a);color:#fff}
.hsearch-btn[aria-expanded="true"]{background:var(--rosso,#d8232a);border-color:var(--rosso,#d8232a);color:#fff;transform:rotate(0)}
.hsearch-btn:focus-visible{outline:3px solid var(--rosso,#d8232a);outline-offset:2px}
.hsearch-btn:active{transform:scale(.94)}

/* l'icona: stroke sul currentColor, cosi' segue il colore del bottone */
.hsearch-btn svg{
  display:block;width:20px;height:20px;
  fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round
}

/* pannello a comparsa */
.hsearch-form{
  position:absolute;top:calc(100% + 12px);right:0;z-index:60;
  display:none;background:#fff;
  border:1px solid var(--linea,#e2e8ee);border-radius:14px;
  box-shadow:0 18px 42px rgba(16,40,60,.18);
  padding:10px
}
.hsearch.open .hsearch-form{display:block;animation:hsearch-in .16s ease-out}
@keyframes hsearch-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* freccetta verso il bottone */
.hsearch-form::before{
  content:"";position:absolute;top:-7px;right:16px;width:12px;height:12px;
  background:#fff;border-left:1px solid var(--linea,#e2e8ee);border-top:1px solid var(--linea,#e2e8ee);
  transform:rotate(45deg);border-radius:2px 0 0 0
}

.hsearch-row{display:flex;align-items:stretch;gap:8px}

.hsearch-form input{
  width:min(300px,calc(100vw - 108px));
  padding:11px 14px;margin:0;
  border:1px solid var(--linea,#e2e8ee);border-radius:9px;
  font:inherit;font-size:.95rem;color:var(--inch,#25313d);background:#fff;
  -webkit-appearance:none;appearance:none
}
.hsearch-form input::placeholder{color:#93a2b0}
.hsearch-form input:focus{outline:none;border-color:var(--rosso,#d8232a);box-shadow:0 0 0 3px rgba(216,35,42,.14)}
.hsearch-form input::-webkit-search-cancel-button{cursor:pointer}

.hsearch-go{
  display:inline-grid;place-items:center;flex:0 0 auto;
  width:44px;padding:0;margin:0;line-height:0;
  border:0;border-radius:9px;background:var(--rosso,#d8232a);color:#fff;cursor:pointer;
  -webkit-appearance:none;appearance:none;transition:filter .18s ease
}
.hsearch-go:hover{filter:brightness(.92)}
.hsearch-go:focus-visible{outline:3px solid var(--navy,#16283c);outline-offset:2px}
.hsearch-go svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}

/* mobile: lente a sinistra del burger, CTA prima */
@media(max-width:960px){
  .hsearch{order:2;margin-left:auto}
  .head .btn.cta,.head .cta{order:1}
  .burger{order:3;margin-left:8px}
}
@media(max-width:560px){
  .hsearch{margin-left:6px}
  .hsearch-btn{width:40px;height:40px}
  .hsearch-btn svg{width:18px;height:18px}
  .hsearch-form{right:-6px}
  .hsearch-form input{width:calc(100vw - 104px)}
}
@media(prefers-reduced-motion:reduce){
  .hsearch-btn,.hsearch-go{transition:none}
  .hsearch.open .hsearch-form{animation:none}
}