@charset "utf-8";
/* 기금안내 > 학과 · 목적 장학금 안내 — 검색 가능한 장학금 디렉터리 */

/* ---------- 검색 ---------- */
.search{
  position:relative;max-width:520px;margin:0 auto 18px;
}
.search input{
  width:100%;padding:15px 48px 15px 46px;border-radius:999px;
  border:1.5px solid var(--line-strong);background:var(--surface);
  font:inherit;font-size:15.5px;color:var(--text);
  transition:border-color .18s,box-shadow .18s;
}
.search input::placeholder{color:var(--text-dim)}
.search input:focus{
  outline:none;border-color:var(--brand);
  box-shadow:0 0 0 4px rgba(59,117,192,.12);
}
.search__icon{
  position:absolute;left:18px;top:50%;translate:0 -50%;color:var(--text-dim);pointer-events:none;
}
.search__clear{
  position:absolute;right:8px;top:50%;translate:0 -50%;
  width:32px;height:32px;border-radius:50%;display:none;place-items:center;
  color:var(--text-dim);background:transparent;cursor:pointer;
}
.search__clear:hover{background:var(--bg-alt);color:var(--text)}
.search.has-value .search__clear{display:grid}

.search__meta{
  text-align:center;font-size:13.5px;color:var(--text-dim);margin-bottom:40px;
}
.search__meta b{color:var(--text);font-weight:800}

/* ---------- 빠른 이동 ---------- */
.jumpnav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:44px}
.jumpnav a{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 16px;border-radius:999px;
  background:var(--surface);border:1px solid var(--line);
  font-size:13.5px;font-weight:700;color:var(--text-mid);
  transition:border-color .18s,color .18s;
}
.jumpnav a:hover{border-color:var(--brand);color:var(--brand-strong)}
.jumpnav a b{
  display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;
  border-radius:999px;background:var(--sky-soft);color:var(--brand-strong);font-size:11.5px;
}

/* ---------- 그룹 ---------- */
.group{margin-bottom:56px;scroll-margin-top:calc(var(--header-h) + 20px)}
.group__head{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;
  padding-bottom:16px;border-bottom:2px solid var(--text);margin-bottom:22px;
}
.group__head h3{font-size:clamp(19px,2.6vw,24px);font-weight:900;letter-spacing:-.03em}
.group__count{font-size:13.5px;color:var(--text-dim);font-weight:600}

.group__notes{
  list-style:none;margin:0 0 24px;padding:16px 20px;
  background:var(--sky-soft);border-radius:var(--radius-m);
  font-size:13.5px;line-height:1.75;color:var(--brand-strong);word-break:keep-all;
}

/* ---------- 카드 목록 ---------- */
.entries{display:flex;flex-direction:column;gap:10px}
.entry{
  padding:20px 24px;border-radius:var(--radius-m);
  background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-s);
  transition:opacity .2s,transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .2s,border-color .2s;
}

/* ── 장학금 하나에 마우스를 올렸을 때 ──────────────────────────────
   마흔 개가 넘는 장학금이 줄줄이 이어져 있어, 어느 것을 보고 있는지
   놓치기 쉽습니다. 카드가 3px 떠오르고 테두리가 파래지며, 이름과 설명
   글자도 한 톤 진해져 그 장학금만 눈에 들어옵니다.

   색만으로 알리지 않고 위치와 테두리가 함께 바뀌므로, 색을 구별하기
   어려운 분도 어느 카드인지 알 수 있습니다.                          */
.entry__name{transition:color .2s}
.entry__desc{transition:color .2s}
.entry:hover{
  transform:translateY(-3px);
  border-color:var(--brand);
  box-shadow:0 14px 26px rgba(15,45,80,.16),
             0 0 0 3px rgba(0,116,176,.12);
}
.entry:hover .entry__name{color:var(--brand-strong)}
.entry:hover .entry__desc{color:var(--text)}

/* 화면이 움직이면 어지러우신 분들께는 카드를 띄우지 않고
   테두리와 색만 바꿔 알려 드립니다. */
@media (prefers-reduced-motion:reduce){
  .entry:hover{transform:none}
}
.entry__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.entry__name{font-size:16px;font-weight:800;letter-spacing:-.015em}
.entry__desc{margin-top:8px;font-size:14.5px;line-height:1.7;color:var(--text-mid);word-break:keep-all}

.entry__links{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:0}
.entry__links a{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 12px;border-radius:999px;
  background:var(--bg-alt);border:1px solid var(--line);
  font-size:12.5px;font-weight:600;color:var(--brand-strong);
  transition:background .18s,border-color .18s;
}
.entry__links a:hover{background:var(--sky-soft);border-color:var(--brand)}
.entry__links svg{flex:0 0 auto}

/* 검색어와 일치하는 부분 강조 */
mark{background:rgba(247,209,23,.55);color:inherit;border-radius:3px;padding:0 1px}

/* 필터로 숨겨진 카드 */
.entry[hidden]{display:none}

/* 검색 결과 없음 */
.empty{
  display:none;text-align:center;padding:64px 20px;color:var(--text-dim);
}
.empty.is-visible{display:block}
.empty svg{margin:0 auto 14px;color:var(--line-strong)}
.empty p{font-size:15px}
.empty button{
  margin-top:16px;padding:9px 18px;border-radius:999px;
  background:var(--bg-alt);border:1px solid var(--line-strong);
  font-size:13.5px;font-weight:700;color:var(--brand-strong);cursor:pointer;
}

/* ---------- 반응형 ---------- */
@media (max-width:560px){
  .entry{padding:16px 18px}
  .group__head{border-bottom-width:1px}
}