/* Screen-reader-only utility */
.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;
}

/* Toggle button */
.header-call{display: flex; gap: .4rem;}
.header-search{display: flex; flex-direction: row; justify-content: center; margin-top: 20px;}
.header-search-btn {cursor:pointer;  gap:.4rem; color: #1F2D69; font-size: 14px; font-style: normal; font-weight: 700; line-height: 18px;
  display: flex; padding: 14px 50px !important; justify-content: center; align-items: center; 
  /* border-radius: 6px!important;  */
  background: #fff;
  border: 2px solid #fff; }
/* .header-search-btn:hover{color: #fff; background-color: transparent;} */
.header-search-btn .label { font-size:.95rem; }

/* Backdrop + panel */
.site-search-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:9998; }
.site-search-panel {
  position:fixed; left:0; right:0; top:0;
  background:#fff; z-index:9999;
  transform:translateY(-8px); opacity:0; pointer-events:none;
  transition:transform .18s ease, opacity .18s ease;
  box-shadow:0 10px 30px rgba(0,0,0,.15);
}
.site-search-panel[hidden] { display:block; } /* keep layout but hidden */
.search-open #site-search-panel { transform:translateY(0); opacity:1; pointer-events:auto; }

.site-search-inner { max-width:960px; margin:0 auto; padding:30px; position:relative; }
.site-search-close { position:absolute; right:12px; top:12px; background:none; border:0; font-size:20px; cursor:pointer; }

/* Form */
.articles-search { display:flex; gap:8px; align-items:center; margin-top:8px; }
.articles-search input[type="search"] { flex:1; padding:.7rem .9rem; border:1px solid #ccc; border-radius:8px; }
.articles-search button[type="submit"] { padding:.7rem 1.1rem; border:0; border-radius:8px; cursor:pointer; }

/* Suggested chips */
.articles-suggested { margin-top:12px; }
.articles-suggested .label { font-weight:600; margin-right:6px; }
.articles-suggested .chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.chip {
  display:inline-block; padding:.4rem .75rem;
  border:1px solid #ddd; border-radius:999px; text-decoration:none; font-size:.95rem;
}


/* First article of a batch appended by Load More. Focus normally stays on the
   button, but lands here on the final page when the button is removed, so
   suppress the ring for mouse users while keeping it for keyboard users. */
.srm-batch-start:focus { outline: none; }
.srm-batch-start:focus-visible { outline: 2px solid #3B7ADE; outline-offset: 3px; }


/* Suggested chips categories*/
.articles-suggested-categories { color: #fff;  max-width: 65%;  margin: 25px auto 0;}
.articles-suggested-categories .label { font-weight:600; margin-right:6px; display: none;}
.articles-suggested-categories .chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; justify-content: center; padding-top:20px;}
.articles-suggested-categories .chips .chip {
  display:inline-block; padding:.4rem .75rem;
  background: #fff; border: 2px solid #fff; color: #1F2D69; border-radius:999px; 
  text-decoration:none; font-size:.95rem;
}
.articles-suggested-categories .chips .chip:hover{background: #1F2D69; border: 2px solid #1F2D69; color: #fff;}
/* Hide on mobile until expanded */

/* Prevent body scroll when open */
body.search-open { overflow:hidden; }


/* --- Mobile adjustments --- */
@media (max-width: 991px) {
  .header-flex { gap: 10px; }

  /* Keep items readable and tappable */
  .header-call a { font-size: 14px; }

  .header-search{display: flex; align-items: center;}

  /* Shrink search button footprint and hide text label on small screens */
  .header-search-btn { padding: 10px; border-radius: 999px; }
  .header-search-btn .label { display: none; }  /* icon-only on mobile */
}

@media (max-width: 768px) {
  .categories-toggle {
    display: inline-block;
    margin-bottom: 8px;
  }
  .articles-suggested-categories { text-align: center; max-width: 100%; padding: 0 12px;}
  .articles-suggested-categories .chips {
    flex-wrap: wrap;
    gap: 8px;
    padding-top:0px;
  }
  .categories-toggle {
    display: inline-block;
    background: #fff;
    color: #1F2D69;
    border: none;
    padding: 8px 40px;
    cursor: pointer;
    font-size: 14px;
    border-radius: 18px;
    margin-bottom: 8px;
  }
  /* Wrap as pills rather than one full-width column: the category list is
     long enough that a vertical stack pushes the articles off screen. */
  .articles-suggested-categories .chips{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 0px;
  }
  .articles-suggested-categories .chips .chip{
    border-radius: 999px;
    padding: .4rem .7rem;
    font-size: .9rem;
  }
  .articles-suggested-categories.js-collapsible:not(.is-open) .chips{
    display: none;
  }

}

@media (min-width: 769px) {
  .categories-toggle {
    display: none;
  }
}