/* IST Styles v3.1 */
/* ===== IST Integrated — V202 Brand Redesign ===== */
/* 36.9c brand system: Navy #10263d + Amber #f5ad1b + Blue #1688d8 */

:root {
  --ink: #10263d;
  --muted: #66788a;
  --line: #dfe5eb;
  --border: #e5e7eb;
  --card: #ffffff;
  --bg: #f4f7fa;
  --soft: #f4f7fa;
  --accent: #1688d8;
  --amber: #f5ad1b;
  --navy: #10263d;
  --red: #e6463a;
  --green: #197a52;
  --bad: #b42318;
  --radius: 16px;
  --shadow: 0 8px 30px rgba(16,38,61,.08);
}

* { box-sizing: border-box }
html { scroll-behavior: smooth; scroll-padding-top: 80px }
body { margin: 0; background: var(--bg); color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Noto Sans KR", "Apple SD Gothic Neo", Arial, sans-serif;
  line-height: 1.55; overflow-x: hidden }

/* ── TOPBAR ── */
.topbar {
  height: 72px; background: rgba(16,38,61,.97); backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.08);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 clamp(16px,4vw,60px);
  position: sticky; top: 0; z-index: 20;
  box-shadow: 0 4px 20px rgba(16,38,61,.25);
}
.brand { display: flex; gap: 12px; align-items: center; cursor: pointer; min-width: 0 }
.brand-logo-wrap {
  display: flex; align-items: center; gap: 10px;
  background: transparent; flex-shrink: 0;
}
.brand-logo { width: 100%; height: 100%; object-fit: cover }
.brand-copy { display: flex; flex-direction: column; line-height: 1.15 }
.brand-copy strong { font-size: 14px; font-weight: 800; color: #fff; letter-spacing: -.01em }
.brand-copy small { font-size: 10px; color: rgba(255,255,255,.5); font-weight: 600; letter-spacing: .04em }
.topbar-nav { display: flex; gap: 2px }
.topbar-nav button {
  border: 0; background: none; padding: 8px 12px; border-radius: 8px;
  font: inherit; font-size: 13px; cursor: pointer; color: rgba(255,255,255,.65);
  transition: all .15s;
}
.topbar-nav button:hover { color: #fff; background: rgba(255,255,255,.08) }
.topbar-nav button.active { color: var(--amber); font-weight: 700 }
.mobile-menu { display: none }
.mobile-nav { display: none }
.exam-badge {
  background: rgba(255,255,255,.12); border-radius: 999px;
  padding: 2px 8px; font-size: 11px; font-weight: 700; color: var(--amber);
}

/* ── MAIN ── */
main { padding-bottom: 60px }
main > *:not(.hero-brand):not(.journey-section):not(.trust-banner):not(.home-cta-strip):not(.city-hero) {
  max-width: 1200px; margin-left: auto; margin-right: auto;
}

/* ── HERO ── */
.hero-brand {
  position: relative; overflow: hidden;
  min-height: 70vh;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 0;
}
.hero-bg-img {
  position: absolute; inset: 0; z-index: 0;
  background-size: cover; background-position: center 30%;
  image-rendering: -webkit-optimize-contrast;
}
.hero-bg-img::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(13,31,51,.15) 0%,
    rgba(13,31,51,.08) 30%,
    rgba(13,31,51,.55) 65%,
    rgba(13,31,51,.92) 88%,
    #0d1f33 100%
  );
}
.hero-content {
  position: relative; z-index: 1;
  padding: clamp(40px,6vw,80px) clamp(20px,5vw,80px) clamp(52px,7vw,80px);
  max-width: 900px;
}
.hero-kicker {
  display: inline-block; font-size: 11px; letter-spacing: .16em; font-weight: 800;
  color: var(--amber); margin-bottom: 18px;
}
.hero-content h1 {
  font-size: clamp(38px,5.5vw,72px); line-height: 1.08; margin: 0 0 20px;
  letter-spacing: -.03em; color: #fff; font-weight: 900;
}
.hero-content h1 em { font-style: normal; color: var(--amber) }
.hero-content p {
  font-size: clamp(15px,1.8vw,19px); color: rgba(255,255,255,.72);
  max-width: 560px; margin: 0 0 30px; line-height: 1.6;
}
.hero-actions {
  display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 36px;
}
.hero-cta {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--amber); color: var(--navy); border: 0;
  padding: 16px 28px; border-radius: 14px; font: inherit; font-size: 16px; font-weight: 800;
  cursor: pointer; transition: filter .15s; box-shadow: 0 8px 24px rgba(245,173,27,.35);
}
.hero-cta:hover { filter: brightness(1.07) }
.hero-cta-outline {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.12); color: #fff;
  border: 1.5px solid rgba(255,255,255,.28);
  padding: 15px 26px; border-radius: 14px; font: inherit; font-size: 16px; font-weight: 700;
  cursor: pointer; transition: background .15s; backdrop-filter: blur(6px);
}
.hero-cta-outline:hover { background: rgba(255,255,255,.2) }
.hero-points {
  display: flex; gap: 24px; flex-wrap: wrap;
}
.hero-point {
  display: flex; align-items: center; gap: 10px;
}
.hero-point-icon {
  width: 38px; height: 38px; border-radius: 10px;
  background: rgba(255,255,255,.1); display: grid; place-items: center;
  font-size: 17px; flex-shrink: 0; backdrop-filter: blur(4px);
}
.hero-point b { display: block; font-size: 13px; color: #fff; font-weight: 700 }
.hero-point small { display: block; font-size: 11px; color: rgba(255,255,255,.45) }

/* Hero stat pills (bottom right corner) */
.hero-stat-pills {
  position: absolute; bottom: clamp(52px,7vw,80px); right: clamp(20px,5vw,80px);
  display: flex; flex-direction: column; gap: 8px; z-index: 1; align-items: flex-end;
}
.stat-pill {
  background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.25);
  backdrop-filter: blur(12px); border-radius: 999px;
  padding: 10px 20px; color: #fff; font-size: 13px; font-weight: 600;
  white-space: nowrap;
}
.stat-pill b { color: var(--amber); font-size: 17px; font-weight: 900 }

/* remove old image-side */
.hero-image-side { display: none }
.hero-img-wrap   { display: none }


/* ── JOURNEY SECTION ── */
.journey-section {
  background: linear-gradient(135deg, #f0f7ff 0%, #f4f7fa 100%);
  padding: 56px clamp(16px,4vw,60px);
  border-top: 2px solid #c3daf5;
}
.journey-inner {
  max-width: 1200px; margin: 0 auto;
}
.journey-inner .eyebrow { margin-bottom: 6px }
.journey-inner h2 { font-size: 26px; margin: 6px 0 8px; letter-spacing: -.02em }
.journey-inner > p { color: var(--muted); font-size: 15px; margin: 0 0 32px }
.journey-steps {
  display: flex; align-items: stretch; justify-content: center; gap: 0;
}
.journey-card {
  flex: 1; max-width: 280px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 28px 24px; text-align: center; cursor: pointer;
  transition: box-shadow .15s, transform .15s;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.journey-card:hover { box-shadow: 0 8px 28px rgba(16,38,61,.12); transform: translateY(-3px) }
.journey-num {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--accent); color: #fff;
  font-size: 14px; font-weight: 800;
  display: grid; place-items: center;
}
.journey-icon {
  width: 56px; height: 56px; border-radius: 14px;
  background: #eef5fd; color: var(--accent);
  display: grid; place-items: center;
}
.journey-card h3 { font-size: 17px; margin: 4px 0 6px }
.journey-card p { font-size: 13px; color: var(--muted); margin: 0; line-height: 1.5 }
.journey-link {
  margin-top: auto; padding-top: 8px;
  font-size: 13px; font-weight: 700; color: var(--accent);
}
.journey-connector {
  display: flex; align-items: center; padding: 0 12px; flex-shrink: 0;
}
@media(max-width: 700px) {
  .journey-steps { flex-direction: column; align-items: center; gap: 12px }
  .journey-connector { transform: rotate(90deg); padding: 4px 0 }
  .journey-card { max-width: 100% }
}

/* ── SECTION SHELL ── */
.section-shell { padding: 64px clamp(16px,4vw,60px) }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 28px }
.section-head > div h2 { margin: 6px 0 0; font-size: 26px; letter-spacing: -.02em }
.eyebrow { font-size: 11px; letter-spacing: .14em; font-weight: 800; color: var(--accent) }

/* ── QUICK START CARDS ── */
.home-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; margin-top: 16px }
.home-card {
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 24px; background: var(--card); cursor: pointer;
  transition: box-shadow .15s, transform .15s;
}
.home-card:hover { box-shadow: 0 8px 28px rgba(16,38,61,.12); transform: translateY(-2px) }
.home-card .icon { font-size: 30px; margin-bottom: 14px }
.home-card h3 { font-size: 17px; margin: 0 0 8px; color: var(--ink) }
.home-card p { font-size: 13px; color: var(--muted); margin: 0 0 18px }
.stat-badge { display: inline-flex; gap: 18px; flex-wrap: wrap }
.stat-badge span { font-size: 13px; color: var(--muted) }
.stat-badge b { color: var(--ink) }

