:root {
  --mdac-navy: #071B3A;        /* 深藏蓝：官方感、顶部/banner */
  --mdac-blue: #1F4E8C;        /* 主蓝：导航、标题、重点边框 */
  --mdac-light-blue: #7F94C9;  /* 官方旧页面常见淡蓝 */
  --mdac-yellow: #F7D84A;      /* 马来西亚徽章/标题强调黄 */
  --mdac-red: #EF5B4C;         /* 注册按钮红橙 */
  --mdac-orange: #F59E2E;      /* 辅助提示色 */
  --mdac-bg: #F4F7FB;          /* 页面浅背景 */
  --mdac-card: #FFFFFF;        /* 内容卡片 */
  --mdac-border: #D9E1EE;      /* 表单边框 */
  --mdac-text: #1F2937;        /* 正文深灰 */
  --mdac-muted: #6B7280;       /* 辅助文字 */

  /* 兼容旧 CSS 变量，避免只改配色时影响布局 */
  --bg: var(--mdac-bg);
  --card: var(--mdac-card);
  --text: var(--mdac-text);
  --muted: var(--mdac-muted);
  --green: var(--mdac-blue);
  --green-dark: var(--mdac-navy);
  --line: var(--mdac-border);
  --red: var(--mdac-red);
  --orange: var(--mdac-orange);
  --shadow: 0 12px 32px rgba(7, 27, 58, 0.08);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  background: linear-gradient(180deg, var(--mdac-bg) 0%, #FFFFFF 100%);
  color: var(--text);
}
a { color: var(--green); text-decoration: none; }
.container { width: min(1100px, calc(100% - 32px)); margin: 0 auto; }
.narrow-wrap { width: min(760px, calc(100% - 32px)); margin: 0 auto 48px; }
.site-wrap { min-height: 100vh; }
.hero {
  padding: 48px 0 28px;
  background: radial-gradient(circle at top right, rgba(31, 78, 140, 0.13), transparent 30%), linear-gradient(180deg, #EAF0F8, #FFFFFF);
  border-bottom: 1px solid var(--line);
}
.small-hero,.mini-hero { padding: 32px 0 20px; }
.hero-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 24px; align-items: center; }
.eyebrow { margin: 0 0 10px; color: var(--green); font-weight: 700; font-size: 14px; letter-spacing: .08em; }
h1 { margin: 0 0 16px; font-size: clamp(30px, 4vw, 44px); line-height: 1.15; }
h2 { margin: 0 0 16px; font-size: 24px; }
h3 { margin: 0 0 12px; font-size: 18px; }
.hero-text, .lead, .field-help, .feature-item span, .knowledge-card p, p, li { color: var(--muted); font-size: 15px; line-height: 1.8; }
.hero-card, .card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: var(--shadow);
}
.hero-card { padding: 18px; display: grid; gap: 12px; }
.feature-item { padding: 14px; border-radius: 16px; background: #F8FAFD; }
.feature-item strong { display: block; margin-bottom: 4px; }
.hero-actions, .button-row { display: flex; gap: 12px; flex-wrap: wrap; }
.btn-primary, .btn-secondary {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px;
  padding: 0 18px; border-radius: 14px; border: 1px solid transparent; font-weight: 700; cursor: pointer;
}
.btn-primary { background: var(--green); color: #fff; }
.btn-primary:hover { background: var(--green-dark); }
.btn-secondary { background: #fff; color: var(--green); border-color: var(--line); }
.inline-btn { min-height: 42px; padding: 0 14px; margin-top: 8px; }
.page-grid { display: grid; grid-template-columns: 1.4fr .8fr; gap: 24px; margin: 30px auto 48px; }
.form-card, .info-card, .confirm-card, .pay-card, .section-card, .article-card { padding: 24px; }
.field { margin-bottom: 18px; }
.field label { display: block; margin-bottom: 8px; font-weight: 700; }
input[type="text"], input[type="email"], input[type="password"], input[type="date"], input[type="number"] {
  width: 100%; min-height: 48px; border: 1px solid var(--mdac-border); border-radius: 12px; padding: 12px 14px; font-size: 15px;
}
.ticket-grid { display: grid; gap: 12px; }
.ticket-row {
  display: grid; grid-template-columns: 1fr auto 92px; gap: 12px; align-items: center;
  border: 1px solid var(--line); border-radius: 14px; padding: 14px;
}
.ticket-row span { display: block; color: var(--muted); font-size: 13px; margin-top: 4px; }
.price-tag { color: var(--green-dark); font-weight: 700; white-space: nowrap; }
.alert { padding: 12px 14px; border-radius: 12px; margin-bottom: 16px; font-size: 14px; }
.alert.error, .mail-status.error { background: #fff1f1; color: #b42318; }
.alert.success, .mail-status.success { background: #edf9f1; color: #1b7f46; }
.info-list { margin: 0; padding-left: 18px; }
.faq-links { display: grid; gap: 10px; }
.faq-links a { padding: 12px; border-radius: 12px; background: #F8FAFD; }
.summary-item, .price-table > div {
  display: flex; justify-content: space-between; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line);
}
.total-row { border-bottom: none; }
.price-red, .pay-amount, .red-note { color: var(--red); font-weight: 700; }
.pay-amount { font-size: 24px; text-align: center; margin: 18px 0; }
.status-title { margin-bottom: 10px; font-weight: 700; }
.mail-status { padding: 12px 14px; border-radius: 12px; margin-bottom: 18px; }
.order-box, .note-box { border: 1px solid var(--line); border-radius: 14px; padding: 16px; background: #F8FAFD; }
.qr-wrap { text-align: center; margin: 18px 0; }
.qr-image { width: min(280px, 78vw); border-radius: 18px; box-shadow: var(--shadow); border: 1px solid var(--line); }
.knowledge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 30px auto 48px; }
.knowledge-card { display: block; padding: 20px; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.article-wrap { margin: 30px auto 48px; }
.article-card h1 { font-size: 32px; margin-bottom: 12px; }
.article-card h2 { margin-top: 22px; }
.section-card { margin-top: 30px; }
code { background: #f3f4f6; padding: 2px 6px; border-radius: 8px; }
.admin-range { margin-bottom: 12px; }
@media (max-width: 860px) {
  .hero-grid, .page-grid, .knowledge-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .ticket-row { grid-template-columns: 1fr; }
  .button-row { flex-direction: column; }
  .btn-primary, .btn-secondary { width: 100%; }
  h1 { font-size: 30px; }
  .container, .narrow-wrap { width: min(100% - 24px, 1100px); }
}


.field-error { margin: 8px 0 0; color: var(--red); font-size: 14px; font-weight: 700; }
.confirm-meta-wrap { border: 1px solid var(--line); border-radius: 14px; background: #F8FAFD; padding: 16px 18px; margin-bottom: 18px; }
.confirm-line { margin: 0 0 8px; color: var(--text); }
.confirm-line:last-child { margin-bottom: 0; }
.table-scroll { overflow-x: auto; }
.order-table { width: 100%; border-collapse: collapse; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; }
.order-table th, .order-table td { border-bottom: 1px solid var(--line); padding: 14px 12px; text-align: left; vertical-align: top; font-size: 14px; }
.order-table th { background: #F8FAFD; color: var(--text); }
.order-table tbody tr:last-child td { border-bottom: none; }
.ticket-name-cn { font-weight: 700; color: var(--text); margin-bottom: 4px; }
.ticket-name-en { color: var(--muted); line-height: 1.6; }
.confirm-total { margin: 18px 0; color: var(--red); font-size: 22px; font-weight: 800; text-align: right; }
.order-note-list p { margin: 0 0 10px; }
.order-note-list p:last-child { margin-bottom: 0; }

.top-banner { width: 100%; background: #EAF0F8; }
.top-banner img { display: block; width: 100%; max-width: 1280px; height: auto; margin: 0 auto; }


textarea, select {
  width: 100%; min-height: 48px; border: 1px solid var(--mdac-border); border-radius: 12px; padding: 12px 14px; font-size: 15px; font-family: inherit; background:#fff;
}
textarea.cms-editor { min-height: 320px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; line-height:1.7; }
.admin-nav { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.admin-nav a { background:#F8FAFD; border:1px solid var(--line); border-radius:12px; padding:10px 14px; }
.cms-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:24px; margin:30px auto 48px; }
.cms-list { display:grid; gap:12px; }
.cms-list-item { border:1px solid var(--line); border-radius:14px; padding:14px; background:#F8FAFD; }
.cms-list-item p { margin:4px 0 0; }
.cms-actions { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.mode-switch { display:flex; gap:18px; flex-wrap:wrap; }
.cms-preview-box { margin-top:24px; border-top:1px solid var(--line); padding-top:24px; }
.two-col-fields { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.article-home-grid, .article-list-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:18px; }
.article-home-card, .article-list-card { border:1px solid var(--line); border-radius:18px; padding:18px; background:#fff; box-shadow:var(--shadow); }
.article-list-date, .article-meta { color:var(--muted); font-size:13px; }
.section-head-flex { display:flex; justify-content:space-between; gap:12px; align-items:flex-end; margin-bottom:14px; }
.two-col-layout { display:grid; grid-template-columns:1.3fr .7fr; gap:24px; }
.article-side { padding:24px; align-self:start; }
.article-question-box { border-left:4px solid var(--green); padding:12px 14px; background:#F8FAFD; border-radius:12px; margin-bottom:16px; }
.article-excerpt { margin-bottom:18px; }
.article-body img { max-width:100%; height:auto; border-radius:12px; }
.article-body h2, .article-body h3 { color:var(--text); }
.article-tags { margin-top:24px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.tag-chip { display:inline-flex; align-items:center; padding:6px 10px; border-radius:999px; background:#EAF0F8; border:1px solid var(--line); font-size:13px; color:var(--green-dark); }
.related-list { display:grid; gap:10px; margin-bottom:18px; }
.related-item { display:block; padding:14px; border-radius:14px; background:#F8FAFD; border:1px solid var(--line); }
.related-item strong { display:block; margin-bottom:6px; color:var(--text); }
.related-item span { color:var(--muted); font-size:14px; line-height:1.7; }
.full-btn { width:100%; margin-bottom:10px; }
.banner-slot-section { margin-top:24px; }
.banner-slot-card { padding:24px; }
.banner-slot-image { width:100%; border-radius:16px; display:block; }
@media (max-width: 900px) {
  .cms-grid, .two-col-layout, .article-home-grid, .article-list-grid, .two-col-fields { grid-template-columns:1fr; }
}


.site-nav-wrap{background:#fff;border-bottom:1px solid #e9ecef;position:sticky;top:0;z-index:20}.site-nav{display:flex;gap:24px;overflow:auto;white-space:nowrap;padding:12px 0}.site-nav a{color:#1f2937;text-decoration:none;font-weight:600;font-size:15px}.site-nav a:hover{color:var(--mdac-blue)}.page-back-wrap{padding:18px 20px 28px}.back-booking-btn{display:inline-block}.top-banner img{display:block;width:100%;height:auto}.article-actions,.hero-actions{display:flex;gap:12px;flex-wrap:wrap}@media (max-width:768px){.site-nav{gap:16px;padding:10px 0}.site-nav a{font-size:14px}}


/* Navigation, buttons, spacing refinements */
.top-banner { background:#ffffff; }
.top-banner img { display:block; width:100%; max-height:420px; object-fit:cover; }
.site-nav-wrap { background:rgba(255,255,255,0.96); border-bottom:1px solid var(--line); box-shadow:0 4px 18px rgba(7, 27, 58, 0.06); }
.site-nav { display:flex; flex-wrap:wrap; gap:12px; padding:14px 0; justify-content:center; }
.site-nav a {
  display:inline-flex; align-items:center; justify-content:center; min-height:44px;
  padding:10px 18px; border-radius:999px; border:1px solid var(--line); background:#fff;
  color:var(--green); font-weight:700; text-align:center; transition:all .2s ease;
}
.site-nav a:hover { background:#EEF4FB; border-color:var(--mdac-light-blue); }
.site-nav a.is-active, .site-nav a[aria-current="page"] {
  background:var(--green); color:#fff; border-color:var(--green); box-shadow:0 8px 20px rgba(31, 78, 140, 0.20);
}
.hero.small-hero, .hero.mini-hero { padding-top:28px; padding-bottom:22px; }
.page-grid, .narrow-wrap, .article-list-grid, .cms-grid { margin-top:32px; margin-bottom:56px; }
.form-card, .info-card, .confirm-card, .pay-card, .section-card, .article-card { padding:28px; }
.ticket-row, .info-list li, .faq-links a, .cms-list-item { align-items:center; }
.btn-primary, .btn-secondary, button.btn-primary, button.btn-secondary {
  text-align:center; justify-content:center; align-items:center; white-space:nowrap; line-height:1.2;
  padding:0 22px; min-height:50px; border-radius:14px;
}
.button-row { gap:14px; align-items:center; justify-content:center; margin-top:24px; }
.button-row form { margin:0; }
.inline-btn, .back-booking-btn { min-width:160px; }
.page-back-wrap { margin:8px auto 56px; text-align:center; }
.back-booking-btn { display:inline-flex; }
.order-box p, .confirm-line, .status-title, .mail-status { margin:0 0 10px; }
.note-box, .order-note-list { margin-top:22px; padding:18px 20px; }
.table-scroll { margin-top:18px; }
.order-table th, .order-table td { vertical-align:middle; }
.article-list-card, .knowledge-card, .article-card { padding:26px; }
.article-list-card h2 { margin-top:6px; }
@media (max-width: 768px) {
  .container, .narrow-wrap { width:min(100% - 24px, 1100px); }
  .site-nav {
    justify-content:flex-start;
    gap:10px;
    padding:12px 0;
    overflow:visible;
    white-space:normal;
  }
  .site-nav a {
    flex:1 1 calc(50% - 10px);
    min-width:0;
    white-space:normal;
    line-height:1.35;
    min-height:54px;
    padding:10px 12px;
    word-break:keep-all;
    overflow-wrap:anywhere;
  }
  .page-grid, .hero-grid, .cms-grid { grid-template-columns:1fr; gap:18px; }
  .form-card, .info-card, .confirm-card, .pay-card, .section-card, .article-card { padding:22px; }
  .button-row { flex-direction:column; }
  .button-row > * { width:100%; }
  .button-row .btn-primary, .button-row .btn-secondary, .button-row form button { width:100%; }
}

/* Article hub portal upgrade */
.article-hub-hero {
  background: linear-gradient(180deg, #f6fbf8 0%, #ffffff 100%);
}
.article-hub-head {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: end;
}
.article-hub-cta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.article-hub-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
  gap: 24px;
  margin-top: 32px;
  margin-bottom: 56px;
}
.featured-article-card {
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: linear-gradient(135deg, #ffffff 0%, #f5fbf7 100%);
  box-shadow: var(--shadow);
}
.featured-article-meta,
.portal-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.featured-badge,
.portal-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 4px 12px;
  border-radius: 999px;
  background: #EAF0F8;
  color: var(--green-dark);
  font-size: 13px;
  font-weight: 700;
}
.featured-article-card h2 {
  margin: 14px 0 12px;
  font-size: 32px;
  line-height: 1.25;
}
.featured-excerpt {
  font-size: 16px;
  line-height: 1.9;
  color: var(--muted);
  margin-bottom: 18px;
}
.featured-actions,
.portal-card-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}
.article-latest-strip,
.article-archive-section {
  margin-top: 28px;
}
.article-home-grid-portal {
  margin-top: 14px;
}
.portal-mini-card {
  padding: 22px;
}
.portal-mini-card h3 {
  margin-top: 6px;
  margin-bottom: 10px;
  font-size: 20px;
  line-height: 1.45;
}
.portal-article-grid {
  margin-top: 14px;
}
.portal-article-card {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.portal-article-card h2 {
  margin: 0;
  font-size: 24px;
  line-height: 1.4;
}
.portal-summary {
  color: var(--muted);
  line-height: 1.85;
  margin: 0 0 4px;
}
.article-hub-side {
  display: grid;
  gap: 18px;
  align-content: start;
}
.portal-side-card {
  padding: 22px;
  border-radius: 18px;
}
.popular-question-list {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}
.popular-question-item {
  display: block;
  padding: 14px 15px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f9fcfa;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.popular-question-item:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(7, 27, 58, 0.08);
  border-color: var(--mdac-light-blue);
}
.popular-question-item strong {
  display: block;
  margin-bottom: 6px;
  color: var(--text);
  line-height: 1.7;
}
.popular-question-item span {
  color: var(--muted);
  font-size: 13px;
}
.portal-booking-box p {
  line-height: 1.85;
}
.text-link {
  color: var(--green-dark);
  font-weight: 700;
}
@media (max-width: 960px) {
  .article-hub-head,
  .article-hub-layout {
    grid-template-columns: 1fr;
    display: grid;
  }
  .article-hub-cta {
    justify-content: flex-start;
  }
}
@media (max-width: 768px) {
  .featured-article-card,
  .portal-side-card,
  .portal-mini-card,
  .portal-article-card {
    padding: 20px;
  }
  .featured-article-card h2 {
    font-size: 26px;
  }
  .portal-article-card h2,
  .portal-mini-card h3 {
    font-size: 20px;
  }
  .featured-actions,
  .portal-card-actions,
  .article-hub-cta {
    flex-direction: column;
    align-items: stretch;
  }
  .featured-actions .btn-primary,
  .featured-actions .btn-secondary,
  .portal-card-actions .btn-secondary,
  .article-hub-cta .btn-primary,
  .article-hub-cta .btn-secondary {
    width: 100%;
  }
}


.checkbox-field label{display:flex;align-items:center;gap:10px;font-weight:600}
.checkbox-field input[type='checkbox']{width:18px;height:18px}
.template-help{margin-top:8px;word-break:break-all;line-height:1.8}
.admin-nav{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.admin-nav a{display:inline-flex;align-items:center;justify-content:center;text-align:center}


.admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:20px}
.admin-link-card{text-decoration:none;color:inherit;padding:20px}
.admin-link-card h3{margin:0 0 8px 0}
.admin-link-card p{margin:0;color:#666;line-height:1.7}
.button-row{display:flex;flex-wrap:wrap;gap:10px}
.inline-btn{display:inline-flex;align-items:center;justify-content:center}
.table-wrap{overflow:auto}
.table{width:100%;border-collapse:collapse;background:#fff}
.table th,.table td{padding:12px 10px;border-bottom:1px solid #eee;text-align:left;vertical-align:top}
.table th{background:#fafafa}
.muted-row{font-size:13px;color:#666;background:#fcfcfc}
.text-link{color:#1677ff;text-decoration:none}
.danger-link{color:#cf1322}
.empty-state{padding:18px;border:1px dashed #d9d9d9;border-radius:10px;background:#fafafa;color:#666}

.checkbox-label{display:flex;align-items:center;gap:8px;font-weight:600;}
.checkbox-label input[type="checkbox"]{width:18px;height:18px;}


.admin-notice.success{background:#f6ffed;border:1px solid #b7eb8f;color:#389e0d;padding:12px 14px;border-radius:8px;margin:0 0 16px 0}
.articles-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 16px}
.article-sort-form{display:flex;align-items:center;gap:10px}
.article-sort-form select{min-width:160px}
.bulk-actions-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 14px 0;flex-wrap:wrap}
.select-all-label{display:flex;align-items:center;gap:8px;font-size:14px;color:#333}
.bulk-delete-btn{padding:8px 14px}
.articles-admin-table .cms-actions{display:flex;gap:8px;flex-wrap:wrap}

/* Fix: centered 580px banner + keep article hub hero background visible on wide screens */
.top-banner {
  width: 100%;
  background: linear-gradient(180deg, #071B3A 0%, #123B72 100%);
  text-align: center;
  overflow: hidden;
}
.top-banner img {
  display: block;
  width: min(580px, 100%) !important;
  max-width: 580px !important;
  height: auto !important;
  margin: 0 auto !important;
  object-fit: contain;
}

.article-hub-hero {
  display: block;
  width: 100%;
  clear: both;
  background:
    radial-gradient(circle at 88% 20%, rgba(247, 216, 74, 0.22), transparent 26%),
    linear-gradient(135deg, #071B3A 0%, #123B72 58%, #1F4E8C 100%) !important;
  border-bottom: 1px solid rgba(217, 225, 238, 0.72);
  color: #fff;
}
.article-hub-hero .eyebrow,
.article-hub-hero h1,
.article-hub-hero .hero-text {
  color: #fff;
}
.article-hub-hero .eyebrow {
  color: #F7D84A;
}
.article-hub-hero .hero-text {
  color: rgba(255, 255, 255, 0.88);
}
.article-hub-hero .btn-secondary {
  background: rgba(255,255,255,0.96);
  color: #1F4E8C;
  border-color: rgba(255,255,255,0.55);
}

@media (max-width: 768px) {
  .top-banner img {
    width: 100% !important;
    max-width: 580px !important;
  }
  .article-hub-hero {
    background:
      radial-gradient(circle at 100% 0%, rgba(247, 216, 74, 0.20), transparent 28%),
      linear-gradient(160deg, #071B3A 0%, #123B72 60%, #1F4E8C 100%) !important;
  }
}

/* Article tag links and MDAC article workflow helpers */
.article-tags a.tag-chip,
.tag-cloud a.tag-chip,
.compact-tags a.tag-chip { text-decoration:none; }
.tag-cloud { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.tag-chip:hover,
.tag-chip.is-active { background:var(--mdac-blue); border-color:var(--mdac-blue); color:#fff; }
.portal-tag-card .tag-chip { margin:0; }