/* ============================================================
   哈萨克斯坦留学门户 · 主题样式
   基座：Bootstrap 5.3（CDN）之上做美学覆写
   字体：Noto Serif SC（展示） + Noto Sans SC（正文） + Playfair Display（数字/拉丁）
   ============================================================ */

/* —— Web 字体引用：使用 Google Fonts 国内官方镜像 fonts.googleapis.cn（字体文件走 fonts.gstatic.cn），
   国内访问稳定，无需自建；若个别网络仍不理想，可整体替换主机为第三方镜像：
   fonts.font.im / fonts.loli.net（把下方 fonts.googleapis.cn 换成其中之一即可）。
   字体名与下方 :root 变量无需改动。 —— */
@import url("https://fonts.googleapis.cn/css2?family=Noto+Serif+SC:wght@400;500;700;900&family=Noto+Sans+SC:wght@400;500;700&family=Playfair+Display:wght@700&display=swap");

:root{
  /* —— 70-20-10 配色体系 —— */
  --kz-ink:        #0d1b2e;   /* 主文字 */
  --kz-ink-2:      #37485f;   /* 次级文字 */
  --kz-ink-3:      #6d7d94;   /* 辅助文字 */
  --kz-brand:      #1a4fc4;   /* 主色 70% · 藏青蓝（信任/教育） */
  --kz-brand-deep: #0f2f7a;
  --kz-accent:     #0d9488;   /* 次色 20% · 青绿（丝路/生机） */
  --kz-gold:       #c98a1e;   /* 点缀 10% · 琥珀金（权威/荣誉） */

  /* —— 表面与纵深（禁用纯白平铺） —— */
  --kz-bg:         #f4f7fc;
  --kz-bg-alt:     #eef3fb;
  --kz-surface:    #ffffff;
  --kz-line:       #dde5f0;
  --kz-shadow-sm:  0 1px 3px rgba(13,27,46,.06);
  --kz-shadow:     0 6px 22px rgba(13,27,46,.08);
  --kz-shadow-lg:  0 18px 50px rgba(13,27,46,.14);

  /* —— 字体 —— */
  /* 展示/标题衬线：Web 字体 Noto Serif SC 优先；未加载时回退到常见中文衬线系统字体，
     最后才到 Georgia/Times（仅拉丁字形），避免中文被强制映射到默认无衬线字体 */
  --f-display: "Playfair Display","Noto Serif SC","Source Han Serif SC","Songti SC","SimSun","STSong",Georgia,"Times New Roman",serif;
  --f-head:    "Noto Serif SC","Source Han Serif SC","Songti SC","SimSun","STSong",Georgia,"Times New Roman",serif;
  /* 正文无衬线：Web 字体 Noto Sans SC 优先；回退到常见中文无衬线系统字体 */
  --f-body:    "Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Heiti SC",sans-serif;

  --r-sm: 8px; --r: 14px; --r-lg: 20px;
  --sp-section: clamp(48px, 7vw, 92px);
}

