
/* visible only on mobile by default */
.only-mobile { display: none; }

@media (max-width: 782px){
  .only-mobile { display:block; }
}

/* the hero band */
.an-search-hero{
  width:100%;
  background:#f7fbf8;
  border-top:3px solid #009345;
  border-bottom:1px solid #e9e9e9;
  padding:12px 12px;
  margin:0;
  z-index: 9997;
}

.an-search-hero__inner{
  max-width:1120px;
  margin:0 auto;
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:center;
}

.an-search-hero__brand{
  font-size:18px;
  font-weight:600;
  color:#0a3d24;
  white-space:nowrap;
}

.an-search-hero__form{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex:1 1 760px;
  width:100%;
}

.an-search-hero__input{
  width:100%;
  max-width:860px;
  height:56px;
  padding:0 18px;
  font-size:18px;
  border:1px solid #cfd8d3;
  border-radius:9999px;
  outline:none;
  background:#fff;
  transition: box-shadow .2s, border-color .2s;
}

.an-search-hero__input:focus{
  border-color:#009345;
  box-shadow:0 0 0 4px rgba(0,147,69,.12);
}

.an-search-hero__btn{
  height:56px;
  padding:0 20px;
  font-size:16px;
  border:none;
  border-radius:9999px;
  background:#009345;
  color:#fff;
  cursor:pointer;
}

@media (min-width: 783px){
  /* hide on desktop by default; you can change to display:block if you want it also on desktop */
  .an-search-hero{ display:none; }
}

/* hide theme's icon toggle on mobile if present */
@media (max-width: 782px){
  .search-toggle{ display:none !important; }
  .site-header .search-form{ display:none !important; } /* prevent double forms */
}