/* ── FEATURE CARDS (HOME) ── */
.feature-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 0 }
.feat-card {
  border-radius: var(--radius); padding: 22px 20px; cursor: pointer;
  display: flex; align-items: center; gap: 16px;
  transition: transform .15s, box-shadow .15s;
}
.feat-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(16,38,61,.14) }
.feat-card.blue { background: #eef5fd; border: 1px solid #c3daf5 }
.feat-card.amber { background: #fff8e6; border: 1px solid #f5d98c }
.feat-card.red { background: #fdf0ef; border: 1px solid #f0bab6 }
.feat-card.green { background: #eaf5ee; border: 1px solid #b2dfc1 }
.feat-icon {
  width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center;
  font-size: 20px; font-weight: 800; flex-shrink: 0;
}
.feat-card.blue .feat-icon { background: #1688d8; color: #fff }
.feat-card.amber .feat-icon { background: #f5ad1b; color: #10263d }
.feat-card.red .feat-icon { background: #e6463a; color: #fff }
.feat-card.green .feat-icon { background: #197a52; color: #fff }
.feat-card h3 { font-size: 14px; margin: 0 0 4px }
.feat-card p { font-size: 12px; color: var(--muted); margin: 0 }
.home-arrow { margin-left: auto; font-size: 20px; color: var(--muted); flex-shrink: 0 }


/* ── PANEL (generic page wrapper) ── */
.panel {
  background: var(--card); margin: 18px clamp(12px,3vw,30px);
  padding: 28px; border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow);
}

/* ── FORMS ── */
input, select {
  height: 46px; border: 1px solid #d7dae0; border-radius: 10px;
  padding: 0 13px; background: #fff; font: inherit;
  min-width: 0; max-width: 100%; text-overflow: ellipsis;
}
input:focus, select:focus { outline: 2px solid #c3daf5; border-color: var(--accent) }
.filters { display: grid; grid-template-columns: 1fr 140px 140px 150px 150px 130px; gap: 8px }
.count { margin: 18px 0 10px; color: var(--muted); font-size: 13px }

/* ── BUTTONS ── */
button {
  border: 0; border-radius: 9px; padding: 10px 13px;
  font: inherit; font-size: 13px; cursor: pointer;
  background: var(--accent); color: #fff;
}
button.secondary { background: #eef0f3; color: #344054 }
button.primary { background: var(--accent); color: #fff }
button.primary:hover { background: #1376c0 }
button.small { padding: 7px 11px; font-size: 12px }
button.wide { width: 100% }
button.back { background: none; color: var(--accent); padding: 6px 0; font-size: 13px }
button[disabled] { opacity: .4; cursor: not-allowed }
.text-btn { background: none; color: var(--accent); text-decoration: underline; padding: 4px }

/* ── NOTICE ── */
.plan, .notice { background: #f2f5ff; border-radius: 10px; padding: 10px 13px; color: #344054; font-size: 13px }
.notice.warn { background: #fff8eb; color: #7a4700 }
.notice.success { background: #f0fdf4; color: #155724 }

/* ── SCHOOL GRID ── */
.school-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px }
.school {
  border: 1px solid var(--line); border-radius: 14px;
  padding: 18px; background: #fff; cursor: pointer; transition: box-shadow .15s;
}
.school:hover { box-shadow: 0 4px 16px rgba(20,30,50,.1) }
.school h3 { font-size: 17px; margin: 0 0 8px }
.school .meta { font-size: 12px; color: var(--muted); line-height: 1.7 }
.tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 }
.tag { font-size: 11px; background: #f2f4f7; border-radius: 999px; padding: 5px 8px }
.actions { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap }
button.selected, .option.selected { outline: 2px solid var(--accent) }

/* ── TABLE ── */
.table-wrap { overflow: auto; margin-top: 16px }
table { border-collapse: collapse; width: 100%; min-width: 760px }
th, td { text-align: left; padding: 12px; border-bottom: 1px solid var(--line); font-size: 13px; vertical-align: top }
th { background: #fafafa; color: #475467 }

/* ── COMPARE ── */
.compare-box { min-height: 120px; border: 1px dashed #ccd1d9; border-radius: 12px; padding: 18px; color: var(--muted) }
.compare-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px }
.compare-card { border: 1px solid var(--line); padding: 16px; border-radius: 12px; background: #fafbfc }
.compare-card p { color: var(--muted); font-size: 12px }
.compare-tuition { display: grid; gap: 6px }
.compare-tuition > div { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; border-top: 1px solid var(--line); padding: 8px 0 }
.compare-tuition b { text-align: right }
.compare-tuition small { grid-column: 1/-1; color: var(--muted) }
.tuition-cards { display: none }

/* ── EXAM GRID ── */
.exam-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 16px }
.exam-card {
  border: 1px solid var(--line); border-radius: 14px; padding: 20px;
  background: #fff; cursor: pointer; transition: box-shadow .15s;
}
.exam-card:hover { box-shadow: 0 4px 20px rgba(20,30,50,.1) }
.exam-card .tag { display: inline-block; font-size: 11px; background: #eef0f3; border-radius: 999px; padding: 3px 9px; margin-bottom: 10px }
.exam-card h3 { font-size: 18px; margin: 0 0 8px }
.exam-card p { font-size: 13px; color: var(--muted); margin: 0 0 12px }
.card-foot { display: flex; justify-content: space-between; font-size: 12px; color: var(--accent); font-weight: 600 }

/* ── EXAM DETAIL ── */
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px }
.detail-card { border: 1px solid var(--line); border-radius: 14px; padding: 22px; background: #fff }
.level-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin: 16px 0 }
.level-option {
  background: #f2f4f7; color: var(--ink); text-align: left;
  padding: 12px 14px; border-radius: 10px;
}
.level-option.selected { background: var(--accent); color: #fff }
.level-option b { display: block; font-size: 11px; opacity: .7; margin-bottom: 2px }
.level-option span { font-size: 13px; font-weight: 600 }
.domain-list { display: grid; gap: 10px }
.domain-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 13px }
.compact-notice { margin-top: 16px!important; font-size: 12px!important }

/* ── TEST SHELL ── */
.test-shell { padding: 24px clamp(16px,4vw,52px); max-width: 820px; margin: 0 auto }
.test-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px }
.test-head h1 { margin: 4px 0; font-size: 22px }
.timer-box { text-align: center; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 10px 18px; min-width: 90px }
.timer-box span { display: block; font-size: 11px; color: var(--muted); margin-bottom: 2px }
.timer-box b { font-size: 24px; font-weight: 800; letter-spacing: .04em }
.progress { height: 5px; background: #e6e8ec; border-radius: 999px; overflow: hidden; margin-bottom: 22px }
.progress span { display: block; height: 100%; background: var(--accent); border-radius: 999px; transition: width .3s }
.question-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 28px }
.q-meta { font-size: 12px; color: var(--muted); margin-bottom: 14px }
.question-card h2 { font-size: 20px; line-height: 1.5; margin: 0 0 22px }
.passage-head { font-weight: 700; color: #0f172a; margin: 6px 0 8px; font-size: 15px }
.passage { background: #f8f9fb; border-left: 3px solid var(--accent); border-radius: 0 10px 10px 0; padding: 14px 18px; margin: 12px 0 18px; font-size: 14px; line-height: 1.7; max-height: 260px; overflow-y: auto }
.options { display: grid; gap: 10px }
.option {
  background: #f8f9fb; color: var(--ink); text-align: left;
  padding: 14px 18px; border-radius: 12px; display: flex; align-items: center; gap: 14px;
  transition: background .12s; border: 1px solid transparent;
}
.option:hover { background: #eef0f3 }
.option.selected { background: #eef4ff; outline: 2px solid var(--accent) }
.option span {
  width: 28px; height: 28px; border-radius: 50%;
  background: #e2e8ff; color: var(--accent); font-weight: 800; font-size: 13px;
  display: grid; place-items: center; flex-shrink: 0;
}
.option.selected span { background: var(--accent); color: #fff }
.test-nav { display: flex; justify-content: space-between; margin-top: 22px; gap: 10px }

/* ── RESULT ── */
.result-hero {
  display: flex; align-items: center; gap: 28px;
  background: linear-gradient(135deg, #eef4ff, #e8fef5);
  border-radius: 16px; padding: 28px; margin: 16px 0;
}
.score { font-size: 72px; font-weight: 900; color: var(--accent); line-height: 1 }
.result-hero h2 { margin: 0 0 6px; font-size: 22px }
.result-hero p { margin: 0; color: var(--muted); font-size: 14px }
.report-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin: 16px 0 }
.report-metrics div { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px; text-align: center }
.report-metrics span { display: block; font-size: 12px; color: var(--muted); margin-bottom: 4px }
.report-metrics b { font-size: 26px; font-weight: 800 }
.review { display: grid; gap: 14px }
.review h2 { font-size: 20px; margin: 20px 0 0 }
.review-item { border: 1px solid var(--line); border-radius: 12px; padding: 18px; background: #fff }
.review-item.ok { border-color: #a9efc5 }
.review-item.miss { border-color: #fdb8b0 }
.review-item h3 { font-size: 15px; line-height: 1.5; margin: 6px 0 10px }
.review-item p { font-size: 13px; margin: 0 0 10px }
.explanation, .korean-explanation { font-size: 13px; background: #f8f9fb; border-radius: 8px; padding: 12px 14px; margin-top: 8px; line-height: 1.7 }

/* ── WRONG BOOK ── */
.wrongbook { gap: 14px }

/* ── HISTORY ── */
.history-list { display: grid; gap: 12px }
.history-row { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px; display: flex; align-items: center; gap: 16px }
.history-row > div:first-child { flex: 1 }
.history-row h3 { margin: 0 0 4px; font-size: 15px }
.history-row p { margin: 0; font-size: 12px; color: var(--muted) }
.history-score { font-size: 28px; font-weight: 800; color: var(--accent) }

/* ── WIZARD ── */
.wizard { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 22px; display: grid; gap: 14px }
.wizard label { display: grid; gap: 6px; font-size: 14px; font-weight: 600 }
.page-head { padding: 28px clamp(16px,4vw,52px) 14px; max-width: 820px; margin: 0 auto }
.page-head.compact { padding-bottom: 0 }
.page-head h1 { margin: 6px 0; font-size: 28px }
.page-head p { margin: 4px 0; color: var(--muted); font-size: 15px }

/* ── SCORE PILLS ── */
.score-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700 }
.score-pill.ok { background: #e9faf0; color: #0d6832 }
.score-pill.miss { background: #fff0ee; color: #b42318 }

/* ── FOOTER ── */
footer { text-align: center; color: #98a2b3; font-size: 12px; padding: 40px 18px }

/* ── RESPONSIVE ── */
@media(max-width: 900px) {
  .exam-grid, .home-grid { grid-template-columns: 1fr 1fr }
  .feature-row { grid-template-columns: 1fr 1fr }
  .hero-brand { grid-template-columns: 1fr }
  .detail-grid { grid-template-columns: 1fr 1fr }
  .report-metrics { grid-template-columns: repeat(2,1fr) }
  .result-hero { flex-direction: column; gap: 16px }
  .content-cards { grid-template-columns: 1fr 1fr }
}
@media(max-width: 800px) {
  .topbar { height: auto; min-height: 60px; gap: 8px }
  .topbar-nav { display: none }
  .brand-logo-wrap small { display: none }
  .brand-logo-wrap { flex-shrink: 1; min-width: 0 }
  .topbar-auth { gap: 4px }
  .btn-login, .btn-signup { padding: 6px 10px; font-size: 12px }
  .lang-toggle-btn { font-size: 11px !important; padding: 3px 7px !important; margin-right: 2px !important }
  .mobile-menu { display: block; background: none; color: #fff; font-size: 20px; padding: 8px }
  .mobile-nav {
    display: flex; position: sticky; top: 60px; z-index: 9;
    background: #fff; border-bottom: 1px solid var(--line);
    padding: 10px 18px; flex-wrap: wrap; gap: 10px;
  }
  .mobile-nav[hidden] { display: none !important }
  /* 메뉴 버튼들이 #mobileNavLinks 안에 들어가 있어 부모 gap이 적용되지 않던 문제 */
  #mobileNavLinks { display: flex; flex-wrap: wrap; gap: 8px; width: 100% }
  #mobileNavLinks button, #mobileNavLinks a {
    margin: 0; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--line, #e2e8f0);
    background: #f8fafc; color: #0f172a; font-size: 14px; font-weight: 600; line-height: 1.2; box-shadow: none;
  }
  #mobileNavLinks button.active { background: #0f172a; border-color: #0f172a; color: #fff }
  .filters { grid-template-columns: 1fr 1fr 1fr; }
  .filters input[type="search"] { grid-column: 1 / -1; }
  .school-grid, .exam-grid, .home-grid { grid-template-columns: 1fr 1fr }
  .compare-grid, .level-grid { grid-template-columns: 1fr }
  .report-metrics { grid-template-columns: repeat(2,1fr) }
  .content-cards { grid-template-columns: 1fr }
}
@media(max-width: 520px) {
  .filters { grid-template-columns: 1fr 1fr; gap: 8px; }
  .filters input[type="search"] { grid-column: 1 / -1; }
  .curr-pill { font-size: 10px; padding: 4px 10px; }
  .exam-filter-row { flex-wrap: wrap; }
  .school-grid, .exam-grid, .home-grid, .compare-grid, .level-grid { grid-template-columns: 1fr }
  .panel { margin: 12px 8px; padding: 17px }
  .plan { display: none }
  .table-wrap.tuition-list-wrap { display: none }
  .table-wrap table { font-size: 12px; min-width: 0 }
  .table-wrap th, .table-wrap td { padding: 8px 6px }
  .table-wrap td b, .table-wrap td:nth-child(2) { white-space: nowrap }
  .tuition-cards { display: grid; gap: 10px; margin-top: 16px }
  .tuition-card { border: 1px solid var(--line); border-radius: 14px; padding: 14px; background: #fff; display: grid; gap: 6px }
  .tuition-card strong { font-size: 15px }
  .tuition-card span, .tuition-card small { color: var(--muted); font-size: 12px }
  .tuition-card b { font-size: 20px }
  .section-head { align-items: flex-start }
  .score { font-size: 52px }
  .report-metrics { grid-template-columns: repeat(2,1fr) }
  .detail-grid { grid-template-columns: 1fr }
  .feature-row { grid-template-columns: 1fr }
}

/* ═══════════════════════════════════════════════════
   AUTH & MYPAGE — 로그인 / 마이페이지
   ═══════════════════════════════════════════════════ */

/* ── Auth modal overlay ── */
.auth-overlay {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(16,38,61,.55); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
}
.auth-modal {
  background: #fff; border-radius: 24px;
  width: 100%; max-width: 460px;
  box-shadow: 0 32px 80px rgba(16,38,61,.22);
  overflow: hidden; position: relative;
}
.auth-modal-head {
  background: linear-gradient(135deg,#0d1f33,#10263d);
  padding: 32px 32px 24px;
  text-align: center;
}
.auth-modal-logo {
  width: 56px; height: 40px; border-radius: 10px;
  background: #fff; overflow: hidden; margin: 0 auto 14px; display: flex;
  align-items: center; justify-content: center;
}
.auth-modal-logo img { width: 100%; height: 100%; object-fit: cover }
.auth-modal-head h2 { margin: 0 0 6px; color: #fff; font-size: 22px }
.auth-modal-head p  { margin: 0; color: rgba(255,255,255,.55); font-size: 13px }
.auth-tabs {
  display: flex; border-bottom: 1px solid var(--line);
}
.auth-tab {
  flex: 1; padding: 14px; text-align: center; font-size: 14px; font-weight: 700;
  cursor: pointer; border: 0; background: none; color: var(--muted);
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color .15s, border-color .15s;
}
.auth-tab.active { color: var(--accent); border-bottom-color: var(--accent) }
.auth-body { padding: 28px 32px 32px }
.auth-field {
  display: grid; gap: 6px; margin-bottom: 14px;
}
.auth-field label { font-size: 13px; font-weight: 600; color: var(--ink) }
.auth-field input {
  width: 100%; height: 48px; border: 1.5px solid var(--line);
  border-radius: 12px; padding: 0 14px; font: inherit; font-size: 15px;
  transition: border-color .15s;
}
.auth-field input:focus { border-color: var(--accent); outline: none }
.auth-btn {
  width: 100%; height: 50px; border-radius: 14px; border: 0;
  background: var(--accent); color: #fff; font: inherit;
  font-size: 16px; font-weight: 800; cursor: pointer; margin-top: 6px;
  transition: filter .15s;
}
.auth-btn:hover { filter: brightness(1.06) }
.auth-btn.amber { background: var(--amber); color: var(--navy) }
.auth-error {
  background: #fff0ee; color: var(--bad); border-radius: 10px;
  padding: 10px 14px; font-size: 13px; margin-bottom: 12px;
  display: none;
}
.auth-divider { text-align: center; color: var(--muted); font-size: 12px; margin: 14px 0 }
.auth-close {
  position: absolute; top: 16px; right: 16px; width: 32px; height: 32px;
  border-radius: 50%; background: rgba(255,255,255,.15); color: #fff; border: 0;
  font-size: 18px; cursor: pointer; display: grid; place-items: center;
  transition: background .15s;
}
.auth-close:hover { background: rgba(255,255,255,.25) }

/* ── Topbar auth buttons ── */
.topbar-auth { display: flex; align-items: center; gap: 8px }
.btn-login {
  background: rgba(255,255,255,.1); color: rgba(255,255,255,.85); border: 0;
  padding: 8px 14px; border-radius: 9px; font: inherit; font-size: 13px;
  cursor: pointer; transition: background .15s; white-space: nowrap;
}
.btn-login:hover { background: rgba(255,255,255,.18) }
.btn-signup {
  background: var(--amber); color: var(--navy); border: 0;
  padding: 8px 14px; border-radius: 9px; font: inherit; font-size: 13px;
  font-weight: 800; cursor: pointer; transition: filter .15s; white-space: nowrap;
}
.btn-signup:hover { filter: brightness(1.07) }
.user-chip {
  display: flex; align-items: center; gap: 9px; cursor: pointer;
  background: rgba(255,255,255,.1); border-radius: 999px;
  padding: 5px 12px 5px 5px; transition: background .15s;
}
.user-chip:hover { background: rgba(255,255,255,.18) }
.user-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--amber); color: var(--navy);
  font-size: 14px; font-weight: 900; display: grid; place-items: center; flex-shrink: 0;
}
.user-chip span { font-size: 13px; color: #fff; font-weight: 600 }

/* ── My Page ── */
.mypage-hero {
  background: linear-gradient(135deg,#0d1f33,#10263d);
  padding: clamp(40px,6vw,72px) clamp(18px,5vw,64px) clamp(36px,5vw,60px);
  display: grid; grid-template-columns: auto 1fr; gap: 28px; align-items: center;
}
.mypage-avatar-lg {
  width: 88px; height: 88px; border-radius: 50%;
  background: var(--amber); color: var(--navy);
  font-size: 36px; font-weight: 900; display: grid; place-items: center;
  border: 4px solid rgba(255,255,255,.15); flex-shrink: 0;
}
.mypage-hero-info h1 { margin: 0 0 6px; color: #fff; font-size: 26px }
.mypage-hero-info p  { margin: 0 0 16px; color: rgba(255,255,255,.55); font-size: 14px }
.mypage-hero-pills   { display: flex; gap: 10px; flex-wrap: wrap }
.mypage-pill {
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px; padding: 6px 14px; color: #fff; font-size: 12px; font-weight: 600;
}
.mypage-pill b { color: var(--amber) }

.mypage-tabs {
  display: flex; gap: 0; border-bottom: 1px solid var(--line);
  background: #fff; padding: 0 clamp(18px,5vw,64px); overflow-x: auto;
  position: sticky; top: 72px; z-index: 8;
}
.mypage-tab {
  padding: 14px 18px; font-size: 14px; font-weight: 700; color: var(--muted);
  cursor: pointer; border: 0; background: none; white-space: nowrap;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color .15s, border-color .15s;
}
.mypage-tab.active { color: var(--accent); border-bottom-color: var(--accent) }
.mypage-body { padding: clamp(16px,3vw,32px) clamp(16px,4vw,60px) 60px }

.mypage-kpis {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 28px;
}
.kpi-card {
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  padding: 20px; text-align: center;
}
.kpi-card .kpi-label { font-size: 12px; color: var(--muted); margin-bottom: 6px }
.kpi-card .kpi-val { font-size: 32px; font-weight: 900; color: var(--ink) }
.kpi-card .kpi-sub { font-size: 11px; color: var(--muted); margin-top: 4px }

/* score trend mini-chart */
.trend-bar-row {
  display: flex; align-items: flex-end; gap: 5px;
  height: 80px; margin: 12px 0;
}
.trend-bar {
  flex: 1; border-radius: 5px 5px 0 0;
  background: var(--accent); opacity: .75;
  min-height: 4px; transition: height .3s;
  position: relative; cursor: default;
}
.trend-bar:hover { opacity: 1 }
.trend-bar::after {
  content: attr(data-score);
  position: absolute; bottom: calc(100% + 4px); left: 50%;
  transform: translateX(-50%);
  font-size: 10px; color: var(--ink); font-weight: 700; white-space: nowrap;
}

/* child profiles */
.child-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-bottom: 20px }
.child-card {
  border: 1.5px solid var(--line); border-radius: 16px; padding: 18px;
  background: #fff; cursor: pointer; transition: box-shadow .15s, border-color .15s;
  position: relative;
}
.child-card.active-child { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(22,136,216,.12) }
.child-card:hover { box-shadow: 0 4px 16px rgba(16,38,61,.1) }
.child-initial {
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--accent); color: #fff;
  font-size: 20px; font-weight: 900; display: grid; place-items: center;
  margin-bottom: 12px;
}
.child-card h3 { margin: 0 0 4px; font-size: 16px }
.child-card p  { margin: 0; font-size: 12px; color: var(--muted) }
.child-add {
  border: 2px dashed var(--line); background: none; color: var(--muted);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; min-height: 130px;
}
.child-add:hover { border-color: var(--accent); color: var(--accent) }
.child-add span { font-size: 28px }

/* settings form */
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px }
.settings-section { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 24px }
.settings-section h3 { margin: 0 0 18px; font-size: 17px }
.form-row { display: grid; gap: 6px; margin-bottom: 14px }
.form-row label { font-size: 13px; font-weight: 600 }
.form-row input, .form-row select {
  width: 100%; height: 44px; border: 1.5px solid var(--line);
  border-radius: 10px; padding: 0 12px; font: inherit;
}
.form-row input:focus, .form-row select:focus { border-color: var(--accent); outline: none }
.save-btn {
  background: var(--accent); color: #fff; border: 0;
  padding: 11px 22px; border-radius: 10px; font: inherit; font-size: 14px;
  font-weight: 700; cursor: pointer; margin-top: 4px;
}
.save-btn:hover { filter: brightness(1.07) }
.danger-btn {
  background: #fff; color: var(--bad); border: 1.5px solid #fdb8b0;
  padding: 10px 20px; border-radius: 10px; font: inherit; font-size: 13px;
  font-weight: 700; cursor: pointer;
}
.danger-btn:hover { background: #fff0ee }
.saved-toast {
  display: inline-block; background: #e9faf0; color: #0d6832;
  border-radius: 8px; padding: 6px 12px; font-size: 12px;
  font-weight: 600; margin-left: 10px; opacity: 0; transition: opacity .4s;
}
.saved-toast.show { opacity: 1 }

/* candidate school list in mypage */
.my-school-list { display: grid; gap: 10px }
.my-school-row {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 16px 20px; display: flex; align-items: center; gap: 16px;
}
.my-school-row > div:first-child { flex: 1 }
.my-school-row h3 { margin: 0 0 4px; font-size: 15px }
.my-school-row p  { margin: 0; font-size: 12px; color: var(--muted) }

/* wrong-book in mypage (compact) */
.wb-compact { display: grid; gap: 10px }
.wb-item {
  background: #fff; border: 1px solid #fdb8b0; border-left: 4px solid var(--red);
  border-radius: 12px; padding: 14px 16px;
}
.wb-item .wb-exam { font-size: 11px; font-weight: 700; color: var(--red); margin-bottom: 4px }
.wb-item .wb-q    { font-size: 14px; font-weight: 600; margin: 0 0 8px }
.wb-item .wb-ans  { font-size: 12px; color: var(--muted) }

/* responsive */
@media(max-width: 780px) {
  .mypage-kpis        { grid-template-columns: repeat(2,1fr) }
  .child-grid         { grid-template-columns: 1fr 1fr }
  .settings-grid      { grid-template-columns: 1fr }
  .mypage-hero        { grid-template-columns: 1fr; text-align: center }
  .mypage-hero-pills  { justify-content: center }
}
@media(max-width: 480px) {
  .auth-body { padding: 20px 18px 24px }
  .mypage-kpis { grid-template-columns: 1fr 1fr }
  .child-grid  { grid-template-columns: 1fr }
}

/* ═══════════════════════════════════════════════════
   PARTNER SCHOOLS & NAVER BLOG
   ═══════════════════════════════════════════════════ */

/* Partner badge */
.partner-badge {
  display: inline-block; font-size: 10px; font-weight: 800;
  background: #03c75a; color: #fff; border-radius: 999px;
  padding: 2px 8px; letter-spacing: .03em; flex-shrink: 0;
  margin-top: 2px;
}

/* Partner school card highlight */
.school.partner-school {
  border-color: #b8ead0;
  background: linear-gradient(135deg,#fff,#f0fbf5);
}
.school.partner-school:hover { box-shadow: 0 4px 16px rgba(3,199,90,.12) }

/* Naver Blog button */
.school-web-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 18px; border-radius: 10px;
  background: linear-gradient(135deg,#2563eb,#1d4ed8);
  color: #fff; font-size: 14px; font-weight: 700;
  text-decoration: none; cursor: pointer;
  border: 0; transition: filter .15s, transform .15s;
  box-shadow: 0 4px 14px rgba(37,99,235,.25);
}
.school-web-btn:hover { filter: brightness(1.1); transform: translateY(-1px) }
.school-web-btn svg { flex-shrink: 0 }
.school-web-chip {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 8px;
  background: #2563eb; color: #fff; text-decoration: none;
  transition: filter .15s, transform .15s;
}
.school-web-chip:hover { filter: brightness(1.15); transform: scale(1.08) }

.naver-blog-btn {
  display: inline-flex; align-items: center; gap: 5px;
  background: #03c75a; color: #fff; border-radius: 8px;
  text-decoration: none; font-weight: 700; cursor: pointer;
  border: 0; transition: filter .15s;
}
.naver-blog-btn:hover { filter: brightness(1.08) }
.naver-blog-btn img {
  width: 14px; height: 14px; border-radius: 3px; flex-shrink: 0;
}
.naver-blog-btn.small { font-size: 11px; padding: 5px 10px }
.naver-blog-btn.large {
  font-size: 14px; padding: 10px 18px; border-radius: 10px;
  background: linear-gradient(135deg,#03c75a,#02a74a);
  box-shadow: 0 4px 14px rgba(3,199,90,.25);
}
.naver-blog-btn.large img { width: 18px; height: 18px }

/* Partner filter chip */
.filter-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px }
.filter-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 999px; font-size: 12px; font-weight: 700;
  border: 1.5px solid var(--line); background: #fff; cursor: pointer;
  transition: all .15s;
}
.filter-chip:hover { border-color: var(--accent); color: var(--accent) }
.filter-chip.active { background: var(--accent); color: #fff; border-color: var(--accent) }
.filter-chip.naver { border-color: #03c75a; color: #03c75a }
.filter-chip.naver.active { background: #03c75a; color: #fff }

/* ═══════════════════════════════════════════════════
   EXAM MATCHING — 학교-시험 매칭
   ═══════════════════════════════════════════════════ */

/* School card — exam chips */
.school-meta-row {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
  margin-bottom: 8px; font-size: 13px; color: var(--muted);
}
.curr-pill {
  display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: .01em;
  padding: 3px 10px; border-radius: 999px; color: #fff; line-height: 1.3;
  white-space: nowrap;
}
.curr-british   { background: #1e40af }
.curr-american  { background: #991b1b }
.curr-ib        { background: #166534 }
.curr-australian{ background: #92400e }
.curr-canadian  { background: #7c2d12 }
.curr-french    { background: #4338ca }
.curr-german    { background: #374151 }
.curr-intl      { background: #6b21a8 }
.school-exam-chips {
  display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0 10px;
}
.exam-chip {
  font-size: 10px; font-weight: 800; padding: 3px 8px;
  border-radius: 999px; letter-spacing: .02em;
}
.exam-chip-cat4   { background: #dbeafe; color: #1d4ed8 }
.exam-chip-ukiset { background: #e0e7ff; color: #4338ca }
.exam-chip-isee   { background: #fee2e2; color: #b91c1c }
.exam-chip-ssat   { background: #fef3c7; color: #b45309 }
.exam-chip-map    { background: #dcfce7; color: #166534 }
.exam-chip-wida   { background: #f3e8ff; color: #7e22ce }

/* Exam match panel */
.exam-match-panel { margin: 0; background: var(--card) }
.curriculum-badge {
  display: inline-block; background: var(--navy); color: #fff;
  border-radius: 10px; padding: 6px 14px; font-size: 12px; font-weight: 700;
  white-space: nowrap; flex-shrink: 0;
}
.exam-match-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
}
.exam-match-card {
  border: 1.5px solid var(--line); border-radius: 16px; padding: 20px;
  background: #fafbfc; cursor: pointer;
  transition: box-shadow .15s, transform .15s, border-color .15s;
  display: flex; flex-direction: column; gap: 10px;
}
.exam-match-card:hover {
  box-shadow: 0 6px 24px rgba(16,38,61,.10);
  transform: translateY(-2px); border-color: var(--accent);
}
.exam-match-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.exam-match-label {
  font-size: 16px; font-weight: 900; letter-spacing: -.01em;
}
.exam-color-blue   { color: #1d4ed8 }
.exam-color-navy   { color: #4338ca }
.exam-color-red    { color: #b91c1c }
.exam-color-amber  { color: #b45309 }
.exam-color-green  { color: #166534 }
.exam-color-purple { color: #7e22ce }

.exam-match-tag {
  font-size: 11px; background: #f2f4f7; border-radius: 999px;
  padding: 3px 9px; color: var(--muted); font-weight: 600; flex-shrink: 0;
}
.exam-match-why {
  font-size: 13px; color: var(--muted); line-height: 1.6; margin: 0; flex: 1;
}
.exam-match-foot {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 12px; color: var(--muted); margin-top: 4px;
}

/* Exam filter in school search */
.exam-filter-row {
  display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px;
}
.exam-filter-btn {
  font-size: 11px; font-weight: 700; padding: 5px 11px; border-radius: 999px;
  border: 1.5px solid var(--line); background: #fff; cursor: pointer;
  color: var(--ink);
  transition: all .15s;
}
.exam-filter-btn:hover  { border-color: var(--accent); color: var(--accent) }
.exam-filter-btn.active { background: var(--accent); color: #fff; border-color: var(--accent) }
.exam-filter-btn.cat4   { border-color: #93c5fd }
.exam-filter-btn.cat4.active   { background: #1d4ed8; border-color: #1d4ed8 }
.exam-filter-btn.ukiset { border-color: #a5b4fc }
.exam-filter-btn.ukiset.active { background: #4338ca; border-color: #4338ca }
.exam-filter-btn.isee   { border-color: #fca5a5 }
.exam-filter-btn.isee.active   { background: #b91c1c; border-color: #b91c1c }
.exam-filter-btn.ssat   { border-color: #fcd34d }
.exam-filter-btn.ssat.active   { background: #b45309; border-color: #b45309 }
.exam-filter-btn.map    { border-color: #86efac }
.exam-filter-btn.map.active    { background: #166534; border-color: #166534 }
.exam-filter-btn.wida   { border-color: #d8b4fe }
.exam-filter-btn.wida.active   { background: #7e22ce; border-color: #7e22ce }

@media(max-width: 600px) {
  .exam-match-grid { grid-template-columns: 1fr }
  .curriculum-badge { font-size: 11px; padding: 5px 10px; white-space: normal; flex-shrink: 1; max-width: 100% }
}

/* ═══════════════════════════════════════════════════
   FINDER — 학교-시험 매처
   ═══════════════════════════════════════════════════ */
.finder-panel { margin: 0 clamp(12px,3vw,30px) }
.finder-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start;
}
.finder-section-title {
  font-size: 11px; font-weight: 800; letter-spacing: .12em;
  color: var(--accent); margin-bottom: 10px;
}
.finder-inputs { display: flex; flex-direction: column }

/* School search results dropdown */
.finder-school-list {
  border: 1.5px solid var(--line); border-radius: 12px; overflow: hidden;
  margin-top: 6px; max-height: 300px; overflow-y: auto;
}
.finder-school-item {
  padding: 12px 14px; cursor: pointer; border-bottom: 1px solid var(--line);
  transition: background .12s;
}
.finder-school-item:last-child { border-bottom: 0 }
.finder-school-item:hover { background: #f4f7fa }
.finder-school-item.selected { background: #eef5fd; border-left: 3px solid var(--accent) }
.finder-school-name { font-size: 14px; font-weight: 700; color: var(--ink) }
.finder-school-meta { font-size: 11px; color: var(--muted); margin-top: 2px }

/* System buttons */
.finder-system-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px }
.finder-sys-btn {
  background: #f4f7fa; color: var(--ink); border: 1.5px solid var(--line);
  border-radius: 10px; padding: 10px 12px; font-size: 12px; font-weight: 700;
  cursor: pointer; transition: all .15s; text-align: left;
}
.finder-sys-btn:hover { border-color: var(--accent); color: var(--accent) }
.finder-sys-btn.active { background: var(--accent); color: #fff; border-color: var(--accent) }

/* Result panel */
.finder-result {
  background: #f8fafc; border: 1.5px solid var(--line);
  border-radius: 16px; padding: 24px; position: sticky; top: 88px;
}
.finder-result-label {
  font-size: 10px; font-weight: 800; letter-spacing: .12em;
  color: var(--muted); margin-bottom: 6px; text-transform: uppercase;
}
.finder-result-name { margin: 0 0 4px; font-size: 20px }
.finder-result-meta { margin: 0 0 8px; font-size: 12px; color: var(--muted) }
.finder-result-school {
  padding-bottom: 16px; border-bottom: 1px solid var(--line); margin-bottom: 4px;
}

/* Exam cards in finder */
.finder-exams { display: flex; flex-direction: column; gap: 10px }
.finder-exam-card {
  background: #fff; border: 1.5px solid var(--line); border-radius: 12px;
  padding: 16px; cursor: pointer; transition: box-shadow .15s, border-color .15s;
}
.finder-exam-card:hover { box-shadow: 0 4px 16px rgba(16,38,61,.1); border-color: var(--accent) }
.finder-exam-top {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px;
}
.finder-level-pill {
  font-size: 11px; background: #eef5fd; color: var(--accent);
  border-radius: 999px; padding: 3px 10px; font-weight: 600;
}
.finder-level-pill b { color: var(--navy) }
.finder-exam-why { font-size: 12px; color: var(--muted); margin: 0 0 10px; line-height: 1.55 }
.finder-exam-foot {
  display: flex; align-items: center; justify-content: space-between;
}

@media(max-width: 700px) {
  .finder-grid { grid-template-columns: 1fr }
  .finder-result { position: static }
}

/* ── Hero responsive ── */
@media(max-width: 700px) {
  .hero-brand { min-height: 70vh }
  .hero-stat-pills {
    position: static; flex-direction: row; flex-wrap: wrap;
    padding: 0 clamp(20px,5vw,80px) clamp(40px,6vw,60px);
    gap: 8px;
  }
  .hero-content { padding-bottom: 24px }
}

/* ── Generic Modal ── */
.modal-backdrop {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(16,38,61,.6); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  padding: 16px; overflow-y: auto;
}
.modal-box {
  background: #fff; border-radius: 24px;
  width: 100%; max-width: 480px;
  box-shadow: 0 32px 80px rgba(16,38,61,.25);
  overflow: hidden; position: relative;
  padding: 28px 32px 32px;
  max-height: calc(100vh - 32px); overflow-y: auto;
}
.modal-close {
  position: absolute; top: 16px; right: 16px;
  background: #f2f4f7; border: none; width: 32px; height: 32px;
  border-radius: 50%; cursor: pointer; font-size: 14px; color: var(--muted);
  display: flex; align-items: center; justify-content: center;
}
.modal-close:hover { background: var(--line) }

/* ═══════════════════════════════════════════════════
   PRO MEMBERSHIP SYSTEM
   ═══════════════════════════════════════════════════ */

/* Pro blur — 무료 회원에게 금액 숨김 */
.pro-blur {
  display: inline-block;
  background: var(--line);
  color: transparent;
  border-radius: 4px;
  user-select: none;
  filter: blur(4px);
  min-width: 80px;
}

/* Pro 안내 배너 */
.pro-notice {
  background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px;
  padding: 10px 14px; font-size: 13px; color: #92400e; margin-bottom: 14px;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.text-link {
  background: none; border: none; color: var(--accent); font: inherit;
  font-size: 13px; font-weight: 700; cursor: pointer; padding: 0;
  text-decoration: underline;
}

/* Pro badge btn in tuition header */
.pro-badge-btn {
  background: #fef3c7; color: #92400e; border: 1px solid #fde68a;
  border-radius: 999px; padding: 4px 12px; font-size: 12px; font-weight: 700;
  cursor: pointer;
}
.pro-badge-btn:hover { background: #fde68a }

/* Topbar Pro indicators */
.topbar-pro-badge {
  background: linear-gradient(135deg,#f5ad1b,#e59a00);
  color: var(--navy); border-radius: 999px;
  padding: 5px 12px; font-size: 12px; font-weight: 800;
  cursor: pointer; user-select: none;
}
.topbar-upgrade-btn {
  background: rgba(245,173,27,.15); color: var(--amber);
  border: 1px solid rgba(245,173,27,.4);
  border-radius: 999px; padding: 5px 12px; font-size: 12px; font-weight: 700;
  cursor: pointer; transition: background .15s;
}
.topbar-upgrade-btn:hover { background: rgba(245,173,27,.25) }

/* ── Upgrade Modal ── */
.upgrade-modal {
  max-width: 740px !important;
  padding: 32px !important;
}
.upgrade-tier-grid {
  display: grid; grid-template-columns: 1fr 1.2fr; gap: 20px;
}
.upgrade-tier {
  border: 1.5px solid var(--line); border-radius: 16px;
  padding: 20px; position: relative;
}
.upgrade-tier.pro {
  border-color: var(--amber);
  background: linear-gradient(180deg, #fffdf5 0%, #fff 100%);
}
.tier-badge {
  position: absolute; top: -10px; left: 50%; transform: translateX(-50%);
  background: var(--amber); color: var(--navy); font-size: 10px; font-weight: 800;
  padding: 3px 12px; border-radius: 999px; letter-spacing: .08em;
}
.tier-name {
  font-size: 16px; font-weight: 800; color: var(--ink); margin-bottom: 6px;
}
.tier-price {
  font-size: 26px; font-weight: 900; color: var(--navy); margin-bottom: 16px;
}
.tier-price small { font-size: 13px; font-weight: 500; color: var(--muted) }
.tier-features {
  list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 7px;
}
.tier-features li { font-size: 13px; color: var(--ink) }
.tier-features li.locked { color: var(--muted) }

/* Plan selector inside Pro tier */
.upgrade-plans {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 16px;
}
.plan-btn {
  background: #f8fafc; border: 1.5px solid var(--line); border-radius: 12px;
  padding: 10px 12px; cursor: pointer; text-align: left;
  transition: border-color .15s, background .15s;
  display: flex; flex-direction: column; gap: 2px;
}
.plan-btn.selected { border-color: var(--amber); background: #fffdf5 }
.plan-label { font-size: 11px; color: var(--muted); font-weight: 600 }
.plan-price { font-size: 15px; font-weight: 800; color: var(--navy) }
.plan-price small { font-size: 11px; font-weight: 500 }
.plan-save { font-size: 10px; color: #059669; font-weight: 600 }

.hero-cta.wide { width: 100%; justify-content: center }

@media(max-width: 600px) {
  .upgrade-tier-grid { grid-template-columns: 1fr }
  .upgrade-modal { padding: 20px !important }
}

/* ── 입학 가능성 체크 ──────────────────────────────────────── */
.adm-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 24px;
}
.adm-field label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 6px;
}
.adm-field select {
  width: 100%;
  padding: 9px 12px;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  font-size: 13px;
  background: var(--bg);
  color: var(--text);
  appearance: none;
  cursor: pointer;
}
.adm-placeholder {
  text-align: center;
  padding: 48px 20px;
  color: var(--muted);
}
.adm-results-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 12px;
  color: var(--muted);
}
.adm-card {
  border: 1.5px solid var(--border);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 10px;
  background: var(--bg);
}
.adm-card.high { border-color: #16a34a30; }
.adm-card.mid  { border-color: #d9770630; }
.adm-card.low  { border-color: #dc262630; }
.adm-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
}
.adm-school-name { font-weight: 700; font-size: 14px; margin-bottom: 3px; }
.adm-school-loc  { font-size: 12px; color: var(--muted); }
.adm-chance-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 12px;
  border-radius: 10px;
  flex-shrink: 0;
  min-width: 80px;
  text-align: center;
}
.adm-pct   { font-size: 22px; font-weight: 800; line-height: 1; }
.adm-label { font-size: 10px; font-weight: 600; margin-top: 2px; white-space: nowrap; }
.adm-bar-wrap {
  height: 4px;
  background: var(--border);
  border-radius: 2px;
  margin-bottom: 10px;
  overflow: hidden;
}
.adm-bar {
  height: 100%;
  border-radius: 2px;
  transition: width .4s ease;
}
.adm-hints {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.adm-hint {
  font-size: 11px;
  padding: 3px 8px;
  background: var(--surface);
  border-radius: 20px;
  color: var(--text);
}
.adm-hint.ok   { background: #dcfce7; color: #166534; }
.adm-hint.warn { background: #fef3c7; color: #92400e; }
.adm-note {
  font-size: 12px;
  color: var(--muted);
  border-top: 1px solid var(--border);
  padding-top: 8px;
  line-height: 1.5;
}

/* ══════════════════════════════════════════
   홈 인라인 검색창
══════════════════════════════════════════ */
.home-search-wrap {
  position: relative;
  width: 100%;
  max-width: 560px;
  margin: 0 0 18px;
}

.home-search-box {
  display: flex;
  align-items: center;
  background: #fff;
  border: 2.5px solid rgba(255,255,255,.9);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,.18);
  transition: border-color .15s, box-shadow .15s;
}
.home-search-box:focus-within {
  border-color: var(--amber, #f5ad1b);
  box-shadow: 0 4px 28px rgba(0,0,0,.22);
}

.home-search-icon {
  font-size: 18px;
  padding: 0 12px 0 16px;
  flex-shrink: 0;
  pointer-events: none;
}

.home-search-input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 15px;
  padding: 14px 0;
  background: transparent;
  color: #1a1a2e;
  min-width: 0;
}
.home-search-input::placeholder { color: #9ca3af; font-size: 13px; }

.home-search-btn {
  background: var(--navy, #10263d);
  color: #fff;
  border: none;
  padding: 0 22px;
  height: 52px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  flex-shrink: 0;
  transition: opacity .15s;
  white-space: nowrap;
}
.home-search-btn:hover { opacity: .85; }

/* 드롭다운 */
.home-search-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0; right: 0;
  background: #fff;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,.14);
  z-index: 200;
  overflow: hidden;
  max-height: 420px;
  overflow-y: auto;
}

.hsd-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 16px;
  cursor: pointer;
  border-bottom: 1px solid #f3f4f6;
  transition: background .1s;
}
.hsd-item:last-of-type { border-bottom: none; }
.hsd-item:hover, .hsd-item.on { background: #f0f7ff; }

.hsd-flag { font-size: 20px; flex-shrink: 0; }
.hsd-info { flex: 1; min-width: 0; }
.hsd-name { font-size: 14px; font-weight: 700; color: #10263d; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hsd-meta { font-size: 11px; color: #6b7280; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hsd-arrow { font-size: 18px; color: #d1d5db; flex-shrink: 0; }
.hsd-item:hover .hsd-arrow, .hsd-item.on .hsd-arrow { color: #1688d8; }

.hsd-empty { padding: 16px; text-align: center; color: #9ca3af; font-size: 13px; }
.hsd-footer {
  padding: 11px 16px;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  color: #1688d8;
  background: #f8fafc;
  cursor: pointer;
  border-top: 1px solid #e5e7eb;
}
.hsd-footer:hover { background: #eff6ff; }

/* 국가 퀵필터 pills */
.home-search-pills {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.home-pill {
  background: rgba(255,255,255,.18);
  color: #fff;
  border: 1.5px solid rgba(255,255,255,.35);
  border-radius: 20px;
  padding: 5px 13px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  backdrop-filter: blur(4px);
  transition: all .15s;
  white-space: nowrap;
}
.home-pill:hover {
  background: rgba(255,255,255,.32);
  border-color: rgba(255,255,255,.7);
}

@media (max-width: 600px) {
  .home-search-input { font-size: 14px; }
  .home-search-btn { padding: 0 14px; font-size: 13px; }
  .home-search-wrap { max-width: 100%; }
}

/* ══════════════════════════════════════════
   비교 기능 (Compare)
══════════════════════════════════════════ */
.cmp-empty-wrap{
  text-align:center; padding:60px 20px;
  max-width:480px; margin:0 auto;
}
.cmp-empty-icon{ font-size:52px; margin-bottom:16px; }
.cmp-empty-title{ font-size:22px; font-weight:800; color:var(--navy,#10263d); margin-bottom:8px; }
.cmp-empty-desc{ font-size:14px; color:var(--muted,#6b7280); line-height:1.7; margin-bottom:20px; }

.cmp-wrap{ max-width:900px; margin:0 auto; }
.cmp-header{
  display:flex; justify-content:space-between; align-items:flex-start;
  gap:12px; flex-wrap:wrap; margin-bottom:18px;
  padding-bottom:16px; border-bottom:2px solid var(--border,#e5e7eb);
}

.cmp-table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:12px; border:1.5px solid var(--border,#e5e7eb); }
.cmp-table{ width:100%; border-collapse:collapse; font-size:13px; min-width:480px; }

.cmp-th-label{
  width:110px; min-width:90px; padding:12px 14px;
  background:var(--navy,#10263d); color:#fff;
  font-size:11px; font-weight:700; text-align:left;
  vertical-align:top;
}
.cmp-th-school{
  padding:14px 16px; background:#f0f7ff;
  border-left:1px solid var(--border,#e5e7eb);
  vertical-align:top; min-width:160px;
}
.cmp-school-head{ display:flex; flex-direction:column; gap:4px; }
.cmp-school-name{ font-size:13px; font-weight:800; color:var(--navy,#10263d); line-height:1.3; }
.cmp-school-en{ font-size:11px; color:var(--muted,#6b7280); }
.cmp-remove{
  margin-top:6px; font-size:11px; color:#e53e3e;
  background:none; border:1px solid #fecaca; border-radius:5px;
  padding:3px 8px; cursor:pointer; width:fit-content;
}
.cmp-remove:hover{ background:#fef2f2; }

.cmp-label{
  padding:11px 14px; font-size:11px; font-weight:700;
  color:var(--muted,#6b7280); background:var(--bg,#f8fafc);
  white-space:nowrap; vertical-align:middle;
  border-top:1px solid var(--border,#e5e7eb);
}
.cmp-val{
  padding:11px 16px; vertical-align:middle;
  border-left:1px solid var(--border,#e5e7eb);
  border-top:1px solid var(--border,#e5e7eb);
  font-size:13px; color:var(--text,#1a1a2e); line-height:1.5;
}
.cmp-row-even .cmp-val{ background:#fff; }
.cmp-row-odd .cmp-val{ background:#f8fafc; }
.cmp-row-even .cmp-label{ background:#f8fafc; }
.cmp-row-odd .cmp-label{ background:#f1f5f9; }

.cmp-actions-row{
  display:flex; gap:12px; margin-top:16px; flex-wrap:wrap;
}
.cmp-action-cell{ flex:1; min-width:140px; }
.cmp-action-cell .primary{ width:100%; }

@media(max-width:600px){
  .cmp-th-label{ width:80px; min-width:70px; font-size:10px; padding:10px 8px; }
  .cmp-th-school{ padding:10px 10px; min-width:120px; }
  .cmp-val, .cmp-label{ padding:9px 8px; font-size:12px; }
}

/* ══════════════════════════════════════════
   모바일 하단 탭바
══════════════════════════════════════════ */
#mobileTabBar{
  display:none;  /* 기본 숨김 — 모바일 미디어쿼리에서 flex로 켬 */
  position:fixed; bottom:0; left:0; right:0;
  height:58px;
  background:#fff;
  border-top:1px solid #e5e7eb;
  z-index:300;
  padding-bottom:env(safe-area-inset-bottom,0px);
  box-shadow:0 -2px 12px rgba(0,0,0,.08);
}
@media(max-width:639px){
  #mobileTabBar{ display:flex; }
  /* 하단 탭바 높이만큼 본문 패딩 */
  body{ padding-bottom:calc(58px + env(safe-area-inset-bottom,0px)); }
}

.mob-tab{
  flex:1; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:2px; border:none; background:none;
  cursor:pointer; color:var(--muted,#6b7280);
  text-decoration:none;
  padding:6px 2px 4px;
  transition:color .15s;
  -webkit-tap-highlight-color:transparent;
}
.mob-tab.active{ color:var(--navy,#10263d); }
.mob-tab-icon{ font-size:20px; line-height:1; }
.mob-tab-label{ font-size:9px; font-weight:600; line-height:1; white-space:nowrap; }
.mob-tab:active{ opacity:.7; }

/* ══════════════════════════════════════════
   상단 네비게이션 드롭다운 메가메뉴
══════════════════════════════════════════ */
.nav-dropdown-wrap {
  position: relative;
}
.nav-dropdown-btn {
  border: 0; background: none;
  padding: 8px 12px; border-radius: 8px;
  font: inherit; font-size: 13px;
  cursor: pointer; color: rgba(255,255,255,.65);
  transition: all .15s;
  display: flex; align-items: center; gap: 4px;
}
.nav-dropdown-btn:hover,
.nav-dropdown-btn.active { color: #fff; background: rgba(255,255,255,.08); }
.nav-dropdown-btn.active { color: var(--amber, #f5ad1b); font-weight: 700; }
.nav-chevron { font-size: 9px; opacity: .6; }

.nav-dropdown {
  display: none;
  position: absolute; top: calc(100% + 8px); left: 0;
  background: #fff;
  border: 1.5px solid #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 8px 32px rgba(0,0,0,.14);
  z-index: 500;
  padding: 16px;
  display: flex; gap: 24px;
  min-width: 380px;
  opacity: 0; pointer-events: none;
  transform: translateY(-6px);
  transition: opacity .15s, transform .15s;
}
.nav-dropdown.open {
  opacity: 1; pointer-events: all;
  transform: translateY(0);
  display: flex;
}
.nav-drop-col {
  display: flex; flex-direction: column; gap: 2px; flex: 1;
}
.nav-drop-head {
  font-size: 10px; font-weight: 800;
  color: #9ca3af; letter-spacing: .06em;
  text-transform: uppercase;
  padding: 0 10px 6px;
  border-bottom: 1px solid #f3f4f6;
  margin-bottom: 4px;
}
.nav-dropdown button,
.nav-dropdown a {
  display: block;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 13px; font-weight: 500;
  color: #1a1a2e;
  background: none; border: none;
  cursor: pointer; text-align: left;
  text-decoration: none;
  transition: background .1s;
}
.nav-dropdown button:hover,
.nav-dropdown a:hover {
  background: #f0f7ff; color: #10263d;
}

/* 홈 nav plain link */
.nav-plain-link {
  border: 0; background: none;
  padding: 8px 12px; border-radius: 8px;
  font: inherit; font-size: 13px;
  cursor: pointer; color: rgba(255,255,255,.65);
  transition: all .15s; text-decoration: none;
  display: inline-flex; align-items: center;
}
.nav-plain-link:hover { color: #fff; background: rgba(255,255,255,.08); }

/* (old .home-journey CSS removed — replaced by .journey-section block) */

/* ══════════════════════════════════════════
   홈 CTA strip (정리된 버전)
══════════════════════════════════════════ */
.home-cta-strip {
  background: var(--navy, #10263d);
  padding: 36px clamp(16px,4vw,60px);
  display: flex; align-items: center;
  justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
}
.home-cta-left h2 { color: #fff; font-size: 22px; margin: 6px 0 0; }
.home-cta-left .eyebrow { color: var(--amber, #f5ad1b); }
.home-cta-btns {
  display: flex; gap: 10px; flex-wrap: wrap; align-items: center;
}

/* ══════════════════════════════════════════
   학년별 학비 — 나이 선택 UI
══════════════════════════════════════════ */
.grade-tuition-wrap { display: flex; flex-direction: column; gap: 16px; }

.age-picker-row { display: flex; flex-direction: column; gap: 8px; }
.age-picker-label { font-size: 12px; font-weight: 700; color: var(--muted); letter-spacing: .04em; }
.age-picker { display: flex; flex-wrap: wrap; gap: 5px; }
.age-btn {
  padding: 5px 10px; border-radius: 20px; border: 1.5px solid #d1d5db;
  background: #fff; font-size: 13px; font-weight: 600; cursor: pointer;
  color: #374151; transition: all .12s; line-height: 1.2;
}
.age-btn:hover:not(.disabled) { border-color: #1688d8; color: #1688d8; background: #eff6ff; }
.age-btn.active { background: #1688d8; border-color: #1688d8; color: #fff; }
.age-btn.disabled { opacity: .35; cursor: not-allowed; }
.age-btn-clear {
  padding: 5px 10px; border-radius: 20px; border: 1.5px solid #e5e7eb;
  background: #f9fafb; font-size: 12px; cursor: pointer; color: #9ca3af;
}

.grade-highlight-card {
  background: linear-gradient(135deg, #eff6ff, #f0fdf4);
  border: 2px solid #1688d8; border-radius: 12px; padding: 16px 20px;
  display: flex; flex-direction: column; gap: 4px;
}
.grade-highlight-label { font-size: 13px; font-weight: 700; color: #1688d8; }
.grade-highlight-amount { font-size: 22px; font-weight: 800; color: #1a1a2e; }
.grade-highlight-krw { font-size: 14px; color: #059669; font-weight: 600; }

.grade-table-wrap { overflow-x: auto; }
.grade-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.grade-table thead th {
  background: #f8fafc; padding: 9px 12px; text-align: left;
  font-size: 11px; font-weight: 700; color: #6b7280; letter-spacing: .04em;
  border-bottom: 1.5px solid #e5e7eb; white-space: nowrap;
}
.grade-table tbody tr { border-bottom: 1px solid #f3f4f6; transition: background .1s; }
.grade-table tbody tr:hover { background: #f8fafc; }
.grade-table tbody tr.grade-row-match { background: #eff6ff; }
.grade-table td { padding: 9px 12px; }
.age-range { color: #9ca3af; font-size: 12px; }
.fee-amount { font-weight: 600; color: #1a1a2e; text-align: right; }
.fee-krw { color: #059669; font-weight: 600; font-size: 12px; text-align: right; }

.sim-tuition-box { background: #f8fafc; border-radius: 10px; padding: 16px 20px; }
.sim-tuition-range { display: flex; flex-direction: column; gap: 4px; }
.sim-label { font-size: 11px; font-weight: 700; color: #9ca3af; letter-spacing: .04em; text-transform: uppercase; }
.sim-amount { font-size: 18px; font-weight: 700; color: #1a1a2e; }
.sim-krw { font-size: 14px; color: #059669; font-weight: 600; }

.tuition-note { font-size: 11px; color: #9ca3af; line-height: 1.5; }

/* ── 추가 비용 (입학비·기타비용) ─────────────────────────── */
.extra-fees-wrap {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  overflow: hidden;
}
.extra-fees-title {
  padding: 10px 14px;
  font-size: 12px;
  font-weight: 700;
  color: #374151;
  background: #f9fafb;
  border-bottom: 1px solid #e5e7eb;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.extra-fees-list { display: flex; flex-direction: column; }
.extra-fee-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid #f3f4f6;
}
.extra-fee-row:last-child { border-bottom: none; }
.extra-fee-left {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  flex: 1;
  flex-wrap: wrap;
  min-width: 0;
}
.extra-fee-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  white-space: nowrap;
  flex-shrink: 0;
  margin-top: 1px;
}
.badge-required { background: #fef3c7; color: #92400e; }
.badge-optional { background: #ede9fe; color: #5b21b6; }
.extra-fee-label {
  font-size: 13px;
  color: #374151;
  font-weight: 500;
  line-height: 1.4;
}
.extra-fee-desc {
  font-size: 11px;
  color: #9ca3af;
  width: 100%;
  margin-top: 2px;
}
.extra-fee-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  flex-shrink: 0;
  gap: 2px;
}
.extra-fee-amount {
  font-size: 14px;
  font-weight: 700;
  color: #1a1a2e;
  white-space: nowrap;
}
.extra-fee-krw {
  font-size: 11px;
  color: #059669;
  font-weight: 600;
  white-space: nowrap;
}
@media (max-width: 480px) {
  .extra-fee-row { flex-direction: column; gap: 6px; }
  .extra-fee-right { align-items: flex-start; flex-direction: row; gap: 8px; }
}

/* ISPP 브랜드 로고 */
.brand-logo-ispp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #1a2744;
  color: #f59e0b;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 2px;
  padding: 4px 10px;
  border-radius: 6px;
  border: 1.5px solid #f59e0b;
  line-height: 1;
}
.auth-logo-ispp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #1a2744;
  color: #f59e0b;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 4px;
  padding: 8px 20px;
  border-radius: 10px;
  border: 2px solid #f59e0b;
  margin-bottom: 8px;
}

/* ISPP SVG 로고 */
.brand-logo-svg {
  height: 36px;
  width: auto;
  display: block;
}

/* Exam figure styles */
.fig-row{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;margin:16px 0 20px;padding:16px;background:#f8fafc;border-radius:12px;border:1.5px solid #e2e8f0}
.fig-row svg{flex-shrink:0}
.fig-box{display:inline-flex;align-items:center;justify-content:center;width:60px;height:60px;background:#fff;border-radius:8px;border:1px solid #e2e8f0}
.fig-label{font-size:11px;color:#64748b;font-weight:600;letter-spacing:.5px;margin:0 8px}
.fig-grid{display:grid;gap:2px;background:#cbd5e1;border-radius:8px;overflow:hidden;padding:2px}
.fig-grid .fig-cell{background:#fff;display:flex;align-items:center;justify-content:center;width:56px;height:56px}
.fig-grid .fig-cell.empty{background:#fef3c7;position:relative}
.fig-grid .fig-cell.empty::after{content:"?";font-size:24px;font-weight:800;color:#d97706}
.option svg{margin-right:8px;flex-shrink:0;vertical-align:middle}


/* ── Wizard (School Finder Quiz) ────────────────────────────────── */
.wizard-options { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px }
.wizard-options.region { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px }
.wizard-opt {
  padding: 14px 18px; border-radius: 12px; border: 2px solid var(--border);
  background: #fff; color: #10263d !important; cursor: pointer; font-size: 14px; font-weight: 600;
  transition: all .15s; text-align: left; display: flex; align-items: center; gap: 10px;
  min-height: 48px;
}
.wizard-opt:hover { border-color: var(--primary); background: #eff6ff; color: #10263d !important }
.wizard-opt.selected { border-color: var(--primary); background: var(--primary); color: #fff !important }
.wizard-body h2 { font-size: 20px; font-weight: 800; color: var(--navy); margin-bottom: 4px }
.wizard-body h2 small { font-size: 13px; font-weight: 400; color: var(--muted) }

/* ── Map cluster icon override ────────────────────────────────── */
.map-cluster-icon { background: none !important; border: none !important }
.leaflet-popup-content { font-family: var(--font-main, 'Pretendard', sans-serif) !important }
.leaflet-popup-content a:hover { text-decoration: underline }

@media (max-width: 768px) {
  .wizard-options { flex-direction: column }
  .wizard-options.region { grid-template-columns: 1fr 1fr }
  .wizard-opt { width: 100% }
}
@media (max-width: 480px) {
  .wizard-options.region { grid-template-columns: 1fr }
}

/* ── Map MarkerCluster overrides ──────────────────────────────── */
.marker-cluster-small, .marker-cluster-medium, .marker-cluster-large {
  background: transparent !important;
}
.marker-cluster-small div, .marker-cluster-medium div, .marker-cluster-large div {
  background: transparent !important;
}
.map-school-pin { background: none !important; border: none !important }
.leaflet-popup-content-wrapper { border-radius: 12px !important; box-shadow: 0 4px 16px rgba(0,0,0,.15) !important }
.leaflet-popup-tip { box-shadow: none !important }

/* Guide page */
.guide-section{display:flex;gap:20px;padding:28px 0;border-bottom:1px solid #e5e7eb}
.guide-num{min-width:40px;height:40px;background:var(--navy);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;flex-shrink:0}
.guide-checklist{display:flex;flex-direction:column;gap:8px;margin-top:14px;padding:16px;background:#f8fafc;border-radius:12px;font-size:13px;line-height:1.7}
.guide-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:6px}
.guide-card b{font-size:14px;color:var(--navy)} .guide-card span{font-size:12px;color:#64748b;line-height:1.6}
.guide-step{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#f8fafc;border-radius:10px;font-size:14px}
.guide-step-n{font-weight:800;color:#3b82f6;font-size:16px}
@media(max-width:640px){.guide-section{flex-direction:column;gap:12px} .guide-num{width:32px;height:32px;font-size:13px}}

/* ══════════════════════════════════════════════════════════════
   CITY PAGES — Index + Detail
   ══════════════════════════════════════════════════════════════ */

/* ── City Detail Page ── */
.city-page { padding-bottom: 60px }

.city-hero {
  position: relative;
  background: linear-gradient(135deg, #10263d 0%, #1a3a5c 50%, #0d1f33 100%);
  padding: clamp(48px,7vw,80px) clamp(18px,5vw,60px) clamp(36px,5vw,56px);
  border-radius: 0 0 24px 24px;
  margin-bottom: 32px;
  overflow: hidden;
}
.city-hero::before {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 70% 30%, rgba(22,136,216,.15), transparent 70%),
              radial-gradient(ellipse at 20% 80%, rgba(245,173,27,.08), transparent 60%);
  pointer-events: none;
}
.city-hero-badge {
  position: relative;
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.15);
  backdrop-filter: blur(8px);
  padding: 6px 14px; border-radius: 999px;
  font-size: 12px; font-weight: 700; color: rgba(255,255,255,.8);
  letter-spacing: .04em; margin-bottom: 16px;
}
.city-hero-title {
  position: relative;
  font-size: clamp(32px,5vw,56px);
  font-weight: 900; color: #fff;
  margin: 0 0 12px; line-height: 1.1;
  letter-spacing: -.02em;
}
.city-hero-sub {
  position: relative;
  font-size: clamp(14px,1.6vw,17px);
  color: rgba(255,255,255,.6);
  margin: 0; max-width: 560px; line-height: 1.6;
}

/* ── Intro Panel ── */
.city-intro-panel {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 24px 28px;
  margin-bottom: 28px;
  font-size: 15px; line-height: 1.7;
  color: var(--ink);
  box-shadow: 0 2px 12px rgba(16,38,61,.04);
}
.city-tip {
  margin-top: 16px;
  padding: 14px 18px;
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border-left: 4px solid var(--amber);
  border-radius: 0 12px 12px 0;
  font-size: 13px; line-height: 1.65;
  color: #92400e;
}

/* ── Stats Grid ── */
.city-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 32px;
}
.city-stat-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 20px;
  text-align: center;
  transition: box-shadow .2s, transform .2s;
  box-shadow: 0 2px 8px rgba(16,38,61,.03);
}
.city-stat-card:hover {
  box-shadow: 0 6px 24px rgba(16,38,61,.08);
  transform: translateY(-2px);
}
.city-stat-icon {
  font-size: 28px;
  margin-bottom: 8px;
  display: block;
}
.city-stat-value {
  font-size: 28px;
  font-weight: 900;
  color: var(--navy);
  display: block;
  letter-spacing: -.02em;
}
.city-stat-label {
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
  display: block;
  margin-top: 4px;
}

/* ── Section Headings ── */
.city-section {
  margin-bottom: 28px;
}
.city-section h2 {
  font-size: 20px;
  font-weight: 800;
  color: var(--navy);
  margin: 0 0 16px;
  display: flex; align-items: center; gap: 10px;
}

/* ── Curriculum Bar Chart ── */
.city-curr-bars {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 20px 24px;
  display: flex; flex-direction: column; gap: 10px;
}
.city-curr-row {
  display: grid;
  grid-template-columns: 120px 1fr 50px;
  align-items: center;
  gap: 12px;
}
.city-curr-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.city-curr-bar-wrap {
  height: 24px;
  background: #f1f5f9;
  border-radius: 6px;
  overflow: hidden;
}
.city-curr-bar {
  height: 100%;
  border-radius: 6px;
  transition: width .5s ease;
  min-width: 4px;
}
.city-curr-count {
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
  text-align: right;
}

/* ── Exam Chips ── */
.city-exam-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.city-exam-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  transition: border-color .15s;
}
.city-exam-tag:hover { border-color: var(--accent) }
.city-exam-cnt {
  display: inline-flex;
  align-items: center; justify-content: center;
  background: var(--accent);
  color: #fff;
  font-size: 11px; font-weight: 700;
  width: 22px; height: 22px;
  border-radius: 50%;
}

/* ── Tuition Summary ── */
.city-tuition-summary {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 20px 24px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.city-tuition-item {
  text-align: center;
  padding: 12px;
}
.city-tuition-item small {
  display: block;
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
  margin-bottom: 6px;
}
.city-tuition-item b {
  font-size: 22px;
  color: var(--navy);
  font-weight: 900;
  letter-spacing: -.01em;
}
.city-tuition-item:not(:last-child) {
  border-right: 1px solid var(--line);
}

/* ── City Living Guide ── */
.city-living-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.city-living-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 18px;
  transition: box-shadow .2s, transform .15s;
}
.city-living-card:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,.08);
  transform: translateY(-1px);
}
.city-living-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.city-living-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}
.city-living-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
  flex: 1;
}
.city-living-meta {
  font-size: 13px;
  margin-bottom: 6px;
  line-height: 1.6;
}
.city-living-desc {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
}

/* ── School Filters & List ── */
.city-school-filters {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.city-search-input {
  flex: 1; min-width: 200px;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font: inherit; font-size: 14px;
  background: var(--card);
  transition: border-color .15s;
  outline: none;
}
.city-search-input:focus { border-color: var(--accent) }
.city-school-filters select {
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font: inherit; font-size: 13px;
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
  outline: none;
}
.city-school-filters select:focus { border-color: var(--accent) }

.city-school-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

/* ── Pagination ── */
.city-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 24px;
  flex-wrap: wrap;
}
.city-pagination button {
  padding: 8px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card);
  font: inherit; font-size: 13px; font-weight: 600;
  color: var(--ink);
  cursor: pointer;
  transition: all .15s;
}
.city-pagination button:hover:not(:disabled) {
  border-color: var(--accent);
  color: var(--accent);
}
.city-pagination button:disabled {
  opacity: .4; cursor: not-allowed;
}
.city-page-info {
  font-size: 13px;
  color: var(--muted);
  font-weight: 600;
  padding: 0 8px;
}

/* ── Nearby Cities ── */
.city-nearby {
  margin-top: 40px;
}
.city-nearby h2 {
  font-size: 20px;
  font-weight: 800;
  color: var(--navy);
  margin: 0 0 16px;
}
.city-nearby-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.city-nearby-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  cursor: pointer;
  transition: all .2s;
  text-decoration: none;
  color: inherit;
}
.city-nearby-card:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 16px rgba(22,136,216,.1);
  transform: translateY(-2px);
}
.city-nearby-card b {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}
.city-nearby-card small {
  font-size: 12px;
  color: var(--muted);
}

/* ══════════════════════════════════════════════════════════════
   CITY INDEX PAGE
   ══════════════════════════════════════════════════════════════ */

.city-list-filters {
  display: flex;
  gap: 10px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.city-list-filters input,
.city-list-filters select {
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font: inherit; font-size: 14px;
  background: var(--card);
  outline: none;
}
.city-list-filters input { flex: 1; min-width: 200px }
.city-list-filters input:focus,
.city-list-filters select:focus { border-color: var(--accent) }

.city-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.city-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 0;
  cursor: pointer;
  transition: all .2s;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
}
.city-card:hover {
  border-color: var(--accent);
  box-shadow: 0 8px 28px rgba(22,136,216,.1);
  transform: translateY(-3px);
}
.city-card-head {
  background: linear-gradient(135deg, #10263d, #1a3a5c);
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.city-card-emoji {
  font-size: 32px;
}
.city-card-country {
  font-size: 11px;
  color: rgba(255,255,255,.6);
  font-weight: 600;
  letter-spacing: .03em;
  background: rgba(255,255,255,.1);
  padding: 4px 10px;
  border-radius: 999px;
}
.city-card h3 {
  font-size: 17px;
  font-weight: 800;
  color: var(--navy);
  margin: 14px 18px 4px;
}
.city-card-count {
  font-size: 13px;
  color: var(--accent);
  font-weight: 700;
  margin: 0 18px;
}
.city-card-desc {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.55;
  margin: 8px 18px 16px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── City Pages Responsive ── */
@media(max-width: 900px) {
  .city-stats-grid { grid-template-columns: repeat(2, 1fr) }
  .city-nearby-grid { grid-template-columns: repeat(3, 1fr) }
  .city-grid { grid-template-columns: repeat(2, 1fr) }
  .city-tuition-summary { grid-template-columns: repeat(3, 1fr) }
  .city-living-grid { grid-template-columns: repeat(2, 1fr) }
}
@media(max-width: 640px) {
  .city-hero { padding: 36px 18px 28px; border-radius: 0 0 16px 16px }
  .city-hero-title { font-size: 28px }
  .city-stats-grid { grid-template-columns: 1fr 1fr; gap: 10px }
  .city-stat-card { padding: 14px }
  .city-stat-value { font-size: 22px }
  .city-curr-row { grid-template-columns: 80px 1fr 40px; gap: 8px }
  .city-curr-label { font-size: 11px }
  .city-tuition-summary { grid-template-columns: 1fr; gap: 0 }
  .city-tuition-item:not(:last-child) { border-right: none; border-bottom: 1px solid var(--line) }
  .city-tuition-item { padding: 10px }
  .city-tuition-item b { font-size: 18px }
  .city-school-list { grid-template-columns: 1fr }
  .city-nearby-grid { grid-template-columns: 1fr 1fr }
  .city-grid { grid-template-columns: 1fr }
  .city-school-filters { flex-direction: column }
  .city-search-input { min-width: unset }
  .city-list-filters { flex-direction: column }
  .city-list-filters input { min-width: unset }
  .city-intro-panel { padding: 18px }
  .city-living-grid { grid-template-columns: 1fr }
  .city-living-card { padding: 14px 16px }
}

/* ── City Overview Panel (inline in school search) ─────────────── */
.city-overview-panel {
  background: linear-gradient(135deg, #f0f4ff 0%, #f8f6ff 100%);
  border: 1px solid #e0e4f0;
  border-radius: 14px;
  padding: 20px;
  margin: 16px 0 12px;
  animation: cityOvIn .3s ease;
}
.city-overview-panel.collapsed { display: none }
@keyframes cityOvIn { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }
.city-overview-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.city-overview-title {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  flex: 1;
}
.city-overview-emoji {
  font-size: 28px;
  line-height: 1;
  flex-shrink: 0;
}
.city-overview-title h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  color: var(--navy);
}
.city-overview-desc {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.65;
  color: var(--text);
  opacity: .85;
}
.city-overview-close {
  background: none;
  border: none;
  font-size: 16px;
  color: var(--muted);
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 6px;
  flex-shrink: 0;
}
.city-overview-close:hover { background: rgba(0,0,0,.06) }

.city-overview-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}
.city-ov-stat {
  background: #fff;
  border-radius: 10px;
  padding: 12px 10px;
  text-align: center;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.city-ov-val {
  display: block;
  font-size: 18px;
  font-weight: 800;
  color: var(--navy);
}
.city-ov-lbl {
  display: block;
  font-size: 11px;
  color: var(--muted);
  margin-top: 3px;
}

.city-ov-currs { margin-bottom: 10px }
.city-ov-curr-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
}
.city-ov-curr-name {
  font-size: 12px;
  color: var(--text);
  min-width: 130px;
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.city-ov-curr-bar-wrap {
  flex: 1;
  height: 14px;
  background: #e8ecf4;
  border-radius: 7px;
  overflow: hidden;
}
.city-ov-curr-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--navy), #4f6bbe);
  border-radius: 7px;
  min-width: 8px;
  transition: width .3s ease;
}
.city-ov-curr-cnt {
  font-size: 11px;
  font-weight: 700;
  color: var(--navy);
  min-width: 28px;
}

.city-ov-exams {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.city-ov-tip {
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 12px;
  line-height: 1.6;
  color: #92400e;
}

/* city visa info section */
.city-visa-section {
  margin-top: 16px;
  border-top: 1px solid var(--border);
  padding-top: 14px;
}
.city-visa-title {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--navy);
}
.city-visa-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 600px) {
  .city-visa-grid { grid-template-columns: 1fr; }
}
.city-visa-card {
  background: #f0f4ff;
  border: 1px solid #c7d7fe;
  border-radius: 10px;
  padding: 12px 14px;
}
.city-visa-guardian {
  background: #f5f3ff;
  border-color: #ddd6fe;
}
.city-visa-card-hdr {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  color: #6366f1;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-bottom: 6px;
}
.city-visa-guardian .city-visa-card-hdr { color: #7c3aed; }
.city-visa-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}
.city-visa-desc {
  font-size: 12px;
  color: #475569;
  line-height: 1.55;
}
.city-visa-note {
  font-size: 11px;
  color: #94a3b8;
  margin: 8px 0 0;
  font-style: italic;
}

/* city mini map */
.city-mini-map {
  width: 100%;
  height: 200px;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 12px;
  border: 1px solid var(--border);
}
.city-map-pin {
  background: none !important;
  border: none !important;
}
.city-map-dot {
  width: 20px;
  height: 20px;
  background: #1e3a5f;
  border-radius: 50%;
  border: 2.5px solid #fff;
  box-shadow: 0 0 0 1.5px #1e3a5f, 0 2px 4px rgba(0,0,0,.35);
  cursor: pointer;
  transition: transform .2s, background .2s, box-shadow .2s;
}
.city-map-dot--active {
  background: #ef4444;
  box-shadow: 0 0 0 2px #ef4444, 0 0 8px rgba(239,68,68,.5);
  transform: scale(1.6);
  animation: miniPinBounce .4s ease;
}
@keyframes miniPinBounce {
  0%   { transform: scale(1) translateY(0) }
  30%  { transform: scale(1.8) translateY(-6px) }
  50%  { transform: scale(1.5) translateY(0) }
  70%  { transform: scale(1.7) translateY(-3px) }
  100% { transform: scale(1.6) translateY(0) }
}

@media(max-width:640px){
  .city-overview-stats { grid-template-columns: repeat(2, 1fr) }
  .city-ov-curr-name { min-width: 90px; font-size: 11px }
  .city-overview-panel { padding: 14px }
  .city-mini-map { height: 160px }
}

/* ═══════════════════════════════════════════════════════════════
   School Detail Page — ISD-style Enhanced Layout
   ═══════════════════════════════════════════════════════════════ */

/* Hero banner image */
.sd-hero-banner {
  position: relative;
  width: 100%;
  height: 260px;
  overflow: hidden;
  border-radius: 0 0 20px 20px;
  margin-bottom: -20px;
}
.sd-hero-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sd-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.45) 0%, transparent 60%);
}

/* Hero title row with logo */
.sd-hero {
  position: relative;
}
.sd-hero-title-row {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 4px;
}
.sd-hero-title-text {
  flex: 1;
  min-width: 0;
}

/* School logo */
.sd-logo-wrap {
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,.1);
  border: 2px solid #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sd-logo-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 4px;
}
.sd-logo-initials {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  font-weight: 800;
  color: #fff;
  border-radius: 14px;
  letter-spacing: -0.5px;
}

/* English name subtitle */
.sd-eng-name {
  font-size: 14px;
  color: var(--muted);
  font-weight: 500;
  margin: 2px 0 0;
}

/* Tag row — badges */
.sd-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.sd-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.sd-badge-nae { background: #eff6ff; color: #1e40af; }
.sd-badge-china { background: #fef2f2; color: #b91c1c; }
.sd-badge-type { background: #f0fdf4; color: #166534; }
.sd-badge-age { background: #faf5ff; color: #7c3aed; }

/* Quick action buttons */
.sd-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.sd-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border: 1.5px solid var(--border);
  background: #fff;
  color: var(--navy);
  cursor: pointer;
  transition: all .2s;
}
.sd-action-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
  box-shadow: 0 2px 8px rgba(79,70,229,.12);
}
.sd-action-web { border-color: #c7d2fe; background: #eef2ff; color: #4338ca; }
.sd-action-naver { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
.sd-action-compare { border-color: #fde68a; background: #fffbeb; color: #92400e; }

/* Content area */
.sd-content {
  max-width: 820px;
  margin: 0 auto;
  padding: 0 0 40px;
}

/* Description block */
.sd-desc {
  position: relative;
  background: #f8fafc;
  border-radius: 16px;
  padding: 20px 20px 20px 28px;
  margin-bottom: 20px;
  font-size: 14px;
  line-height: 1.8;
  color: #334155;
}
.sd-desc-accent {
  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;
  width: 4px;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--accent), #818cf8);
}
.sd-desc p { margin: 0; }

/* Head Teacher welcome */
.sd-headteacher {
  display: flex;
  gap: 20px;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 20px;
  border: 1px solid #e0e7ff;
}
.sd-ht-photo {
  flex-shrink: 0;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,.1);
}
.sd-ht-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sd-ht-body { flex: 1; min-width: 0; }
.sd-ht-name {
  font-size: 16px;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 2px;
}
.sd-ht-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  margin-bottom: 10px;
}
.sd-ht-msg {
  font-size: 13px;
  line-height: 1.8;
  color: #475569;
  font-style: italic;
}
.sd-ht-msg::before { content: '"'; font-size: 28px; font-weight: 800; color: #c7d2fe; line-height: 0; vertical-align: -8px; margin-right: 4px; }

/* Photo gallery */
.sd-gallery {
  margin-bottom: 20px;
}
.sd-gallery-scroll {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 6px;
}
.sd-gallery-scroll::-webkit-scrollbar { height: 4px; }
.sd-gallery-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
.sd-gallery-img {
  flex: 0 0 auto;
  width: 260px;
  height: 180px;
  object-fit: cover;
  border-radius: 14px;
  scroll-snap-align: start;
  cursor: pointer;
  transition: transform .2s;
}
.sd-gallery-img:hover { transform: scale(1.03); }
.sd-gallery-caption {
  font-size: 12px;
  color: var(--muted);
  margin-top: 6px;
  text-align: center;
}

/* Video section */
.sd-video-section { margin-bottom: 20px; }
.sd-video-wrap {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,.1);
}
.sd-video-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* Key Facts grid */
.sd-keyfacts {
  background: #fff;
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 20px;
  border: 1px solid var(--border);
  box-shadow: 0 1px 6px rgba(0,0,0,.04);
}
.sd-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 14px;
}
.sd-facts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}
.sd-fact-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  background: #f8fafc;
  border-radius: 12px;
  transition: background .2s;
}
.sd-fact-item:hover { background: #eef2ff; }
.sd-fact-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 10px;
  color: var(--accent);
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.sd-fact-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .3px;
}
.sd-fact-value {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--navy);
  margin-top: 1px;
}

/* Accordion details */
.sd-accordion-section { margin-bottom: 20px; }
.sd-acc-item {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: 8px;
  overflow: hidden;
  transition: box-shadow .2s;
}
.sd-acc-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.sd-acc-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  cursor: pointer;
  user-select: none;
}
.sd-acc-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eef2ff;
  border-radius: 8px;
  color: var(--accent);
  flex-shrink: 0;
}
.sd-acc-title {
  flex: 1;
  font-size: 14px;
  font-weight: 700;
  color: var(--navy);
}
.sd-acc-chevron {
  color: var(--muted);
  transition: transform .25s;
  flex-shrink: 0;
}
.sd-acc-item.open .sd-acc-chevron { transform: rotate(180deg); }
.sd-acc-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
  padding: 0 16px;
}
.sd-acc-item.open .sd-acc-content {
  max-height: 400px;
  padding: 0 16px 14px;
}
.sd-acc-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #f1f5f9;
}
.sd-acc-row:last-child { border-bottom: none; }
.sd-acc-label { font-size: 13px; color: #64748b; }
.sd-acc-val { font-size: 13px; font-weight: 700; color: var(--navy); }

/* "Why choose [School]?" section — BSB style */
.sd-why-section {
  background: #f8f8f8;
  border: none;
  border-radius: 16px;
  padding: 32px 24px;
  margin-bottom: 20px;
  box-shadow: none;
}
.sd-why-title {
  font-size: 26px;
  font-weight: 800;
  color: #1a1a2e;
  text-align: center;
  margin-bottom: 12px;
  letter-spacing: -0.3px;
  line-height: 1.3;
}
.sd-why-divider {
  width: 50px;
  height: 3px;
  background: #e74c6f;
  margin: 0 auto 28px;
  border-radius: 2px;
}
.sd-why-program {
  background: #fff;
  border: 1px solid #e8e8e8;
  border-radius: 14px;
  padding: 24px 20px;
  margin-bottom: 16px;
  transition: box-shadow .2s;
}
.sd-why-program:last-child { margin-bottom: 0; }
.sd-why-program:hover { box-shadow: 0 4px 16px rgba(0,0,0,.06); }
.sd-why-prog-name {
  font-size: 18px;
  font-weight: 700;
  color: #1a1a2e;
  text-align: center;
  margin: 0 0 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid #eee;
}
.sd-why-prog-desc {
  font-size: 14px;
  line-height: 1.85;
  color: #444;
  margin: 0 0 16px;
  text-align: left;
  word-break: keep-all;
}
.sd-why-prog-desc:last-child { margin-bottom: 0; }

/* Photo carousel inside program card */
.sd-why-carousel {
  position: relative;
  margin-top: 8px;
}
.sd-why-track {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  overflow-x: auto;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.sd-why-track::-webkit-scrollbar { display: none; }
.sd-why-slide {
  scroll-snap-align: start;
  min-width: 0;
}
.sd-why-slide img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 10px;
  display: block;
}
.sd-why-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #e74c6f;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
  z-index: 2;
  transition: background .2s;
}
.sd-why-arrow:hover { background: #d63d5f; }
.sd-why-prev { left: -14px; }
.sd-why-next { right: -14px; }

@media (max-width: 600px) {
  .sd-why-section { padding: 24px 16px; }
  .sd-why-title { font-size: 20px; }
  .sd-why-prog-name { font-size: 16px; }
  .sd-why-prog-desc { font-size: 13px; }
  .sd-why-track { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .sd-why-arrow { width: 30px; height: 30px; }
  .sd-why-prev { left: -8px; }
  .sd-why-next { right: -8px; }
}

/* Generic section wrapper */
.sd-section {
  background: #fff;
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 20px;
  border: 1px solid var(--border);
  box-shadow: 0 1px 6px rgba(0,0,0,.04);
}

/* Campus facilities */
.sd-facilities-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.sd-facility-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 99px;
  background: #f5f3ff;
  color: #6d28d9;
  font-size: 12px;
  font-weight: 600;
  transition: background .2s;
}
.sd-facility-chip:hover { background: #ede9fe; }

/* Accreditations */
.sd-accred-list { display: flex; flex-direction: column; gap: 6px; }
.sd-accred-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: #f0f9ff;
  border-radius: 10px;
  font-size: 13px;
  color: #0c4a6e;
  font-weight: 500;
}

/* Collaborations */
.sd-collab-list { display: flex; flex-direction: column; gap: 6px; }
.sd-collab-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: #faf5ff;
  border-radius: 10px;
  font-size: 13px;
  color: #6b21a8;
  font-weight: 500;
}

/* Admissions */
.sd-adm-process {
  margin-bottom: 14px;
}
.sd-adm-process-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: .3px;
  margin-bottom: 6px;
}
.sd-adm-process p {
  font-size: 13px;
  line-height: 1.8;
  color: #475569;
  margin: 0;
}
.sd-contact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.sd-contact-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: #f8fafc;
  border-radius: 12px;
  text-decoration: none;
  color: var(--navy);
  transition: all .2s;
  border: 1px solid transparent;
}
.sd-contact-item:hover {
  background: #eef2ff;
  border-color: #c7d2fe;
}
.sd-contact-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
}
.sd-contact-value {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  word-break: break-all;
}
.sd-adm-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border-radius: 10px;
  background: var(--accent);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background .2s, box-shadow .2s;
}
.sd-adm-link:hover {
  background: #4338ca;
  box-shadow: 0 4px 12px rgba(79,70,229,.3);
}

/* Location */
.sd-address {
  font-size: 13px;
  line-height: 1.7;
  color: #475569;
  margin-bottom: 12px;
}
.sd-map-container { position: relative; border-radius: 14px; overflow: hidden; }
.sd-map-link { display: block; position: relative; }
.sd-map-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px;
  background: linear-gradient(transparent, rgba(0,0,0,.6));
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

/* ── Quick Summary (ISD-style) ── */
.sd-quick-summary {
  background: #fff;
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 20px;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
  border: 1px solid #e2e8f0;
}
.qs-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 16px;
}
.qs-info-table {
  background: #f8fafc;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
}
.qs-table-header {
  background: linear-gradient(135deg, #1e3a5f, #2563eb);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  padding: 12px 16px;
  letter-spacing: -0.3px;
}
.qs-row {
  display: flex;
  align-items: center;
  padding: 11px 16px;
  border-bottom: 1px solid #e2e8f0;
  font-size: 13px;
  gap: 10px;
  transition: background .15s;
}
.qs-row:last-child { border-bottom: none; }
.qs-row:hover { background: #eff6ff; }
.qs-icon { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:22px; }
.qs-label { font-weight: 600; color: #334155; flex: 0 0 auto; white-space: nowrap; }
.qs-value { font-weight: 500; color: #1e293b; text-align: right; flex: 1; min-width: 0; word-break: break-word; white-space: normal; }
.qs-check { color: #16a34a; font-weight: 800; font-size: 15px; }
.qs-cross { color: #dc2626; font-weight: 800; font-size: 15px; }
.qs-maybe { color: #d97706; font-size: 12px; font-weight: 600; }
.qs-map-wrap {
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  position: relative;
  margin-bottom: 14px;
}
.qs-map-el {
  width: 100%;
  height: 220px;
  z-index: 1;
}
.qs-map-gmaps {
  position: absolute;
  bottom: 8px;
  right: 8px;
  z-index: 2;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(4px);
  padding: 5px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  color: #1e40af;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 4px;
  box-shadow: 0 1px 4px rgba(0,0,0,.12);
  transition: background .15s;
}
.qs-map-gmaps:hover { background: #fff; }
.qs-address {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 12.5px;
  color: #475569;
  line-height: 1.5;
  margin-bottom: 14px;
  padding: 0 2px;
}
.qs-address svg { flex-shrink: 0; margin-top: 2px; color: #64748b; }
.qs-fees-box {
  background: linear-gradient(135deg, #eff6ff, #f0f4ff);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 14px;
  border: 1px solid #bfdbfe;
}
.qs-fees-title {
  font-size: 12px;
  font-weight: 700;
  color: #1e40af;
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.qs-fees-range {
  font-size: 20px;
  font-weight: 800;
  color: #1e3a5f;
  letter-spacing: -0.5px;
}
.qs-fees-cur {
  font-size: 14px;
  font-weight: 600;
  color: #64748b;
}
.qs-fees-note {
  font-size: 11px;
  color: #64748b;
  margin-top: 6px;
}
.qs-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.qs-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: none;
  transition: all .15s;
  border: 1px solid #e2e8f0;
}
.qs-link-web {
  background: #eff6ff;
  color: #1e40af;
  border-color: #bfdbfe;
}
.qs-link-web:hover { background: #dbeafe; }
.qs-link-contact {
  background: #f0fdf4;
  color: #166534;
  border-color: #bbf7d0;
}
.qs-link-contact:hover { background: #dcfce7; }
.qs-link-naver {
  background: #f0fdf4;
  color: #166534;
  border-color: #bbf7d0;
}
.qs-link-naver:hover { background: #dcfce7; }

/* Mobile responsive */
@media(max-width:640px){
  .sd-hero-banner { height: 180px; }
  .sd-hero-title-row { flex-direction: column; gap: 10px; }
  .sd-logo-wrap { width: 56px; height: 56px; border-radius: 12px; }
  .sd-facts-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .sd-fact-item { padding: 10px; }
  .sd-headteacher { flex-direction: column; align-items: center; text-align: center; padding: 18px; }
  .sd-ht-photo { width: 70px; height: 70px; }
  .sd-gallery-img { width: 200px; height: 140px; }
  .sd-contact-grid { grid-template-columns: 1fr; }
  .sd-prog-photo { width: 160px; height: 110px; }
  .sd-video-wrap { border-radius: 10px; }
  .qs-columns { grid-template-columns: 1fr; gap: 16px; }
  .qs-map-el { height: 180px; }
  .sd-quick-summary { padding: 16px; }
  .qs-row { padding: 9px 12px; }
  .qs-fees-range { font-size: 17px; }
  .qs-links { flex-direction: column; }
  .qs-link { justify-content: center; }
}

/* ── School Life in Pictures (ISD-style) ── */
.sd-life-section {
  background: #fff;
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 20px;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
  border: 1px solid #e2e8f0;
}
.sd-life-header {
  font-size: 22px;
  font-weight: 800;
  color: #1e293b;
  letter-spacing: -0.5px;
}
.sd-life-divider {
  width: 48px;
  height: 3px;
  background: #e8384f;
  border-radius: 2px;
  margin: 10px 0 20px;
}
.sd-life-video {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 16px;
  background: #000;
}
.sd-life-video iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  border: none;
}
.sd-life-carousel {
  position: relative;
  margin-bottom: 16px;
}
.sd-life-track {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding: 4px 0;
  scrollbar-width: none;
}
.sd-life-track::-webkit-scrollbar { display: none; }
.sd-life-slide {
  flex: 0 0 auto;
  width: 260px;
  height: 180px;
  border-radius: 10px;
  overflow: hidden;
  scroll-snap-align: start;
}
.sd-life-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sd-life-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(0,0,0,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  color: #334155;
  z-index: 2;
  transition: all .15s;
}
.sd-life-arrow:hover { background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,.18); }
.sd-life-prev { left: 8px; }
.sd-life-next { right: 8px; }
.sd-life-action {
  text-align: center;
  margin-top: 8px;
}
.sd-life-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 28px;
  background: #e8384f;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  transition: background .15s;
}
.sd-life-btn:hover { background: #d42e44; }

/* ── School Details — ISD Accordion ── */
.isd-details-section {
  background: #ecedf2;
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 20px;
}
.isd-details-header {
  font-size: 22px;
  font-weight: 800;
  color: #1e293b;
  letter-spacing: -0.5px;
}
.isd-details-divider {
  width: 48px;
  height: 3px;
  background: #e8384f;
  border-radius: 2px;
  margin: 10px 0 12px;
}
.isd-details-desc {
  font-size: 13px;
  color: #64748b;
  margin-bottom: 18px;
  line-height: 1.5;
}
.isd-details-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.isd-acc-item {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  border-left: 3.5px solid #e8384f;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
}
.isd-acc-trigger {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  cursor: pointer;
  transition: background .12s;
  user-select: none;
}
.isd-acc-trigger:hover { background: #fafafa; }
.isd-acc-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
}
.isd-acc-title {
  font-size: 15px;
  font-weight: 700;
  color: #1e293b;
  flex: 1;
}
.isd-acc-trigger::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: 2px solid #94a3b8;
  border-bottom: 2px solid #94a3b8;
  transform: rotate(45deg);
  transition: transform .2s;
  flex-shrink: 0;
}
.isd-acc-item.open .isd-acc-trigger::after {
  transform: rotate(-135deg);
}
.isd-acc-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
}
.isd-acc-item.open .isd-acc-body {
  max-height: 800px;
}
.isd-acc-row {
  display: flex;
  align-items: baseline;
  padding: 11px 18px;
  border-top: 1px solid #f0f0f0;
  gap: 16px;
  font-size: 13.5px;
  line-height: 1.55;
}
.isd-acc-q {
  flex: 0 0 35%;
  text-align: right;
  color: #94a3b8;
  font-weight: 500;
  padding-right: 12px;
}
.isd-acc-a {
  flex: 1;
  color: #1e293b;
  font-weight: 600;
}

/* ── Mobile for Life + Accordion ── */
@media(max-width:640px){
  .sd-life-section { padding: 16px; }
  .sd-life-header { font-size: 18px; }
  .sd-life-slide { width: 200px; height: 140px; }
  .sd-life-arrow { width: 30px; height: 30px; }
  .isd-details-section { padding: 16px; }
  .isd-details-header { font-size: 18px; }
  .isd-acc-trigger { padding: 12px 14px; }
  .isd-acc-row { flex-direction: column; gap: 4px; padding: 10px 14px; }
  .isd-acc-q { text-align: left; flex: none; padding-right: 0; font-size: 12px; }
  .isd-acc-a { font-size: 13px; }
}

/* 2026-10-02: 모바일 헤더 Pro 버튼 줄바꿈 방지, 뒤로가기와 영문 소제목 간격 */
.topbar-upgrade-btn{white-space:nowrap}
.page-head button.back{display:block;margin-bottom:6px}
@media(max-width:480px){
  .topbar-upgrade-btn{font-size:11px;padding:6px 10px}
  .topbar-upgrade-btn .hide-xs{display:none}
}

/* ── Guide (formal) ── */
.gd{max-width:820px;margin:0 auto;padding:0 20px 64px;color:var(--ink)}
.gd p{font-size:15px;line-height:1.8;margin:0 0 12px;color:#2b3a4a}
.gd-toc{border:1px solid var(--line);border-radius:12px;background:#fff;padding:18px 22px;margin:0 0 36px}
.gd-toc-title{font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--muted);margin-bottom:8px}
.gd-toc ol{margin:0;padding-left:20px;font-size:14px;line-height:2}
.gd-toc a{color:var(--navy);text-decoration:none;border-bottom:1px solid transparent}
.gd-toc a:hover{border-bottom-color:var(--navy)}
.gd-part{padding-top:8px;margin-bottom:56px;scroll-margin-top:90px}
.gd-part-label{font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--accent);margin-bottom:6px}
.gd-part-title{font-size:26px;line-height:1.35;margin:0 0 14px;color:var(--navy);padding-bottom:14px;border-bottom:2px solid var(--navy)}
.gd .gd-lead{font-size:15.5px;color:#334155;margin:18px 0 8px;padding-left:16px;border-left:3px solid var(--line)}
.gd-h{font-size:18px;font-weight:700;margin:0 0 10px;color:var(--navy)}
.gd .guide-section{border-bottom:1px solid var(--line)}
.gd .guide-section>div:last-child{min-width:0;flex:1}
.gd .guide-num{background:transparent;color:var(--navy);border:1.5px solid var(--navy);font-size:15px;font-weight:700}
.gd-list{margin:12px 0 4px;padding:14px 18px 14px 34px;background:#f7f9fb;border:1px solid #edf1f5;border-radius:10px;font-size:14px;line-height:1.75;color:#334155}
.gd-list li{margin:3px 0}
.gd-list li::marker{color:var(--muted)}
.gd-steps{margin:8px 0;padding:0;list-style:none;counter-reset:gs;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.gd-steps li{counter-increment:gs;display:flex;gap:14px;padding:12px 16px;font-size:14px;background:#fff;border-bottom:1px solid var(--line)}
.gd-steps li:last-child{border-bottom:0}
.gd-steps li::before{content:counter(gs) ".";font-weight:700;color:var(--navy);min-width:18px}
.gd-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin:14px 0}
.gd-grid-2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.gd .guide-card{border-radius:10px;border-color:var(--line);padding:14px 16px}
.gd .guide-card b{font-size:14px}
.gd .guide-card span{font-size:13px;color:#52606d}
.gd-note{background:#f7f9fb;border-left:3px solid var(--navy);padding:12px 16px;border-radius:0 8px 8px 0;font-size:14px!important}
.gd-table-wrap{overflow-x:auto;margin:12px 0;border:1px solid var(--line);border-radius:10px}
.gd-table{width:100%;border-collapse:collapse;font-size:14px;background:#fff}
.gd-table th{background:#f2f5f8;color:var(--navy);text-align:left;font-weight:700;padding:10px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.gd-table td{padding:10px 14px;border-bottom:1px solid #eef2f6;vertical-align:top;line-height:1.6}
.gd-table tr:last-child td{border-bottom:0}
.gd-table td:first-child{font-weight:600;white-space:nowrap}
.gd-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.gd .gd-source{font-size:12.5px;color:var(--muted);margin-top:8px}
.gd-cta{background:var(--navy);color:#fff;border-radius:14px;padding:32px 28px;text-align:center;margin-top:24px}
.gd-cta h2{font-size:21px;margin:0 0 10px;color:#fff}
.gd .gd-cta p{color:#b6c2cf;margin:0 0 20px}
.gd-cta-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.gd-btn{padding:11px 26px;border-radius:8px;font-weight:700;font-size:14px;cursor:pointer;border:1px solid rgba(255,255,255,.5);background:transparent;color:#fff}
.gd-btn-primary{background:#fff;color:var(--navy);border-color:#fff}
@media(max-width:640px){.gd{padding:0 16px 48px}.gd-part-title{font-size:22px}.gd-table td:first-child{white-space:normal}.gd-list{padding-left:30px}}
.gd .gd-lead+.gd-h{margin-top:26px}
.sd-badge-boarding{background:#ecfdf5;color:#047857}
.boarding-tag{font-size:9px;font-weight:700;color:#047857;margin-left:6px;padding:2px 6px;background:#d1fae5;border-radius:4px;vertical-align:middle;white-space:nowrap}
.sd-why-prog-desc{overflow-wrap:anywhere}
.sd-camps-intro{font-size:13px;color:var(--muted);line-height:1.7;margin:0 0 14px}
.sd-camps-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.sd-camp-card{border:1px solid #e5e7eb;border-radius:14px;padding:14px;background:#fff;display:flex;flex-direction:column;gap:6px;min-width:0}
.sd-camp-top{display:flex;gap:6px;flex-wrap:wrap}
.sd-camp-type{font-size:10px;font-weight:700;color:#047857;background:#d1fae5;padding:2px 7px;border-radius:5px}
.sd-camp-age{font-size:10px;font-weight:700;color:#1d4ed8;background:#dbeafe;padding:2px 7px;border-radius:5px}
.sd-camp-name{font-weight:800;font-size:15px;color:var(--navy)}
.sd-camp-en{font-size:11px;color:var(--muted);margin-top:-4px}
.sd-camp-dates{margin:2px 0 0;padding-left:16px;font-size:12px;line-height:1.6;color:#334155}
.sd-camp-desc{font-size:12px;line-height:1.6;color:#475569;overflow-wrap:anywhere}
.sd-camp-price{font-size:13px;font-weight:700;color:#b45309}
.sd-camp-inc{font-size:11px;color:var(--muted);line-height:1.5}
.sd-camp-link{font-size:12px;font-weight:600;color:#2563eb;margin-top:auto;text-decoration:none}
.sd-camps-note{font-size:12px;color:#92400e;background:#fffbeb;border-radius:10px;padding:10px 12px;margin-top:12px;line-height:1.6}
.sd-camps-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}
.sd-camp-btn{font-size:13px;font-weight:700;padding:8px 14px;border-radius:10px;background:#0f766e;color:#fff;text-decoration:none}
.sd-camp-btn.ghost{background:#f1f5f9;color:#0f172a}
.sd-camps-contact{font-size:12px;color:var(--muted)}
.sd-camps-upd{font-size:11px;color:#94a3b8;margin-top:8px}
.sd-camp-accom{margin-top:16px;border:1px solid #e0e7ef;border-radius:14px;padding:16px;background:linear-gradient(135deg,#f8fafc 0%,#f0fdf4 100%)}
.sd-accom-header{font-weight:800;font-size:15px;color:var(--navy);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sd-accom-header svg{flex-shrink:0}
.sd-accom-en{font-size:11px;font-weight:400;color:var(--muted)}
.sd-accom-photos{display:flex;gap:6px;overflow-x:auto;margin:12px 0 10px;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding-bottom:4px}
.sd-accom-ph{flex:0 0 auto;width:140px;height:100px;border-radius:10px;overflow:hidden;scroll-snap-align:start}
.sd-accom-ph img{width:100%;height:100%;object-fit:cover}
.sd-accom-desc{font-size:12px;line-height:1.7;color:#475569;margin:0 0 8px}
.sd-accom-feat{margin:0 0 10px;padding-left:18px;font-size:12px;line-height:1.8;color:#334155}
.sd-accom-feat li::marker{color:#10b981}
.sd-accom-info{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:11px;color:#64748b;line-height:1.5;margin-bottom:10px}
.sd-accom-info b{color:#334155;margin-right:3px}
.sd-accom-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ── School Events ─────────────────────────── */
.sd-events-section{margin:0 0 20px;background:linear-gradient(135deg,#fef3c7 0%,#fff7ed 50%,#fffbeb 100%);border-radius:16px;padding:20px;border:2px solid #f59e0b33;position:relative;overflow:hidden}
.sd-events-section::before{content:'';position:absolute;top:-30px;right:-30px;width:100px;height:100px;background:#f59e0b15;border-radius:50%}
.sd-events-header{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:800;color:#92400e;margin-bottom:16px}
.sd-events-header svg{stroke:#f59e0b;flex-shrink:0}
.sd-event-card{background:#fff;border-radius:14px;padding:18px;box-shadow:0 2px 12px rgba(0,0,0,.06);position:relative}
.sd-event-card+.sd-event-card{margin-top:12px}
.sd-event-top{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.sd-event-type{font-size:11px;font-weight:700;padding:4px 10px;border-radius:99px;background:#dbeafe;color:#1e40af;text-transform:uppercase;letter-spacing:.5px}
.sd-event-type.oh{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.sd-event-dday{font-size:12px;font-weight:800;color:#dc2626;background:#fee2e2;padding:3px 10px;border-radius:99px;animation:ddayPulse 2s ease-in-out infinite}
@keyframes ddayPulse{0%,100%{opacity:1}50%{opacity:.7}}
.sd-event-title{font-size:20px;font-weight:800;color:#1e293b;margin-bottom:2px}
.sd-event-title-en{font-size:14px;font-weight:600;color:#64748b;margin-bottom:8px}
.sd-event-date{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:#92400e;margin-bottom:8px}
.sd-event-date svg{stroke:#f59e0b}
.sd-event-tagline{font-size:15px;font-weight:700;color:#b45309;font-style:italic;margin-bottom:6px}
.sd-event-desc{font-size:13px;color:#475569;line-height:1.7;margin-bottom:14px}
.sd-event-sessions{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:14px}
.sd-event-session{background:#f8fafc;border-radius:12px;padding:14px;border:1px solid #e2e8f0}
.sd-event-sess-name{font-size:15px;font-weight:800;color:#1e293b;margin-bottom:4px}
.sd-event-sess-grades{font-size:12px;color:#64748b;margin-bottom:6px}
.sd-event-sess-time{display:flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:#0369a1}
.sd-event-sess-time svg{stroke:#0ea5e9}
.sd-event-contact{display:flex;flex-wrap:wrap;gap:8px 14px;font-size:12px;margin-bottom:12px}
.sd-event-contact a{color:#2563eb;text-decoration:none;font-weight:500}
.sd-event-contact a:hover{text-decoration:underline}
.sd-event-btn{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;font-size:14px;font-weight:700;padding:12px 24px;border-radius:12px;text-decoration:none;transition:transform .15s,box-shadow .15s;box-shadow:0 2px 8px #f59e0b40}
.sd-event-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px #f59e0b50}
.sd-event-source{font-size:10px;color:#94a3b8;margin-top:10px}
@media(max-width:600px){
  .sd-events-section{padding:14px}
  .sd-event-title{font-size:17px}
  .sd-event-sessions{grid-template-columns:1fr}
}

/* ── Inquiry Form ─────────────────────────────────────── */
.inquiry-form-section{background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:14px;padding:24px}
.inquiry-form-section .sd-section-title{color:#10263d;font-size:18px;margin-bottom:2px}
.inquiry-subtitle{color:#64748b;font-size:13px;margin:0 0 18px;line-height:1.5}
.inquiry-subtitle b{color:#10263d}
.inq-fieldset{border:none;padding:0;margin:0 0 18px}
.inq-legend{font-size:12px;font-weight:700;color:#1688d8;text-transform:uppercase;letter-spacing:.5px;padding:0;margin-bottom:10px;border-bottom:1px solid #e2e8f0;padding-bottom:6px;width:100%;display:block}
.inq-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.inquiry-row{margin-bottom:12px}
.inquiry-row label{display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:4px}
.inquiry-row .req{color:#ef4444}
.inquiry-row input[type="text"],
.inquiry-row input[type="email"],
.inquiry-row input[type="tel"],
.inquiry-row input[type="month"],
.inquiry-row select,
.inquiry-row textarea{width:100%;padding:9px 12px;border:1.5px solid #cbd5e1;border-radius:8px;font-size:14px;background:#fff;color:#1e293b;transition:border-color .2s,box-shadow .2s;box-sizing:border-box;font-family:inherit}
.inquiry-row input:focus,
.inquiry-row select:focus,
.inquiry-row textarea:focus{border-color:#1688d8;box-shadow:0 0 0 3px rgba(22,136,216,.12);outline:none}
.inquiry-row textarea{resize:vertical;min-height:72px}
.inquiry-row select{appearance:auto}
.inquiry-child-block{margin-bottom:8px;padding-bottom:8px;border-bottom:1px dashed #e2e8f0}
.inquiry-child-block:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.inquiry-child-header{font-size:13px;font-weight:700;color:#1688d8;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.inquiry-remove-child{background:none;border:none;color:#94a3b8;font-size:18px;cursor:pointer;padding:2px 6px;border-radius:4px}
.inquiry-remove-child:hover{color:#ef4444;background:#fef2f2}
.inquiry-grade-hint{margin-top:6px;padding:8px 12px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;font-size:12px;color:#1e40af;line-height:1.5;animation:fadeIn .3s ease}
.inquiry-add-child-btn{display:inline-block;background:none;border:1px dashed #94a3b8;color:#64748b;font-size:12px;font-weight:600;padding:6px 14px;border-radius:6px;cursor:pointer;transition:all .2s;margin-top:4px}
.inquiry-add-child-btn:hover{background:#f1f5f9;color:#1688d8;border-color:#1688d8}
.inquiry-privacy{margin-top:4px}
.inquiry-privacy label{display:flex;align-items:flex-start;gap:8px;font-size:11.5px;color:#64748b;font-weight:400;cursor:pointer;line-height:1.5}
.inquiry-privacy input[type="checkbox"]{margin-top:2px;flex-shrink:0}
.inquiry-submit-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:13px;background:linear-gradient(135deg,#f5ad1b 0%,#f59e0b 100%);color:#10263d;font-size:15px;font-weight:700;border:none;border-radius:10px;cursor:pointer;transition:all .2s;margin-top:6px}
.inquiry-submit-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(245,173,27,.35)}
.inquiry-submit-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}
.inquiry-success{text-align:center;padding:32px 16px}
.inquiry-success svg{margin-bottom:12px}
.inquiry-success h3{font-size:20px;color:#10263d;margin:0 0 8px}
.inquiry-success p{color:#64748b;font-size:14px;margin:0}
.inquiry-error{background:#fef2f2;color:#dc2626;padding:12px 16px;border-radius:10px;font-size:13px;text-align:center}
.inquiry-login-prompt{text-align:center;padding:32px 20px;background:#f8fafc;border:1.5px dashed #cbd5e1}
.inquiry-login-msg{color:#64748b;font-size:14px;margin:8px 0 16px}
.inquiry-login-btn{display:inline-flex;align-items:center;gap:8px;background:#1688d8;color:#fff;font-size:14px;font-weight:600;border:none;border-radius:10px;padding:12px 24px;cursor:pointer;transition:all .2s}
.inquiry-login-btn:hover{background:#1270b8}
@media(max-width:600px){
  .inquiry-form-section{padding:18px 14px}
  .inq-grid-2{grid-template-columns:1fr}
  .inquiry-submit-btn{font-size:14px;padding:12px}
}
@keyframes fadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.spinner{width:32px;height:32px;border:3px solid #e5e7eb;border-top-color:var(--accent,#1688d8);border-radius:50%;animation:spin .7s linear infinite;margin:0 auto}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── Search Page Map ────────────────────────── */
.search-map-wrap{
  margin:0 auto 20px;max-width:1100px;padding:0 clamp(12px,3vw,32px);
}
.search-map-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;
  background:var(--card);border:1px solid var(--line);
  border-radius:14px 14px 0 0;
  cursor:pointer;
}
.search-map-wrap.collapsed .search-map-header{border-radius:14px}
.search-map-title{
  display:flex;align-items:center;gap:8px;
  font-size:14px;font-weight:700;color:var(--ink);
}
.search-map-title svg{color:var(--accent);flex-shrink:0}
.search-map-count{
  font-size:12px;font-weight:500;color:var(--muted);
  background:var(--soft);padding:2px 8px;border-radius:20px;
}
.search-map-toggle{
  display:flex;align-items:center;justify-content:center;
  width:32px;height:32px;border:none;background:var(--soft);
  border-radius:8px;cursor:pointer;color:var(--muted);transition:all .15s;
}
.search-map-toggle:hover{background:var(--line);color:var(--ink)}
.search-map-wrap.collapsed .search-map-chevron{transform:rotate(180deg)}
.search-map-chevron{transition:transform .3s ease}
.search-map-body{
  height:480px;overflow:hidden;
  border:1px solid var(--line);border-top:none;
  border-radius:0 0 14px 14px;
  transition:height .4s cubic-bezier(.4,0,.2,1);
}
.search-map-wrap.collapsed .search-map-body{height:0;border:none}
#searchMap{width:100%;height:100%;background:#0d1b2a}

/* Cluster icons */
.smap-cluster-wrap{background:none!important;border:none!important}
.smap-cluster{
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:13px;
  border:2.5px solid #fff;
  box-shadow:0 3px 12px rgba(37,99,235,.45),0 0 0 3px rgba(37,99,235,.15);
  transition:transform .15s;cursor:pointer;
}
.smap-cluster:hover{transform:scale(1.12)}
.smap-cluster-n{line-height:1}
.smap-cluster-label{
  font-size:10px;font-weight:700;color:var(--ink);
  text-align:center;white-space:nowrap;
  margin-top:2px;line-height:1.1;
  text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;
}

/* School pin */
.smap-pin{background:none!important;border:none!important}
.smap-pin-dot{
  width:20px;height:20px;
  background:#2563eb;border:2.5px solid #fff;border-radius:50%;
  box-shadow:0 1px 6px rgba(0,0,0,.35);
  transition:transform .15s;
}
.smap-pin-dot:hover{transform:scale(1.25)}
/* Dimmed markers for non-filtered schools */
.smap-pin-dim .smap-pin-dot,.smap-pin-dot.smap-dim{
  width:12px;height:12px;
  background:#94a3b8;border:1.5px solid #fff;
  opacity:.35;box-shadow:none;
}
.smap-pin-dot.smap-dim:hover{opacity:.7;transform:scale(1.2)}

/* Popup */
.smap-popup-wrap .leaflet-popup-content-wrapper{
  border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.15);
  font-family:inherit;
}
.smap-popup-wrap .leaflet-popup-tip{box-shadow:0 4px 12px rgba(0,0,0,.08)}
.smap-popup{padding:4px 2px}
.smap-popup-name{
  font-size:14px;font-weight:700;color:#10263d;
  text-decoration:none;display:block;line-height:1.3;
}
.smap-popup-name:hover{color:#2563eb}
.smap-popup-loc{font-size:12px;color:#66788a;margin-top:3px}
.smap-popup-curr{font-size:11px;color:#2563eb;margin-top:2px;font-weight:600}
.smap-popup-btn{
  display:inline-block;margin-top:8px;padding:5px 12px;
  background:#2563eb;color:#fff;border-radius:8px;
  font-size:11px;text-decoration:none;font-weight:600;
  transition:background .15s;
}
.smap-popup-btn:hover{background:#1d4ed8}

/* Map zoom controls style */
#searchMap .leaflet-control-zoom a{
  width:30px;height:30px;line-height:30px;font-size:16px;
  border-radius:8px;background:var(--card);color:var(--ink);
  border:1px solid var(--line);
}
#searchMap .leaflet-control-zoom{border:none;box-shadow:0 2px 8px rgba(0,0,0,.12);border-radius:10px;overflow:hidden}
#searchMap .leaflet-control-zoom a+a{border-top:1px solid var(--line)}

@media(max-width:600px){
  .search-map-wrap{padding:0 12px}
  .search-map-body{height:300px}
  .search-map-header{padding:10px 12px}
  .search-map-title{font-size:13px}
  .smap-cluster-label{font-size:9px}
}

/* ── Comparison Table ───────────────────────── */
.compare-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;border:1px solid var(--border);border-radius:12px;overflow:hidden;min-width:540px}
.compare-tbl th{padding:14px 16px;text-align:left;font-size:13px;font-weight:700;background:#f8fafc;border-bottom:2px solid var(--border)}
.compare-tbl td{padding:14px 16px;border-bottom:1px solid #f1f5f9;vertical-align:top;line-height:1.6}
.compare-tbl tbody tr:last-child td{border-bottom:none}
.compare-tbl tbody tr:hover{background:#f8fafc}
.compare-tbl td:nth-child(2){color:#64748b}
.compare-tbl td:nth-child(3){color:var(--navy);background:#f0f7ff}
@media(max-width:600px){
  .compare-tbl{font-size:13px}
  .compare-tbl th,.compare-tbl td{padding:10px 12px}
}

/* ── Trust Banner ───────────────────────────── */
.trust-banner{display:flex;justify-content:center;gap:clamp(24px,5vw,56px);padding:36px clamp(16px,4vw,60px);background:linear-gradient(135deg,#0c1e33 0%,#1a365d 100%);flex-wrap:wrap}
.trust-item{text-align:center;min-width:80px}
.trust-item strong{display:block;font-size:32px;font-weight:900;color:#fbbf24;letter-spacing:-.5px}
.trust-item span{font-size:12px;color:rgba(255,255,255,.65);font-weight:500;text-transform:uppercase;letter-spacing:.5px;margin-top:2px;display:block}
@media(max-width:600px){
  .trust-banner{gap:16px;padding:24px 16px}
  .trust-item strong{font-size:24px}
  .trust-item span{font-size:10px}
}
/* ── Inquiry Purpose Radio ──────────────────── */
.inq-purpose-wrap{display:flex;flex-direction:column;gap:8px}
.inq-purpose-opt{display:flex;align-items:flex-start;gap:10px;padding:10px 14px;border:1.5px solid #e2e8f0;border-radius:10px;cursor:pointer;transition:all .15s;background:#fff}
.inq-purpose-opt:hover{border-color:var(--accent);background:#f0f7ff}
.inq-purpose-opt input[type="radio"],.inq-purpose-opt input[type="checkbox"]{margin-top:3px;accent-color:var(--accent);width:16px;height:16px;flex-shrink:0}
.inq-purpose-opt:has(input:checked),.inq-purpose-opt.checked{border-color:var(--accent);background:#f0f7ff;box-shadow:0 0 0 2px rgba(22,136,216,.15)}
.inq-purpose-label{font-size:14px;font-weight:600;color:var(--navy);display:block}
.inq-purpose-opt small{font-size:12px;color:var(--muted);display:block;margin-top:2px}
.inq-multi{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:600px){
  .inq-purpose-opt{padding:8px 10px}
  .inq-purpose-label{font-size:13px}
  .inq-multi{grid-template-columns:1fr}
}
/* ── AI Chat Widget ─────────────────────────── */
.ai-chat-fab{position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:var(--accent);border:none;cursor:pointer;box-shadow:0 4px 20px rgba(22,136,216,.4);display:flex;align-items:center;justify-content:center;z-index:9999;transition:transform .2s,box-shadow .2s}
.ai-chat-fab:hover{transform:scale(1.08);box-shadow:0 6px 28px rgba(22,136,216,.5)}
.ai-chat-panel{position:fixed;bottom:90px;right:24px;width:360px;max-height:500px;background:#fff;border-radius:16px;box-shadow:0 8px 40px rgba(0,0,0,.18);z-index:9998;display:flex;flex-direction:column;overflow:hidden;border:1px solid #e2e8f0}
.ai-chat-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:var(--accent);color:#fff;font-size:15px;font-weight:700}
.ai-chat-close{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:0;opacity:.8}
.ai-chat-close:hover{opacity:1}
.ai-chat-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;min-height:200px;max-height:340px}
.ai-msg{display:flex}
.ai-msg-user{justify-content:flex-end}
.ai-msg-bot{justify-content:flex-start}
.ai-msg-bubble{max-width:85%;padding:10px 14px;border-radius:14px;font-size:13px;line-height:1.6}
.ai-msg-user .ai-msg-bubble{background:var(--accent);color:#fff;border-bottom-right-radius:4px}
.ai-msg-bot .ai-msg-bubble{background:#f1f5f9;color:var(--navy);border-bottom-left-radius:4px}
.ai-msg-bubble a{color:var(--accent);font-weight:600;text-decoration:underline}
.ai-msg-user .ai-msg-bubble a{color:#fff}
.ai-suggest-wrap{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.ai-suggest{background:#e8f4fd;border:1px solid #c3daf5;color:var(--accent);font-size:12px;font-weight:600;padding:6px 12px;border-radius:20px;cursor:pointer;transition:all .15s}
.ai-suggest:hover{background:var(--accent);color:#fff}
.ai-chat-input-wrap{display:flex;gap:8px;padding:12px;border-top:1px solid #e2e8f0;background:#fafbfc}
.ai-chat-input-wrap input{flex:1;padding:9px 14px;border:1.5px solid #e2e8f0;border-radius:10px;font-size:13px;outline:none;transition:border-color .15s}
.ai-chat-input-wrap input:focus{border-color:var(--accent)}
.ai-chat-input-wrap button{padding:9px 16px;background:var(--accent);color:#fff;border:none;border-radius:10px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap}
.ai-chat-input-wrap button:hover{background:#1270b5}
@media(max-width:639px){
  .ai-chat-fab{bottom:calc(66px + env(safe-area-inset-bottom,0px));right:16px;width:50px;height:50px}
  .ai-chat-panel{right:8px;left:8px;width:auto;bottom:calc(126px + env(safe-area-inset-bottom,0px));max-height:60vh}
}

/* ── Grade Calc FAQ ───────────────────────────────────── */
.gc-faq-list{display:flex;flex-direction:column;gap:8px}
.gc-faq{background:#f8fafc;border:1px solid var(--border);border-radius:10px;overflow:hidden}
.gc-faq summary{padding:12px 16px;font-size:14px;font-weight:700;color:var(--navy);cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px}
.gc-faq summary::before{content:'Q';display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:var(--accent);color:#fff;border-radius:6px;font-size:11px;font-weight:800;flex-shrink:0}
.gc-faq summary::after{content:'';margin-left:auto;width:8px;height:8px;border-right:2px solid #94a3b8;border-bottom:2px solid #94a3b8;transform:rotate(45deg);transition:transform .2s;flex-shrink:0}
.gc-faq[open] summary::after{transform:rotate(-135deg)}
.gc-faq summary::-webkit-details-marker{display:none}
.gc-faq p{margin:0;padding:0 16px 14px 46px;font-size:13px;color:#475569;line-height:1.8}

/* ── Bookmark (찜하기) ────────────────────────────────── */
.bk-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border:1.5px solid #e2e8f0;border-radius:8px;
  background:#fff;color:#cbd5e1;cursor:pointer;transition:all .18s;flex-shrink:0;
  padding:0;
}
.bk-btn:hover{color:#f43f5e;border-color:#fda4af;background:#fff1f2}
.bk-btn.bk-on{color:#f43f5e;border-color:#fda4af;background:#fff1f2}
.sd-action-bookmark{color:#94a3b8;transition:all .18s}
.sd-action-bookmark:hover,.sd-action-bookmark.sd-bk-on{color:#f43f5e;background:#fff1f2;border-color:#fda4af}
.bk-row{align-items:center;gap:12px}
.bk-row h3{margin:0 0 2px;font-size:15px}
.bk-row p{margin:0;font-size:12px;color:var(--muted)}

/* === School Posts (sp-*) === */
.sp-container{padding:0 !important;}
.sp-post{border-bottom:1px solid var(--border);padding:24px 20px;}
.sp-post:last-child{border-bottom:none;}
.sp-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.sp-cat{font-size:11px;font-weight:700;padding:2px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:0.5px;}
.sp-cat-admission{background:#dbeafe;color:#1e40af;}
.sp-cat-news{background:#dcfce7;color:#166534;}
.sp-cat-event{background:#fef3c7;color:#92400e;}
.sp-cat-tuition{background:#fce7f3;color:#9d174d;}
.sp-cat-campus{background:#e0e7ff;color:#3730a3;}
.sp-cat-achievement{background:#fef9c3;color:#854d0e;}
.sp-meta time{font-size:12px;color:var(--muted);}
.sp-title{font-size:18px;font-weight:700;margin:0 0 12px;line-height:1.4;}
.sp-body{font-size:14px;line-height:1.8;color:var(--fg);margin-bottom:16px;}
.sp-cover{margin-bottom:16px;border-radius:12px;overflow:hidden;}
.sp-cover img{width:100%;height:auto;display:block;}
.sp-video{position:relative;padding-bottom:56.25%;height:0;margin-bottom:16px;border-radius:12px;overflow:hidden;}
.sp-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;}
.sp-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px;margin-bottom:16px;}
.sp-gallery-item{border-radius:8px;overflow:hidden;aspect-ratio:4/3;}
.sp-gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.2s;}
.sp-gallery-item img:hover{transform:scale(1.05);}
.sp-link{display:inline-block;font-size:14px;font-weight:600;color:var(--primary);text-decoration:none;padding:8px 0;}
.sp-link:hover{text-decoration:underline;}
@media(max-width:520px){
  .sp-gallery{grid-template-columns:repeat(2,1fr);}
  .sp-title{font-size:16px;}
}

/* === School Member UI (sm-*) === */
.sm-hero{background:linear-gradient(135deg,#10263d 0%,#1a3a5c 100%);color:#fff;padding:48px 24px;border-radius:16px;margin-bottom:24px;text-align:center}
.sm-hero h1{font-size:26px;font-weight:800;margin:0 0 8px}
.sm-hero p{opacity:.7;font-size:14px;margin:0}
.sm-step-bar{display:flex;gap:0;margin-bottom:28px;position:relative}
.sm-step{flex:1;text-align:center;position:relative;padding-bottom:12px}
.sm-step::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--border);border-radius:2px}
.sm-step.active::after{background:var(--accent)}
.sm-step.done::after{background:#16a34a}
.sm-step-num{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;font-size:12px;font-weight:700;margin-bottom:4px}
.sm-step.active .sm-step-num{background:var(--accent);color:#fff}
.sm-step.done .sm-step-num{background:#16a34a;color:#fff}
.sm-step:not(.active):not(.done) .sm-step-num{background:var(--border);color:var(--muted)}
.sm-step-label{display:block;font-size:11px;color:var(--muted);font-weight:600}
.sm-step.active .sm-step-label{color:var(--accent)}
.sm-school-item{padding:14px 16px;border:1px solid var(--border);border-radius:10px;margin-bottom:8px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:border-color .15s,box-shadow .15s}
.sm-school-item:hover{border-color:var(--accent);box-shadow:0 0 0 2px rgba(22,136,216,.1)}
.sm-school-item b{font-size:14px}
.sm-school-item .sm-loc{font-size:12px;color:var(--muted);margin-top:2px}
.sm-badge{font-size:10px;font-weight:700;padding:3px 8px;border-radius:4px;white-space:nowrap}
.sm-badge-manual{background:#fef3c7;color:#92400e}
.sm-badge-domain{background:#dcfce7;color:#166534}
.sm-not-found{padding:24px;text-align:center;border:2px dashed var(--border);border-radius:12px;margin-top:12px}
.sm-not-found p{color:var(--muted);font-size:13px;margin:0 0 12px}
.sm-field{margin-bottom:16px}
.sm-field label{font-size:13px;font-weight:600;display:block;margin-bottom:5px;color:var(--fg)}
.sm-field label span{font-weight:400;color:var(--muted)}
.sm-field input,.sm-field textarea,.sm-field select{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--border);font-size:14px;background:var(--bg);color:var(--fg);transition:border-color .15s}
.sm-field input:focus,.sm-field textarea:focus,.sm-field select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px rgba(22,136,216,.1)}
.sm-field textarea{resize:vertical;line-height:1.6}
.sm-btn{width:100%;padding:13px;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;border:none;transition:opacity .15s}
.sm-btn:disabled{opacity:.5;cursor:not-allowed}
.sm-btn-primary{background:var(--accent);color:#fff}
.sm-btn-secondary{background:none;border:1px solid var(--border);color:var(--muted);font-size:13px;margin-top:8px}
.sm-btn-primary:hover:not(:disabled){opacity:.9}
.sm-info-box{background:#f0f9ff;border:1px solid #bfdbfe;border-radius:10px;padding:14px 16px;margin-bottom:16px;font-size:13px;color:#1e40af;line-height:1.6}
.sm-warn-box{background:#fef3c7;border:1px solid #fde68a;border-radius:10px;padding:14px 16px;margin-bottom:16px;font-size:13px;color:#92400e;line-height:1.6}
.sm-err{color:#dc2626;font-size:13px;margin-bottom:8px;display:none}
.sm-ok{color:#166534;font-size:13px;margin-bottom:8px;display:none}
/* Dashboard tabs */
.sd-tab-bar{display:flex;gap:0;border-bottom:1px solid var(--border);margin-bottom:20px;overflow-x:auto}
.sd-tab{padding:11px 18px;font-size:13px;font-weight:600;border:none;background:none;cursor:pointer;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap;transition:color .15s,border-color .15s}
.sd-tab.active{color:var(--accent);border-bottom-color:var(--accent)}
.sd-tab:hover:not(.active){color:var(--fg)}
.sd-card{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:20px;text-align:center}
.sd-card-num{font-size:28px;font-weight:800;color:var(--fg)}
.sd-card-label{font-size:12px;color:var(--muted);margin-top:4px}
.sd-post-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border)}
.sd-post-row:last-child{border-bottom:none}
.sd-post-status{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:8px}
.sd-post-status.live{background:#16a34a}
.sd-post-status.off{background:#dc2626}
.sm-divider{border:none;border-top:1px solid var(--border);margin:20px 0}
.sm-section-title{font-size:15px;font-weight:700;margin:0 0 16px;color:var(--fg)}
@media(max-width:520px){
  .sm-hero h1{font-size:22px}
  .sm-step-label{font-size:10px}
  .sd-tab{padding:10px 12px;font-size:12px}
}

/* ── Mobile header fix (2026-10-12): keep logo intact, single-line actions ── */
.topbar-auth > * { white-space: nowrap; flex-shrink: 0 }
.mnav-extra { display: none }
@media (max-width: 800px) {
  .topbar { flex-wrap: nowrap; gap: 6px }
  .topbar .brand, .brand-logo-wrap { flex-shrink: 0 !important; min-width: auto !important }
  #authButtons { flex: 1 1 auto; min-width: 0; display: flex; justify-content: flex-end }
  .topbar-auth { gap: 6px; flex-wrap: nowrap }
  .topbar-auth .topbar-lang { margin-right: 0 !important }
  .topbar-auth .topbar-lang button { padding: 4px 6px !important }
  .topbar-sep, .topbar-school-chip, .topbar-admin-badge { display: none !important }
  .user-chip { padding: 2px !important; gap: 0 !important }
  .user-chip span { display: none }
  .mobile-menu { flex-shrink: 0 }
  .mnav-extra { display: flex; gap: 8px; flex-wrap: wrap; padding: 10px 16px 14px; border-top: 1px solid rgba(255,255,255,.12) }
  .mnav-extra button { background: none; border: 1px dashed rgba(255,255,255,.35); color: #fff; font-size: 13px; font-weight: 600; padding: 8px 12px; border-radius: 8px; cursor: pointer }
}
@media (max-width: 400px) {
  .brand-logo-wrap svg { width: 26px; height: 26px }
  .topbar-auth .btn-login { padding: 6px 8px }
}
.mnav-login { display: none }
@media (max-width: 480px) {
  .topbar-auth .btn-login { display: none }
  .mnav-extra .mnav-login { display: inline-block }
  .topbar-auth .btn-signup { padding: 8px 12px }
}
@media (max-width: 400px) {
  .topbar-auth .topbar-lang button { padding: 4px 5px !important }
  .topbar-auth .btn-signup { padding: 7px 10px; font-size: 13px }
  .topbar { padding-left: 12px; padding-right: 8px }
}

/* ── Free guide offer (학비 지도책) ── */
.gm-home{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;align-items:stretch}
.gm-offer{display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:center;background:#142a43;color:#e2e8f0;border-radius:14px;padding:26px 30px}
.gm-art{display:grid;gap:10px;padding:6px 0;border-left:1px solid #2c4565}
.gm-row{position:relative;display:block;height:10px}
.gm-row i{position:absolute;top:0;height:10px;border-radius:5px;background:#e9a23b}
.gm-row:nth-child(2n) i{opacity:.7}
.gm-kicker{margin:0 0 4px;font-size:12px;color:#e9a23b;font-weight:700}
.gm-offer h3{margin:0 0 8px;font-size:21px;line-height:1.3;color:#fff;font-weight:800}
.gm-offer p{margin:0 0 14px;font-size:14px;line-height:1.65;color:#cbd5e1;max-width:62ch}
.gm-btn{background:#e9a23b;color:#142a43;border:0;border-radius:8px;padding:11px 20px;font-weight:800;font-size:14px;cursor:pointer}
.gm-btn:hover{background:#f2b456}
.gm-btn:focus-visible,.gm-board:focus-visible,.bd-chip:focus-visible,.bd-exam:focus-visible,.bd-more:focus-visible{outline:3px solid #60a5fa;outline-offset:2px}
.gm-note{display:inline-block;margin-left:12px;font-size:12px;color:#9fb0c4}
.gm-board{display:flex;flex-direction:column;justify-content:center;gap:6px;text-align:left;background:#fff;border:1px solid var(--border,#e2e8f0);border-radius:14px;padding:24px;cursor:pointer;color:#142a43}
.gm-board b{font-size:19px;font-weight:800}
.gm-board span{font-size:13px;color:#64748b;line-height:1.5}
.gm-board:hover{border-color:#142a43}
.gm-compact{grid-template-columns:1fr;padding:20px;gap:14px}
.gm-compact .gm-art{display:none}
.gm-compact h3{font-size:17px}
.gm-compact p{font-size:13px}
.gm-compact .gm-note{display:block;margin:8px 0 0}
@media(max-width:800px){.gm-home{grid-template-columns:1fr}.gm-offer{grid-template-columns:1fr;padding:22px}.gm-art{display:none}.gm-note{display:block;margin:8px 0 0}}

/* ── Boarding page ── */
.bd-page{max-width:1180px;margin:0 auto;padding:28px 20px 60px}
.bd-hero h1{margin:0 0 8px;font-size:clamp(30px,5vw,44px);font-weight:900;color:#142a43;letter-spacing:-.5px}
.bd-hero>p{margin:0 0 20px;color:#475569;font-size:16px;line-height:1.6;max-width:62ch}
.bd-chips{display:flex;flex-wrap:wrap;gap:8px}
.bd-chip{display:inline-flex;align-items:baseline;gap:8px;background:#fff;border:1px solid #d6dde6;border-radius:999px;padding:7px 14px;cursor:pointer;color:#142a43;font-size:14px}
.bd-chip b{font-size:15px;font-weight:800;color:#b7791f}
.bd-chip.on{background:#142a43;border-color:#142a43;color:#fff}
.bd-chip.on b{color:#e9a23b}
.bd-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;margin-top:26px;align-items:start}
.bd-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:14px;color:#475569}
.bd-bar select{margin-left:8px;padding:6px 8px;border:1px solid #d6dde6;border-radius:6px;font-size:14px;background:#fff}
.bd-list{display:grid;gap:12px}
.bd-more{display:block;margin:18px auto 0;background:#fff;border:1px solid #142a43;color:#142a43;border-radius:8px;padding:10px 22px;font-weight:700;cursor:pointer}
.bd-side{position:sticky;top:84px;display:grid;gap:16px}
.bd-box{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:18px}
.bd-box h2{margin:0 0 12px;font-size:16px;font-weight:800;color:#142a43}
.bd-exam{display:grid;grid-template-columns:1fr auto;gap:2px 10px;width:100%;text-align:left;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:10px 12px;margin-bottom:8px;cursor:pointer}
.bd-exam b{color:#142a43;font-size:15px}
.bd-exam span{grid-column:1;font-size:12.5px;color:#64748b;line-height:1.45}
.bd-exam em{grid-column:2;grid-row:1/3;align-self:center;font-style:normal;font-size:12.5px;font-weight:700;color:#b7791f}
.bd-exam:hover{border-color:#142a43}
.bd-tl{margin:0}
.bd-tl dt{font-weight:800;color:#142a43;font-size:13.5px;margin-top:10px}
.bd-tl dt:first-child{margin-top:0}
.bd-tl dd{margin:3px 0 0;font-size:13px;color:#475569;line-height:1.55}
.bd-src{margin:10px 0 0;font-size:12px;color:#94a3b8}
.bd-faq{margin-top:44px;max-width:760px}
.bd-faq h2{font-size:22px;font-weight:800;color:#142a43;margin:0 0 12px}
.bd-faq details{border-top:1px solid #e2e8f0;padding:14px 0}
.bd-faq summary{cursor:pointer;font-weight:700;color:#142a43;font-size:15px}
.bd-faq details p{margin:10px 0 0;color:#475569;line-height:1.7;font-size:14.5px}
@media(max-width:960px){.bd-grid{grid-template-columns:1fr}.bd-side{position:static}}
.bd-scale{display:grid;grid-template-columns:minmax(0,1fr) 300px;font-size:11.5px;color:#94a3b8;margin:0 0 4px}
.bd-scale span:nth-child(n+2){display:none}
.bd-scale span:first-child{display:none}
.bd-list{display:block;border-top:1px solid #e2e8f0}
.bd-row{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:center;padding:13px 4px;border-bottom:1px solid #e2e8f0;text-decoration:none;color:inherit}
.bd-row:hover{background:#f8fafc}
.bd-row:focus-visible{outline:3px solid #60a5fa;outline-offset:-3px}
.bd-name b{display:block;color:#142a43;font-size:15.5px;font-weight:700;line-height:1.35}
.bd-name small{display:block;color:#64748b;font-size:12.5px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bd-feewrap{display:grid;gap:5px}
.bd-track{position:relative;height:8px;background:repeating-linear-gradient(90deg,#eef2f6 0 1px,transparent 1px 33.33%);border-left:1px solid #cbd5e1}
.bd-track i{position:absolute;top:0;height:8px;border-radius:4px;background:#e9a23b}
.bd-fee{font-size:13px;font-weight:700;color:#142a43}
.bd-fee small{margin-left:6px;font-weight:600;font-size:11px;color:#2f7d6d}
.bd-nofee{color:#94a3b8;font-weight:500}
@media(max-width:640px){.bd-row{grid-template-columns:1fr;gap:8px}}
.bd-fee small.est{color:#94a3b8}