/* 页面底噪点 + 极浅渐变，营造纵深而非纯白 */
body{
  font-family: var(--f-body);
  font-size: 16.5px;
  line-height: 1.72;
  color: var(--kz-ink);
  background-color: var(--kz-bg);
  background-image:
    radial-gradient(1200px 600px at 12% -8%, rgba(26,79,196,.10), transparent 60%),
    radial-gradient(900px 500px at 92% 4%, rgba(13,148,136,.09), transparent 62%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
}
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important;
     transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* —— 排版层级：2 倍以上跳跃 —— */
h1,h2,h3,.h-display{ font-family: var(--f-head); font-weight:700; letter-spacing:.01em; line-height:1.28; }
h1{ font-size: clamp(30px, 5vw, 52px); }
h2{ font-size: clamp(24px, 3.4vw, 36px); }
h3{ font-size: clamp(19px, 2.2vw, 24px); }
h4,h5{ font-family: var(--f-body); font-weight:700; }
p{ margin: 0 0 1em; }
.display-num{ font-family: var(--f-display); font-weight:700; letter-spacing:-.02em; }

/* —— 链接与焦点（无障碍） —— */
a{ color: var(--kz-brand); text-decoration:none; transition:color .15s ease; }
a:hover{ color: var(--kz-brand-deep); text-decoration:none; }
a:visited{ color:#4b5b86; }
a:active{ color:var(--kz-gold); }
:focus-visible{ outline:3px solid var(--kz-gold); outline-offset:2px; border-radius:4px; }
.skip-link{ position:absolute; left:-9999px; top:0; z-index:9999; background:var(--kz-ink); color:#fff; padding:10px 18px; }
.skip-link:focus{ left:12px; top:12px; }

/* ————— 导航 ————— */
.navbar-kz{
  background: rgba(255,255,255,.86);
  backdrop-filter: saturate(160%) blur(12px);
  border-bottom:1px solid var(--kz-line);
  box-shadow: var(--kz-shadow-sm);
  padding-top:.55rem; padding-bottom:.55rem;
}
.navbar-kz .navbar-brand{ font-family:var(--f-head); font-weight:900; font-size:20px; color:var(--kz-ink); letter-spacing:.02em; }
.navbar-kz .navbar-brand .dot{ color:var(--kz-accent); }
.navbar-kz .nav-link{
  color:var(--kz-ink-2); font-weight:500; font-size:15px;
  padding:.55rem .85rem; border-radius:var(--r-sm); min-height:44px; display:flex; align-items:center;
}
.navbar-kz .nav-link:hover,.navbar-kz .nav-link:focus{ color:var(--kz-brand); background:rgba(26,79,196,.07); text-decoration:none; }
.navbar-kz .nav-link.active{ color:var(--kz-brand); background:rgba(26,79,196,.10); font-weight:700; }
@media (max-width:991.98px){
  .navbar-kz .nav-link{ padding:.7rem .9rem; min-height:48px; }
}

/* ————— 按钮 ————— */
.btn{ border-radius:999px; padding:.72rem 1.5rem; font-weight:600; font-size:15.5px; min-height:46px; transition:transform .18s ease, box-shadow .18s ease, background .18s ease; }
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:linear-gradient(135deg,var(--kz-brand) 0%, #3a72e8 100%); border:none; box-shadow:0 8px 22px rgba(26,79,196,.28); }
.btn-primary:hover,.btn-primary:focus{ background:linear-gradient(135deg,var(--kz-brand-deep) 0%, var(--kz-brand) 100%); box-shadow:0 12px 28px rgba(26,79,196,.36); }
.btn-accent{ background:linear-gradient(135deg,var(--kz-accent) 0%, #17b3a3 100%); border:none; color:#fff; box-shadow:0 8px 22px rgba(13,148,136,.26); }
.btn-accent:hover,.btn-accent:focus{ color:#fff; filter:brightness(1.06); }
.btn-outline-brand{ border:2px solid var(--kz-brand); color:var(--kz-brand); background:transparent; }
.btn-outline-brand:hover,.btn-outline-brand:focus{ background:var(--kz-brand); color:#fff; }
/* Hero 内描边按钮：蓝底上默认态改为白边白字，保证清晰可见（悬停再填充品牌色） */
.hero-kz .btn-outline-brand{ border-color:rgba(255,255,255,.85); color:#fff; }
.hero-kz .btn-outline-brand:hover,.hero-kz .btn-outline-brand:focus{ background:#fff; color:var(--kz-brand); border-color:#fff; }
/* 按钮实际用 <a> 标签实现跳转，全局 a:visited 会把已访问按钮文字变成灰紫 (#4b5b86)，在 Hero 蓝底上几乎看不见；
   必须显式覆盖 visited 态，保持按钮自身配色。 */
.btn-primary:visited{ color:#fff; }
.btn-accent:visited{ color:#fff; }
.btn-outline-brand:visited{ color:var(--kz-brand); }
.hero-kz .btn-outline-brand:visited{ color:#fff; }

/* ————— Hero 内文字高对比度（蓝色渐变上必须够亮） ————— */
/* kicker：原本用青色(--kz-accent)与蓝色 hero 同色系，对比极低 → 改为白色+字阴影 */
.hero-kz .kicker{ color:rgba(255,255,255,.92); text-shadow:0 1px 8px rgba(13,27,46,.45); margin-bottom:.6rem; }
/* uni-en：未单独定义，原本继承白色但因 text-shadow 偏糊 → 给足字体粗细、字阴影、间距 */
.hero-kz .uni-en{ color:#fff; font-weight:600; font-size:clamp(16px,2vw,20px); letter-spacing:.01em; text-shadow:0 1px 12px rgba(13,27,46,.5); margin-bottom:.85rem; }
/* hero 内徽章：原本浅蓝字配浅色胶囊，与蓝底同色完全看不见 → 改为半透明白底+白字+白边 */
.hero-kz .badge-soft,
.hero-kz .badge-acc,
.hero-kz .badge-gold{
  background:rgba(255,255,255,.18);
  color:#fff;
  border:1px solid rgba(255,255,255,.45);
  -webkit-backdrop-filter:blur(2px);
  backdrop-filter:blur(2px);
  text-shadow:0 1px 6px rgba(13,27,46,.35);
  font-weight:600;
}

.btn-gold{ background:linear-gradient(135deg,var(--kz-gold) 0%, #e5ac4a 100%); border:none; color:#2a1c02; font-weight:700; }
.btn-gold:hover{ color:#2a1c02; filter:brightness(1.06); }

/* ————— 卡片 ————— */
.card-kz{
  background:var(--kz-surface); border:1px solid var(--kz-line); border-radius:var(--r);
  box-shadow:var(--kz-shadow-sm); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card-kz:hover{ transform:translateY(-4px); box-shadow:var(--kz-shadow); border-color:rgba(26,79,196,.25); }
.card-kz .card-body{ padding:1.35rem; }
.kicker{ font-size:12.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--kz-accent); margin-bottom:.5rem; }

/* ————— Hero ————— */
.hero-kz{
  position:relative; overflow:hidden; color:#fff;
  /* 参考哈萨克斯坦国旗：天蓝为主色、金色为点缀，整体调轻、不再压抑；
     最上层叠加极淡暗色蒙版 + 文字阴影以保全白文字可读性 */
  background:
    linear-gradient(135deg, rgba(13,27,46,.26) 0%, rgba(13,27,46,.12) 55%, rgba(13,27,46,.04) 100%),
    linear-gradient(135deg, #1c74b0 0%, #34a0cf 50%, #15a394 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");
  border-radius:var(--r-lg);
  padding: clamp(40px, 6vw, 78px) clamp(24px, 5vw, 62px);
  box-shadow: var(--kz-shadow-lg);
  text-shadow: 0 1px 16px rgba(13,27,46,.30);
}
.hero-kz h1{ color:#fff; margin-bottom:.6rem; }
.hero-kz .lead{ color:rgba(255,255,255,.94); font-size:clamp(16px,1.9vw,19px); max-width:60ch; text-shadow:0 1px 12px rgba(13,27,46,.34); }
.hero-kz::after{
  content:""; position:absolute; right:-90px; bottom:-110px; width:340px; height:340px; border-radius:50%;
  background:radial-gradient(circle, rgba(201,138,30,.34), transparent 68%); pointer-events:none;
}
.hero-stat{ border-left:3px solid rgba(255,255,255,.4); padding-left:1rem; }
.hero-stat .display-num{ font-size:clamp(26px,3.4vw,38px); color:#fff; line-height:1.1; }
.hero-stat small{ color:rgba(255,255,255,.82); font-size:13px; display:block; }

/* ————— 授权书墙（记忆点） ————— */
.auth-marquee{ position:relative; overflow:hidden; padding:6px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); }
.auth-track{ display:flex; gap:18px; width:max-content; animation:kz-marquee 38s linear infinite; }
.auth-marquee:hover .auth-track{ animation-play-state:paused; }
@keyframes kz-marquee{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
/* ————— 授权书墙 ————— */
.auth-wall{ align-items: stretch; }

.auth-card{
  height: 100%;
  background: var(--kz-surface);
  border: 1px solid var(--kz-line);
  border-radius: var(--r);
  padding: 20px;
  text-align: center;
  box-shadow: var(--kz-shadow-sm);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  display: flex;
  flex-direction: column;
}
.auth-card:hover{
  transform: translateY(-5px);
  box-shadow: var(--kz-shadow);
  border-color: rgba(26,79,196,.20);
}

.auth-card-frame{
  position: relative;
  padding: 12px;
  margin-bottom: 16px;
  background: linear-gradient(145deg, #f8fafc 0%, #eef3fb 100%);
  border: 1px solid #e3eaf5;
  border-radius: 12px;
  flex: 1 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 1px 3px rgba(13,27,46,.04);
}

.auth-card-img{
  width: 100%;
  aspect-ratio: 3/4;
  min-height: 150px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 6px;
  filter: drop-shadow(0 5px 14px rgba(13,27,46,.12));
  transition: transform .35s ease;
}
.auth-card:hover .auth-card-img{
  transform: scale(1.02);
}

.auth-card-tag{
  position: absolute;
  top: 8px;
  right: 8px;
  background: rgba(13,148,136,.92);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  letter-spacing: .04em;
  box-shadow: 0 2px 8px rgba(13,148,136,.28);
}

.auth-card-body{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.auth-card-body strong{
  font-family: var(--f-head);
  font-size: 16px;
  font-weight: 700;
  color: var(--kz-ink);
  line-height: 1.35;
}
.auth-card-meta{
  font-size: 12px;
  color: var(--kz-ink-3);
  letter-spacing: .02em;
}

/* 首页授权书走马灯中的卡片保持固定宽度（.auth-track 是横向无限滚动容器） */
.auth-track .auth-card{
  width: 250px;
  flex: 0 0 auto;
}

@media (max-width: 575.98px){
  .auth-card{ padding: 14px; border-radius: var(--r-sm); }
  .auth-card-frame{ padding: 8px; margin-bottom: 12px; }
  .auth-card-body strong{ font-size: 14px; }
  .auth-card-tag{ font-size: 9.5px; padding: 3px 7px; }
}

/* ————— 数字看板 ————— */
.stat-tile{ background:var(--kz-surface); border:1px solid var(--kz-line); border-radius:var(--r); padding:22px; text-align:center; box-shadow:var(--kz-shadow-sm); height:100%; }
/* 费用数字：改用等宽无衬线数字，避免衬线字体下 ¥ 与数字显示风格不统一 */
.stat-tile .display-num{ font-family:var(--f-body); font-weight:800; font-variant-numeric:tabular-nums; letter-spacing:-.01em; font-size:clamp(26px,3.6vw,40px); color:var(--kz-brand); line-height:1.05; }
.stat-tile-label{ display:block; color:var(--kz-ink); font-weight:700; font-size:15px; margin-bottom:.4rem; }
.stat-tile-sub{ display:block; color:var(--kz-ink-2); font-size:13.5px; margin-top:.5rem; font-variant-numeric:tabular-nums; }
.stat-tile .lb{ color:var(--kz-ink-2); font-size:14px; margin-top:.35rem; }
.stat-tile .src{ color:var(--kz-ink-3); font-size:11.5px; margin-top:.3rem; }

/* ————— 筛选条 ————— */
.filter-bar{ background:var(--kz-surface); border:1px solid var(--kz-line); border-radius:var(--r); padding:18px; box-shadow:var(--kz-shadow-sm); }
.filter-bar .form-label{ font-size:13px; font-weight:700; color:var(--kz-ink-2); margin-bottom:.35rem; }
/* 筛选行：标签固定宽度在左，选项自动换行在右；行间细分割线 */
.filter-row{ display:flex; flex-wrap:wrap; align-items:flex-start; gap:10px 18px; padding:12px 0; border-bottom:1px dashed var(--kz-line); }
.filter-row:last-child{ border-bottom:none; padding-bottom:0; }
.filter-label{ flex:0 0 auto; min-width:60px; font-weight:700; font-size:13.5px; color:var(--kz-ink-2); padding-top:8px; }
.filter-items{ flex:1 1 auto; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
/* 筛选项：胶囊样式；选中态填充品牌色，与普通态明显区分 */
.filter-item{
  display:inline-flex; align-items:center; padding:.42rem .95rem; font-size:14px;
  color:var(--kz-ink-2); background:#f3f7fc; border:1px solid var(--kz-line);
  border-radius:999px; text-decoration:none; white-space:nowrap; transition:all .15s ease;
}
.filter-item:hover{ color:var(--kz-brand); border-color:rgba(26,79,196,.4); background:rgba(26,79,196,.07); text-decoration:none; }
.filter-item.on{
  color:#fff; font-weight:600; text-decoration:none;
  background:linear-gradient(135deg,var(--kz-brand),#3a72e8); border-color:transparent;
  box-shadow:0 4px 12px rgba(26,79,196,.25);
}
/* 院校名称搜索：输入框与按钮同一行 */
.filter-items form{ flex:1 1 260px; flex-wrap:nowrap; min-width:240px; }
.filter-items form .form-control{ flex:1 1 auto; }
.filter-items form .btn{ flex:0 0 auto; white-space:nowrap; }
.form-select,.form-control{ border:1.5px solid var(--kz-line); border-radius:var(--r-sm); min-height:46px; font-size:15.5px; }
.form-select:focus,.form-control:focus{ border-color:var(--kz-brand); box-shadow:0 0 0 3px rgba(26,79,196,.15); }

/* 专业名称搜索框（前台专业库 / 院校专业专页共用） */
.prog-search{ max-width:560px; }
.prog-search .input-group-text{ background:var(--kz-surface); border-color:var(--kz-line); color:var(--kz-ink-2); font-weight:600; }
.prog-search .form-control{ min-height:46px; }
.prog-search .form-select{ min-height:46px; max-width:120px; flex:0 0 auto; }

/* ————— 院校卡 ————— */
.uni-card .logo{
  height:64px; border-radius:10px; display:grid; place-items:center; margin-bottom:12px;
  font-family:var(--f-head); font-weight:900; font-size:17px; color:#fff; letter-spacing:.04em;
}
.uni-card .meta{ font-size:13.5px; color:var(--kz-ink-2); }
.uni-card .tags span{ font-size:11.5px; }
/* ————— 院校卡（首页/院校库通用） ————— */
.uni-card{
  display:block;
  background:var(--kz-surface); border:1px solid var(--kz-line); border-radius:var(--r);
  box-shadow:var(--kz-shadow-sm); overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.uni-card:hover{ transform:translateY(-4px); box-shadow:var(--kz-shadow); border-color:rgba(26,79,196,.25); }
.uni-card .uni-card-banner{ position:relative; }
/* 院校背景图(banner)上的「地点」徽章：叠加在任意底图上，必须高对比可读
   —— 深色半透明蒙版底 + 白字 + 白边 + 文字阴影 + 轻微毛玻璃，盖过花哨背景 */
.uni-card .uni-card-banner .badge-acc{
  position:absolute; left:12px; top:12px; z-index:2;
  background:rgba(13,27,46,.74);
  color:#fff;
  border:1px solid rgba(255,255,255,.55);
  font-weight:600; font-size:12.5px;
  padding:.4em .85em; border-radius:999px;
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  text-shadow:0 1px 6px rgba(0,0,0,.5);
  box-shadow:0 2px 10px rgba(0,0,0,.32);
}
.uni-card .uni-card-body{ padding:1.1rem 1.2rem 1.3rem; }
.uni-card .uni-card-body h3{ font-size:18px; margin-bottom:.2rem; color:var(--kz-ink); }
.uni-card .uni-card-en{ font-size:13px; color:var(--kz-ink-3); margin-bottom:.7rem; }
.uni-card-meta{ list-style:none; padding:0; margin:0 0 .9rem; }
.uni-card-meta li{ font-size:13px; color:var(--kz-ink-2); padding:4px 0; border-bottom:1px dashed var(--kz-line); }
.uni-card-meta li:last-child{ border-bottom:none; }
.uni-card-foot{ display:flex; flex-wrap:wrap; gap:6px; }
.uni-card-cost{ font-size:14px; color:var(--kz-ink-2); }
.uni-card-cost strong{ color:var(--kz-brand); }

/* ————— 表格（桌面表格 / 移动卡片） ————— */
.table-kz{ background:var(--kz-surface); border-radius:var(--r); overflow:hidden; box-shadow:var(--kz-shadow-sm); }
.table-kz thead th{ background:#eef3fb; color:var(--kz-ink-2); font-weight:700; font-size:13.5px; white-space:nowrap; }
.table-kz td,.table-kz th{ padding:.85rem 1rem; vertical-align:middle; }
.table-kz tbody tr:hover{ background:#f8fbff; }
@media (max-width:767.98px){
  .table-kz thead{ display:none; }
  .table-kz tbody tr{ display:block; border:1px solid var(--kz-line); border-radius:var(--r-sm); margin-bottom:12px; padding:6px; background:#fff; }
  .table-kz tbody td{ display:flex; justify-content:space-between; gap:14px; border:none; padding:.5rem .7rem; }
  .table-kz tbody td::before{ content:attr(data-label); font-weight:700; color:var(--kz-ink-3); font-size:13px; flex:0 0 auto; }
  .table-kz tbody td span{ text-align:right; }
}

/* ————— 步骤 / 流程 ————— */
/* 桌面端：横向步骤卡（auto-fit 自动适配 4/5 步，填满原本右侧空白）；
   移动端：纵向时间线 */
.step-flow{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; counter-reset:s; margin-top:1.5rem; }
.step-flow-item{
  position:relative; counter-increment:s;
  background:var(--kz-surface); border:1px solid var(--kz-line); border-radius:var(--r);
  padding:22px 18px 20px; text-align:center; box-shadow:var(--kz-shadow-sm);
  display:flex; flex-direction:column; align-items:center; transition:transform .2s ease, box-shadow .2s ease;
}
.step-flow-item:hover{ transform:translateY(-3px); box-shadow:var(--kz-shadow); }
.step-flow-num{
  width:46px; height:46px; border-radius:50%; margin-bottom:12px;
  background:linear-gradient(135deg,var(--kz-brand),#3a72e8); color:#fff;
  display:grid; place-items:center; font-family:var(--f-display); font-weight:700; font-size:18px;
  box-shadow:0 6px 16px rgba(26,79,196,.28);
}
.step-flow-item h3{ font-size:17px; margin-bottom:.4rem; color:var(--kz-ink); }
.step-flow-item p{ font-size:14px; color:var(--kz-ink-2); margin-bottom:0; }
.step-flow-item a{ font-size:14px; font-weight:600; margin-top:.5rem; }
/* 移动端：改为纵向时间线，编号在左、连接线贯穿 */
@media (max-width:767.98px){
  .step-flow{ display:block; }
  .step-flow-item{ text-align:left; align-items:flex-start; flex-direction:row; gap:14px; margin-bottom:14px; }
  .step-flow-item::before{
    content:""; position:absolute; left:22px; top:46px; bottom:-14px; width:2px;
    background:linear-gradient(180deg,rgba(26,79,196,.35),rgba(26,79,196,.06));
  }
  .step-flow-item:last-child::before{ display:none; }
  .step-flow-num{ margin-bottom:0; flex:0 0 auto; }
}

/* ————— 家长专区六宫格 ————— */
.parent-tile{
  display:flex; flex-direction:column;
  background:var(--kz-surface); border:1px solid var(--kz-line); border-radius:var(--r);
  padding:24px; height:100%; box-shadow:var(--kz-shadow-sm); transition:transform .2s ease, box-shadow .2s ease;
  position:relative; overflow:hidden;
}
.parent-tile::before{ content:""; position:absolute; inset:0 auto 0 0; width:4px; background:var(--kz-accent); }
.parent-tile:nth-child(2n)::before{ background:var(--kz-brand); }
.parent-tile:nth-child(3n)::before{ background:var(--kz-gold); }
.parent-tile:hover{ transform:translateY(-3px); box-shadow:var(--kz-shadow); }
.parent-tile .ic{ font-size:26px; line-height:1; margin-bottom:10px; }
.parent-tile h3{ font-size:19px; margin-bottom:.4rem; }
/* 问题文字超长时限制为 2 行，卡片不被撑变形；“查看答案”固定底部 */
.parent-tile-q{
  flex:1 1 auto;
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-size:16.5px; line-height:1.55; color:var(--kz-ink); font-weight:600;
  min-height:calc(1.55em * 2); margin-bottom:.6rem;
}
.parent-tile-more{ margin-top:auto; font-size:14px; font-weight:600; color:var(--kz-brand); }

/* ————— 费用条 ————— */
.cost-bar{ display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.cost-bar .nm{ flex:0 0 148px; font-size:14.5px; font-weight:600; }
.cost-bar .track{ flex:1; height:30px; background:#e9eff8; border-radius:999px; overflow:hidden; }
.cost-bar .fill{ height:100%; border-radius:999px; background:linear-gradient(90deg,var(--kz-brand),var(--kz-accent)); display:flex; align-items:center; justify-content:flex-end; padding-right:12px; color:#fff; font-size:13px; font-weight:700; min-width:64px; }
@media (max-width:575.98px){ .cost-bar{ flex-wrap:wrap; } .cost-bar .nm{ flex:0 0 100%; } }
/* 院校变多后，条形图列表可滚动，避免整页过长 */
.cost-bar-wrap{ max-height:460px; overflow:auto; padding:16px 18px; border:1px solid var(--kz-line); border-radius:var(--r); background:var(--kz-surface); }

/* ————— FAQ ————— */
.accordion-kz .accordion-item{ border:1px solid var(--kz-line); border-radius:var(--r-sm) !important; margin-bottom:10px; overflow:hidden; background:var(--kz-surface); }
.accordion-kz .accordion-button{ font-weight:600; font-size:16px; padding:1rem 1.15rem; min-height:56px; }
.accordion-kz .accordion-button:not(.collapsed){ background:linear-gradient(90deg,rgba(26,79,196,.08),rgba(13,148,136,.06)); color:var(--kz-brand-deep); box-shadow:none; }
.accordion-kz .accordion-button:focus{ box-shadow:0 0 0 3px rgba(26,79,196,.18); }
/* 费用页自定义手风琴项（非 Bootstrap accordion）*/
.accordion-kz-item{ border:1px solid var(--kz-line); border-radius:var(--r-sm); margin-bottom:12px; background:var(--kz-surface); padding:1rem 1.15rem; transition:border-color .15s ease, box-shadow .15s ease; }
.accordion-kz-item:last-child{ margin-bottom:0; }
.accordion-kz-item .accordion-kz-title{ font-size:16px; font-weight:700; margin:0 0 .35rem; color:var(--kz-ink); }
.accordion-kz-item .accordion-kz-body{ font-size:14.5px; color:var(--kz-ink-2); margin:0; line-height:1.7; }
.accordion-kz-item:hover{ border-color:rgba(26,79,196,.3); box-shadow:var(--kz-shadow-sm); }

/* ————— 图集 ————— */
.gallery-kz{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.gallery-kz figure{ margin:0; border-radius:var(--r-sm); overflow:hidden; background:linear-gradient(140deg,#dfe8f6,#cddced); aspect-ratio:4/3; display:grid; place-items:center; color:var(--kz-ink-3); font-size:13px; box-shadow:var(--kz-shadow-sm); }

/* ————— 面包屑 ————— */
.breadcrumb-kz{ font-size:13.5px; color:var(--kz-ink-3); margin-bottom:.6rem; }
.breadcrumb-kz a{ color:var(--kz-ink-3); }
.breadcrumb-kz a:hover{ color:var(--kz-brand); }
.breadcrumb-kz .sep{ margin:0 .45rem; opacity:.6; }
/* 面包屑位于 Hero（蓝底）内时，改用浅色文字，保证可读（其余页面在浅底上仍用灰字） */
.hero-kz .breadcrumb-kz,
.hero-kz .breadcrumb-kz a{ color:rgba(255,255,255,.88); }
.hero-kz .breadcrumb-kz a:hover{ color:#fff; }
.hero-kz .breadcrumb-kz .sep{ color:rgba(255,255,255,.6); }
/* Hero 内的面包屑（CreatBreadcrumb 输出 <ol class="breadcrumb">，不是 breadcrumb-kz） */
.hero-kz .breadcrumb{ background:transparent; padding:0; margin:0 0 .6rem; }
.hero-kz .breadcrumb-item,
.hero-kz .breadcrumb a{ color:rgba(255,255,255,.88); font-size:13.5px; text-shadow:0 1px 8px rgba(13,27,46,.35); }
.hero-kz .breadcrumb a:hover{ color:#fff; text-decoration:underline; }
.hero-kz .breadcrumb-item.active,
.hero-kz .breadcrumb-item.active[aria-current="page"]{ color:#fff; }
.hero-kz .breadcrumb-item + .breadcrumb-item::before{ color:rgba(255,255,255,.55); }


/* ————— 徽章 ————— */
.badge-soft{ background:rgba(26,79,196,.18); color:var(--kz-brand-deep); font-weight:600; padding:.45em .85em; border-radius:999px; font-size:12.5px; border:1px solid rgba(26,79,196,.28); display:inline-block; line-height:1.2; }
.badge-acc{ background:rgba(13,148,136,.20); color:#0a7a70; font-weight:600; padding:.45em .85em; border-radius:999px; font-size:12.5px; border:1px solid rgba(13,148,136,.32); display:inline-block; line-height:1.2; }
.badge-gold{ background:rgba(201,138,30,.22); color:#8f6212; font-weight:600; padding:.45em .85em; border-radius:999px; font-size:12.5px; border:1px solid rgba(201,138,30,.34); display:inline-block; line-height:1.2; }

/* ————— 区块 ————— */
.section{ padding-block: var(--sp-section); }
/* 数据墙压缩上下空白（UniversityShow 等含 stat-tile 的 section） */
#stat-wall{ padding-block: clamp(28px, 4vw, 44px); }
/* 院校介绍 section：压缩顶部留白（承接更紧的 stat-wall） */
#intro-section{ padding-top: clamp(20px, 3vw, 36px); }


.section-alt{ background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(238,243,251,.72)); border-block:1px solid var(--kz-line); }
.sec-head{ margin-bottom:32px; }
.sec-head .kicker{ display:block; }
.sec-head h2{ margin-bottom:.4rem; }
.sec-head p{ color:var(--kz-ink-2); max-width:70ch; }

/* ————— 页脚 ————— */
.footer-kz{ background:linear-gradient(180deg,#0d1b2e,#12294a); color:rgba(255,255,255,.76); padding:56px 0 28px; margin-top:0; }
.footer-kz h5{ color:#fff; font-size:15px; margin-bottom:14px; font-weight:700; }
.footer-kz a{ color:rgba(255,255,255,.72); font-size:14.5px; }
.footer-kz a:hover{ color:#fff; }
.footer-kz .bottom{ border-top:1px solid rgba(255,255,255,.13); margin-top:34px; padding-top:20px; font-size:13px; color:rgba(255,255,255,.56); }

/* ————— 页脚稳定置底（内容不足时仍贴底） —————
   关键：.card-kz 不再 height:100%，所以 col-lg-8 / col-lg-4 即便被 Bootstrap
   默认 stretch 等高，列内的 card 也是按内容高度渲染，不会出现"占满整屏的空白卡"。
   短页面下，#main flex:1 自身撑开吸收 min-height:100vh 留下的间隙，让 sidebar
   列也按内容高度呈现（卡片下方的空白是列间 padding 而非卡片内空白）。
   注意：不要给 main .row 全局写 align-items:flex-start，会冲掉 hero 的
   align-items-center 居中 logo 布局。 */
html, body { height: 100%; }
body > form { display: flex; flex-direction: column; min-height: 100vh; }
#main { flex: 1 0 auto; }
.site-footer { flex-shrink: 0; }
.footer-kz { flex-shrink: 0; }
/* ————— 悬浮 CTA（移动优先） ————— */
.fab-wrap{ position:fixed; right:16px; bottom:16px; z-index:1030; display:flex; flex-direction:column; gap:10px; }
.fab{ width:56px; height:56px; border-radius:50%; display:grid; place-items:center; border:none; color:#fff; font-size:20px; box-shadow:0 10px 26px rgba(13,27,46,.28); }
.fab-primary{ background:linear-gradient(135deg,var(--kz-brand),#3a72e8); }
@media (max-width:575.98px){
  .fab-wrap{ right:12px; bottom:12px; }
  .fab{ width:52px; height:52px; }
}

/* -------- 揭示动画 -------- */
/* 默认永远可见（opacity:1）；只有 JS 启用且未触发 .in 时才隐藏；
   即便 IO 永不回调 / JS 失败，关键内容也始终展示。 */
.reveal{ opacity:1; transform:none; transition:opacity .55s ease, transform .55s ease; }
html.js .reveal{ opacity:0; transform:translateY(14px); }
html.js .reveal.in{ opacity:1; transform:none; }

/* ============================================================
   以下为 WebForms 版新增：页头 / 页脚 / 表单
   （原静态站未使用用户控件，此处补齐对应样式）
   ============================================================ */

/* ————— 页头 ————— */
.site-header{ position:sticky; top:0; z-index:1020; background:var(--kz-surface); box-shadow:var(--kz-shadow-sm); }
.site-header .topbar{ background:var(--kz-ink); color:rgba(255,255,255,.78); font-size:13.5px; padding:7px 0; }
.site-header .topbar .topbar-phone strong{ color:var(--kz-gold); font-family:var(--f-display); letter-spacing:.02em; }
.site-header .navbar{ padding:.7rem 0; }
.site-header .navbar-brand{ gap:.55rem; }
.brand-mark{
  width:40px; height:40px; border-radius:11px; flex:0 0 auto;
  display:grid; place-items:center;
  background:linear-gradient(135deg,var(--kz-brand),var(--kz-accent));
  color:#fff; font-family:var(--f-display); font-weight:700; font-size:17px; letter-spacing:.04em;
}
.brand-text{ display:flex; flex-direction:column; line-height:1.2; }
.brand-text strong{ font-family:var(--f-head); font-size:18px; color:var(--kz-ink); }
.brand-text small{ font-size:11.5px; color:var(--kz-ink-3); letter-spacing:.06em; text-transform:uppercase; }
.site-header .nav-link{ font-size:15.5px; padding:.45rem .85rem !important; color:var(--kz-ink-2); }
.site-header .nav-link:hover,
.site-header .nav-link:focus{ color:var(--kz-brand); }
:focus-visible{ outline:2px solid var(--kz-gold); outline-offset:3px; }

/* ————— 页脚 ————— */
.site-footer{ background:linear-gradient(180deg,#0d1b2e,#12294a); color:rgba(255,255,255,.76); padding:56px 0 28px; }
.footer-brand{ display:flex; align-items:center; gap:.6rem; color:#fff; font-family:var(--f-head); font-size:18px; }
.footer-desc{ font-size:14.5px; color:rgba(255,255,255,.66); margin:.9rem 0 .6rem; }
.footer-hotline{ font-size:15px; }
.footer-hotline strong{ color:var(--kz-gold); font-family:var(--f-display); font-size:20px; }
.footer-title{ color:#fff; font-family:var(--f-head); font-size:16px; margin-bottom:14px; }
.footer-list{ list-style:none; padding:0; margin:0; }
.footer-list li{ margin-bottom:8px; }
.footer-list a{ color:rgba(255,255,255,.72); font-size:14.5px; text-decoration:none; }
.footer-list a:hover{ color:#fff; text-decoration:none; }
.footer-tip{ font-size:13px; color:rgba(255,255,255,.52); }
.footer-copy{ font-size:13px; color:rgba(255,255,255,.56); margin:0; }
.footer-links a{ color:rgba(255,255,255,.6); font-size:13px; margin-left:16px; text-decoration:none; }
.footer-links a:hover{ color:#fff; }
.site-footer hr{ border-color:rgba(255,255,255,.13); }

/* ————— 咨询表单 ————— */
.consult-form{ border-radius:var(--r-lg); background:var(--kz-surface); }
.consult-form .card-body{ padding:clamp(20px,3vw,32px); }
.form-title{ font-family:var(--f-head); font-size:21px; color:var(--kz-ink); margin-bottom:.35rem; }
.form-sub{ font-size:14.5px; color:var(--kz-ink-3); margin-bottom:1.2rem; }
.form-tip{ font-size:12.5px; color:var(--kz-ink-3); text-align:center; }
.consult-form .form-label{ font-size:14px; font-weight:600; color:var(--kz-ink-2); }
.consult-form .form-control,
.consult-form .form-select{ padding:.6rem .8rem; border-color:var(--kz-line); border-radius:var(--r-sm); }
.consult-form .form-control:focus,
.consult-form .form-select:focus{ border-color:var(--kz-brand); box-shadow:0 0 0 .2rem rgba(26,79,196,.14); }
.success-icon{
  width:56px; height:56px; margin:0 auto; border-radius:50%;
  display:grid; place-items:center; font-size:28px; color:#fff;
  background:linear-gradient(135deg,var(--kz-accent),#0fbfae);
}

/* ————— 院校图片尺寸约束（避免原图比例失控） ————— */
/* Logo：详情页校徽，限制最大高度，保持比例 */
.uni-logo{ max-height:120px; max-width:100%; width:auto; height:auto; object-fit:contain; }
/* 小通栏图：院校卡片背景，固定高度 + 裁切覆盖 */
.uni-card-banner{ height:160px; background-size:cover; background-position:center; background-repeat:no-repeat; border-radius:12px; }

/* ————— 申请指南页右栏：顶部对齐 + 桌面端吸顶 ————— */
/* 长内容页（如申请指南）右侧表单随滚动保持可见，避免“右栏下沉/漂移”的观感。
   真正的根因是咨询表单此前为嵌套 <form>（非法 HTML）被浏览器抬到页脚，
   已改为 <div> 承载；此处仅作视觉加固。 */
.row-align-start{ align-items:flex-start; }
@media (min-width:992px){
  .sidebar-affix{ position:sticky; top:90px; }
}

/* ————— 分页（院校库 / 专业库，沿用 Bootstrap .pagination） ————— */
.page-link{ color:var(--kz-brand); }
.page-link:hover{ color:var(--kz-brand-deep); }
.page-item.active .page-link{ background:var(--kz-brand); border-color:var(--kz-brand); }
.page-item.active .page-link:hover{ color:#fff; }
.pagination{ flex-wrap:wrap; row-gap:8px; }

/* ————— 院校专业专页：大领域分组 ————— */
.program-group{ margin-top:2rem; }
.program-group:first-of-type{ margin-top:0; }
.program-group-title{ font-size:1.12rem; font-weight:700; color:var(--kz-brand); margin-bottom:.9rem; padding-left:.65rem; border-left:4px solid var(--kz-brand); }

/* 专页：专业卡片内的英文名 / 元信息 / 区块副标题 */
.program-card-en{ font-size:.9rem; color:var(--kz-ink-2); margin:.1rem 0 .9rem; font-style:italic; }
.program-card-meta{ list-style:none; display:flex; flex-wrap:wrap; gap:.4rem .9rem; padding:0; margin:0; font-size:.85rem; color:var(--kz-ink-2); }
.program-card-meta li{ position:relative; padding-left:.7rem; }
.program-card-meta li::before{ content:""; position:absolute; left:0; top:.45em; width:4px; height:4px; border-radius:50%; background:var(--kz-accent); }
.sec-sub{ color:var(--kz-ink-2); font-size:1.02rem; margin-top:.6rem; }

/* ————— 院校专业专页：学历 Tab 增加边框，避免非 active 状态与背景融为一体 ————— */
.nav-kz-pills .nav-link{
  color:var(--kz-ink-2); font-weight:500; font-size:15px;
  padding:.55rem .95rem; border-radius:999px; min-height:44px; display:flex; align-items:center;
  border:1px solid var(--kz-line); background:#f8fafc; margin-right:.5rem;
}
.nav-kz-pills .nav-link:hover,.nav-kz-pills .nav-link:focus{
  color:var(--kz-brand); border-color:rgba(26,79,196,.4); background:rgba(26,79,196,.07); text-decoration:none;
}
.nav-kz-pills .nav-link.active{
  color:#fff; font-weight:600; background:linear-gradient(135deg,var(--kz-brand),#3a72e8);
  border-color:transparent; box-shadow:0 4px 12px rgba(26,79,196,.25);
}
.nav-kz-pills .nav-link .badge{ color:var(--kz-ink-2); background:#fff; }
.nav-kz-pills .nav-link.active .badge{ color:var(--kz-brand); background:#fff; }

/* ============================================================
   文章详情正文（.article-content）——
   ArticleShow.aspx:38 直出 NewsMdHelper 生成的 HTML（标题/段落/列表/
   引用/代码/表格/图片），统一版式与站点配色；表格复用 .table-kz 美学，
   并支持移动端堆叠卡片（data-label 由 NewsMdHelper 注入）。
   ============================================================ */
.article-content{ font-size:16.5px; line-height:1.85; color:var(--kz-ink); }
.article-content h2{ margin:1.8rem 0 .9rem; padding-bottom:.4rem; border-bottom:1px solid var(--kz-line); }
.article-content h3{ margin:1.5rem 0 .8rem; }
.article-content h4{ margin:1.2rem 0 .7rem; }
.article-content p{ margin:0 0 1.1rem; }
.article-content ul,.article-content ol{ margin:0 0 1.1rem; padding-left:1.5rem; }
.article-content li{ margin:.35rem 0; }
.article-content a{ color:var(--kz-brand); text-decoration:underline; text-underline-offset:2px; }
.article-content a:hover{ color:var(--kz-brand-deep); }
/* 图片响应式：不溢出正文容器；限制最大高度避免大图占满屏幕，居中展示 */
.article-content img{ max-width:100%; max-height:520px; width:auto; height:auto; display:block; border-radius:var(--r-sm); margin:1rem auto; box-shadow:var(--kz-shadow-sm); }
@media (max-width:767.98px){ .article-content img{ max-height:260px; } }
/* 引用：左侧品牌色描边 + 浅底 */
.article-content blockquote{
  margin:1.2rem 0; padding:.9rem 1.2rem; border-left:4px solid var(--kz-brand);
  background:rgba(26,79,196,.05); border-radius:0 var(--r-sm) var(--r-sm) 0; color:var(--kz-ink-2);
}
.article-content blockquote p{ margin:0 0 .5rem; }
.article-content blockquote p:last-child{ margin-bottom:0; }
/* 行内代码与代码块 */
.article-content code{ font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace; font-size:.92em; background:var(--kz-bg-alt); padding:.15em .4em; border-radius:6px; color:var(--kz-brand-deep); }
.article-content pre{ background:var(--kz-ink); color:#e6edf6; padding:1.1rem 1.2rem; border-radius:var(--r-sm); overflow:auto; margin:1.2rem 0; }
.article-content pre code{ background:none; color:inherit; padding:0; }

/* —— Markdown 表格（NewsMdHelper 输出 <table class="table table-bordered article-table">）—— */
/* 复用站点 .table-kz 的美学：浅底表头、行悬停高亮、单元格间距；Bootstrap .table-bordered 提供边框 */
.article-table{ width:100%; margin:1.4rem 0; font-size:15px; background:var(--kz-surface); box-shadow:var(--kz-shadow-sm); }
.article-table thead th{ background:#eef3fb; color:var(--kz-ink-2); font-weight:700; white-space:nowrap; border-bottom:2px solid var(--kz-line); }
.article-table td,.article-table th{ padding:.8rem 1rem; vertical-align:top; }
.article-table tbody tr:hover{ background:#f8fbff; }
/* 移动端：表格转为堆叠卡片，::before 显示列名（data-label 由 NewsMdHelper 注入） */
@media (max-width:767.98px){
  .article-table{ box-shadow:none; }
  .article-table thead{ display:none; }
  .article-table tbody tr{ display:block; border:1px solid var(--kz-line); border-radius:var(--r-sm); margin-bottom:12px; padding:6px; background:var(--kz-surface); box-shadow:var(--kz-shadow-sm); }
  .article-table tbody td{ display:flex; justify-content:space-between; gap:14px; border:none; border-bottom:1px dashed var(--kz-line); padding:.6rem .7rem; }
  .article-table tbody td:last-child{ border-bottom:none; }
  .article-table tbody td::before{ content:attr(data-label); font-weight:700; color:var(--kz-ink-3); font-size:13px; flex:0 0 auto; }
  .article-table tbody td > *{ text-align:right; }
}

/* ============================================================
   资讯列表页（/news/）与资讯详情页标题/图片尺寸调整
   ============================================================ */

/* 资讯列表页顶部大标题缩小 */
.news-sec-head h1{ font-size:clamp(26px, 3.6vw, 38px); margin-bottom:.5rem; }

/* 资讯列表项 */
.news-item{ padding:1.4rem 0; border-bottom:1px solid var(--kz-line); }
.news-item:last-child{ border-bottom:none; }
.news-item h2{ font-size:clamp(18px, 2.2vw, 24px); line-height:1.45; margin:0 0 .5rem; }
.news-item h2 a{ color:var(--kz-ink); text-decoration:none; }
.news-item h2 a:hover{ color:var(--kz-brand); }
.news-item p{ color:var(--kz-ink-2); font-size:15px; margin:0 0 .5rem; }
.news-item-meta{ font-size:13px; color:var(--kz-ink-3); }

/* 资讯详情页标题缩小 */
.article-detail h1{ font-size:clamp(24px, 3.6vw, 36px); margin-bottom:.6rem; }