:root {
  --bg: #f5f7f2;
  --card: #ffffff;
  --text: #16302b;
  --muted: #5b6d68;
  --green: #285e52;
  --green-dark: #1d4b42;
  --line: #d7e2dc;
  --red: #d83a3a;
  --orange: #f7a64a;
  --shadow: 0 10px 30px rgba(22, 48, 43, 0.08);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  background: linear-gradient(180deg, #f3f6f2 0%, #f9fbf9 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(40,94,82,0.12), transparent 30%), linear-gradient(180deg, #eef6f1, #f7faf8);
  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: #f7fbf9; }
.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"], select {
  width: 100%; min-height: 48px; border: 1px solid #cdd8d2; 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: #f7fbf9; }
.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: #fafcfb; }
.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: #fafcfb; 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: #f7fbf9; 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: #eef6f1; }
.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 #cdd8d2; 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:#f7fbf9; 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:#fafcfb; }
.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:#f7fbf9; 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:#f0f6f3; 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:#f7fbf9; 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:#0f766e}.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(22,48,43,0.04); }
.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:#f2f8f5; border-color:#b8cbc3; }
.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(40,94,82,0.18);
}
.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; }
  .site-nav a { flex:1 1 calc(50% - 10px); min-width:140px; }
  .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: #e8f5ef;
  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(22,48,43,0.06);
  border-color: #bfd1c9;
}
.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}
.articles-admin-table .article-date-col{min-width:150px;white-space:nowrap}
.articles-admin-table .article-views-col{min-width:130px}
.article-view-breakdown{display:grid;gap:3px;margin-top:6px;color:#6b7280;font-size:13px;line-height:1.4}
.article-view-breakdown span{display:block;white-space:nowrap}

.tag-chip{ text-decoration:none; }
.tag-chip.small{ padding:4px 8px; font-size:12px; }
.article-card-tags{ display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.tag-cloud{ margin-top:8px; }
.portal-tag-cloud .tag-chip{ background:#fff7ed; border-color:#fed7aa; color:#9a3412; }
.article-lead{ padding:16px 18px; border-radius:14px; background:#f8fafc; border:1px solid #e2e8f0; margin:18px 0; }
.article-note{ padding:14px 16px; border-radius:14px; background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; margin:18px 0; line-height:1.8; }
.penanghill-service-box{ padding:18px; border-radius:18px; background:linear-gradient(180deg,#ecfeff,#f0fdf4); border:1px solid #bae6fd; margin:22px 0; }
.penanghill-service-box h2{ margin:0 0 8px 0; font-size:22px; }
.penanghill-service-box p{ margin:0 0 14px 0; }
.article-cta{ display:inline-flex; padding:10px 16px; border-radius:999px; background:#0f766e; color:#fff; text-decoration:none; font-weight:600; }
.portal-article-card .article-card-tags,.portal-mini-card .article-card-tags{ min-height:28px; }

.article-tag-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.related-tags-card{margin-top:22px}
.portal-side-text{color:#52606d;line-height:1.7;font-size:14px}
.tag-chip-count{display:inline-block;margin-left:4px;opacity:.75;font-size:12px}


/* article hub text overflow fixes */
.related-tags-card h2,
.portal-side-card h3,
.article-hub-section-head h2,
.article-card-tags .tag-chip,
.tag-cloud .tag-chip {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.related-tags-card,
.portal-side-card {
  overflow: hidden;
}
.related-tags-card .article-card-tags,
.portal-side-card .article-card-tags {
  align-items: flex-start;
}
.related-tags-card .tag-chip,
.portal-side-card .tag-chip {
  max-width: 100%;
  white-space: normal;
  line-height: 1.45;
}


/* article hub spacing refinements */
.related-tags-card,
.portal-side-card,
.portal-tag-cloud {
  padding: 24px 28px;
}
.related-tags-card .section-head-flex,
.related-tags-card .article-card-tags,
.portal-side-card .article-card-tags,
.portal-tag-cloud .article-card-tags {
  margin-left: 2px;
}
.related-tags-card .eyebrow,
.related-tags-card h2,
.portal-side-card .eyebrow,
.portal-side-card h3 {
  padding-left: 2px;
}
.related-tags-card .article-card-tags,
.portal-side-card .article-card-tags,
.portal-tag-cloud .article-card-tags {
  margin-top: 18px;
}
.tag-result-grid {
  grid-template-columns: 1fr;
}
.tag-result-card {
  padding: 22px 24px;
}
.tag-result-card h2 {
  margin: 0 0 10px;
  font-size: 24px;
  line-height: 1.35;
}
.tag-result-card .portal-summary {
  margin: 0;
}
@media (max-width: 640px) {
  .related-tags-card,
  .portal-side-card,
  .portal-tag-cloud {
    padding: 20px 18px;
  }
}


/* tag layout breathing room fix */
.article-home-grid-portal + .related-tags-card {
  margin-top: 40px;
}
.related-tags-card {
  padding: 30px 34px;
}
.related-tags-card .section-head-flex {
  margin-bottom: 8px;
}
.related-tags-card .eyebrow,
.related-tags-card h2,
.related-tags-card .article-card-tags {
  padding-left: 8px;
  padding-right: 8px;
}
.related-tags-card .eyebrow {
  margin-bottom: 10px;
}
.related-tags-card h2 {
  margin-bottom: 18px;
  line-height: 1.25;
}
.related-tags-card .article-card-tags {
  margin-top: 22px;
  gap: 12px;
}
.portal-tag-cloud .article-card-tags,
.related-tags-card .article-card-tags {
  padding-bottom: 6px;
}
@media (max-width: 640px) {
  .article-home-grid-portal + .related-tags-card {
    margin-top: 28px;
  }
  .related-tags-card {
    padding: 24px 20px;
  }
  .related-tags-card .eyebrow,
  .related-tags-card h2,
  .related-tags-card .article-card-tags {
    padding-left: 6px;
    padding-right: 6px;
  }
}

/* Home conversion upgrade - 2026-05-29 */
.home-conversion-page {
  background:
    radial-gradient(circle at 8% 8%, rgba(40, 94, 82, 0.13), transparent 28%),
    radial-gradient(circle at 92% 2%, rgba(187, 247, 208, 0.45), transparent 26%),
    linear-gradient(180deg, #f3fbf6 0%, #fbfdfb 46%, #ffffff 100%);
}
.home-bg-shell {
  position: relative;
  min-height: 100vh;
  overflow-x: hidden;
}
.home-bg-shell::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .33;
  background-image:
    linear-gradient(rgba(40, 94, 82, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(40, 94, 82, .06) 1px, transparent 1px);
  background-size: 34px 34px;
  z-index: 0;
}
.home-bg-shell > * {
  position: relative;
  z-index: 1;
}
.home-top-banner img {
  max-height: 220px;
  object-fit: cover;
}
.home-nav-wrap {
  position: sticky;
  top: 0;
  z-index: 30;
  backdrop-filter: blur(10px);
}
.home-site-nav {
  flex-wrap: nowrap;
  overflow-x: auto;
  justify-content: center;
  gap: 8px;
  padding: 8px 0;
  scrollbar-width: none;
}
.home-site-nav::-webkit-scrollbar { display: none; }
.home-site-nav a {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 13px;
  border-radius: 999px;
  white-space: nowrap;
}
.home-hero-section {
  padding: 36px 0 14px;
}
.home-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
}
.home-hero-copy,
.home-trust-card,
.home-booking-card,
.home-info-card {
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(187, 247, 208, .72);
  border-radius: 24px;
  box-shadow: 0 18px 44px rgba(22, 48, 43, .09);
}
.home-hero-copy {
  padding: 30px;
  max-width: 920px;
  margin: 0 auto;
}
.home-eyebrow {
  margin: 0 0 10px;
  color: var(--green);
  font-size: 13px;
  letter-spacing: .08em;
  font-weight: 800;
  text-transform: uppercase;
}
.home-hero-copy h1 {
  margin-bottom: 12px;
  font-size: clamp(30px, 5vw, 48px);
}
.home-hero-lead {
  margin: 0 0 20px;
  color: #48625a;
  font-size: 16px;
  line-height: 1.85;
}
.home-hero-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.home-main-cta,
.home-secondary-cta {
  min-height: 48px;
}
.home-trust-grid {
  display: grid;
  gap: 14px;
}
.home-trust-card {
  padding: 22px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,255,251,.95));
}
.home-trust-card span {
  display: inline-flex;
  padding: 5px 10px;
  border-radius: 999px;
  background: #e8f8ef;
  color: var(--green-dark);
  font-weight: 800;
  font-size: 13px;
  margin-bottom: 10px;
}
.home-trust-card strong {
  display: block;
  color: var(--text);
  font-size: 20px;
  line-height: 1.45;
}
.home-trust-card p {
  margin: 8px 0 0;
  color: var(--muted);
}
.home-main-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  gap: 22px;
  align-items: start;
  margin-top: 18px;
  margin-bottom: 58px;
}
.home-booking-card {
  position: relative;
  padding: 28px;
}
.home-step-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}
.home-step-head h2 {
  margin-bottom: 0;
}
.home-step-label {
  margin: 0 0 6px;
  color: var(--green);
  font-weight: 800;
  font-size: 13px;
}
.home-form-badge {
  min-width: 148px;
  padding: 10px 12px;
  border-radius: 16px;
  background: #f0fbf4;
  border: 1px solid #bbf7d0;
  text-align: right;
}
.home-form-badge span {
  display: block;
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
}
.home-form-badge strong {
  display: block;
  margin-top: 2px;
  color: var(--green-dark);
  font-size: 13px;
  line-height: 1.45;
}
.home-date-note {
  display: grid;
  gap: 8px;
  color: #1d4b42 !important;
  background: linear-gradient(135deg, #f0fbf4, #f8fffb);
  border: 1px solid #bbf7d0;
  border-left: 4px solid var(--green);
  border-radius: 14px;
  padding: 12px 14px;
}
.home-date-note-row {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  line-height: 1.65;
}
.home-date-note-row strong {
  flex: 0 0 auto;
  display: inline-flex;
  padding: 2px 8px;
  border-radius: 999px;
  background: #dcfce7;
  color: var(--green-dark);
  font-size: 12px;
}
.home-date-note-row span {
  color: #285e52;
}
.home-date-note-example {
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px dashed #bbf7d0;
  color: #285e52;
  line-height: 1.65;
}
.home-price-preview {
  display: grid;
  gap: 10px;
  padding: 16px;
  margin: 18px 0 20px;
  border-radius: 18px;
  border: 1px solid #bbf7d0;
  background: linear-gradient(135deg, #f8fffb, #ffffff);
}
.home-price-preview > div {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 1px solid #e3f2e9;
}
.home-price-preview > div:last-of-type {
  border-bottom: none;
  padding-bottom: 0;
}
.home-price-preview span {
  color: var(--muted);
  font-size: 14px;
}
.home-price-preview strong {
  color: var(--green-dark);
  text-align: right;
}
.home-price-preview .home-total-price {
  color: var(--red);
  font-size: 22px;
}
.home-price-preview p {
  margin: 0;
  color: #60746d;
  font-size: 13px;
}
.home-submit-btn {
  width: 100%;
  min-height: 54px;
  font-size: 16px;
}
.home-info-stack {
  display: grid;
  gap: 18px;
}
.home-info-card {
  padding: 22px;
}
.home-info-card h3 {
  color: var(--green-dark);
}
.home-boundary-card {
  background: #fbfffd;
}
.home-floating-cta {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 80;
  display: none;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--green);
  color: #fff;
  font-weight: 800;
  box-shadow: 0 16px 36px rgba(22, 48, 43, .22);
}
.home-floating-cta.is-visible {
  display: flex;
}
.home-beian {
  text-align: center;
  font-size: 12px;
  color: #888;
  margin: 20px 0 28px;
}
@media (max-width: 860px) {
  .home-top-banner img { max-height: 160px; }
  .home-hero-section { padding-top: 22px; }
  .home-hero-grid,
  .home-main-layout {
    grid-template-columns: 1fr;
  }
  .home-site-nav {
    justify-content: flex-start;
  }
  .home-site-nav a {
    flex: 0 0 auto;
    min-width: auto;
  }
  .home-hero-copy,
  .home-booking-card,
  .home-info-card {
    padding: 22px;
    border-radius: 20px;
  }
  .home-step-head {
    flex-direction: column;
  }
  .home-form-badge {
    width: 100%;
    text-align: left;
  }
}
@media (max-width: 640px) {
  .home-hero-actions .btn-primary,
  .home-hero-actions .btn-secondary {
    width: 100%;
  }
  .home-price-preview > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }
  .home-price-preview strong {
    text-align: left;
  }
  .home-floating-cta {
    left: 12px;
    right: 12px;
  }
  body.home-conversion-page {
    padding-bottom: 72px;
  }
}

.home-hero-inline-link {
  color: #285e52;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 首页票种选择：移动端保持名称、年龄、价格同一行显示，避免分成三行 */
.ticket-row {
  grid-template-columns: minmax(96px, 1fr) auto 82px;
}
.ticket-row > div:first-child {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  white-space: nowrap;
}
.ticket-row span {
  display: inline;
  margin-top: 0;
  font-size: 12px;
}
.ticket-row select {
  max-width: 82px;
  min-height: 42px;
  padding: 8px 10px;
  text-align: center;
}
@media (max-width: 640px) {
  .ticket-row {
    grid-template-columns: minmax(92px, 1fr) auto 64px;
    gap: 8px;
    padding: 12px;
  }
  .price-tag {
    font-size: 13px;
  }
  .ticket-row select {
    width: 64px;
    max-width: 64px;
  }
}

/* Home booking info refinements */
.home-form-badge {
  min-width: 260px;
  max-width: 360px;
  text-align: left;
}
.home-form-badge p {
  margin: 0;
  color: var(--green-dark);
  font-size: 12.5px;
  font-weight: 800;
  line-height: 1.55;
}
.home-form-badge p + p {
  margin-top: 4px;
}
.home-ticket-notice-card {
  background: linear-gradient(135deg, #fffdf5, #ffffff);
  border-color: #f3dfaa;
}
.home-info-list {
  margin: 10px 0 0;
  padding-left: 18px;
  color: #405a53;
  line-height: 1.85;
}
.home-info-list li + li {
  margin-top: 6px;
}
@media (max-width: 860px) {
  .home-form-badge {
    min-width: 0;
    max-width: none;
  }
}

/* 首页 Banner 图片完整显示：避免 object-fit: cover 导致裁切 */
.home-top-banner {
  width: 100%;
  background: #f3fbf6;
  overflow: hidden;
}
.home-top-banner img {
  display: block;
  width: 75%;
  max-width: 960px;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center;
  margin: 0 auto;
}
@media (max-width: 860px) {
  .home-top-banner img {
    width: 92%;
    max-width: 92%;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
  }
}

/* 首页预定框出票提醒与移动端日期控件优化 */
.booking-fast-note {
  margin: 4px 0 16px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #9a3412;
  font-size: 14px;
  line-height: 1.6;
}
.booking-fast-note strong {
  color: #dc2626;
}

.maintenance-red-notice {
  margin: -6px 0 18px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  font-size: 14px;
  line-height: 1.65;
  font-weight: 500;
}
.maintenance-red-notice strong {
  color: #dc2626;
  font-weight: 700;
}
@media (max-width: 640px) {
  .maintenance-red-notice {
    margin-top: -8px;
    font-size: 13.5px;
    line-height: 1.6;
  }
}
@media (max-width: 640px) {
  #booking-form input[type="date"] {
    width: min(100%, 230px);
    max-width: 230px;
    display: block;
  }
}

/* 首页日期输入框与3日说明间距优化 */
@media (max-width: 640px) {
  #booking-form input[type="date"] {
    width: 168px !important;
    max-width: 168px !important;
    min-width: 0;
    display: inline-block;
  }
}

#booking-form .home-date-note {
  margin-top: 12px;
}

/* 全站浮动预定按钮：由 assets/js/site.js 自动注入，不需要修改旧文章页面 */
.global-floating-booking-cta {
  position: fixed;
  left: 50%;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%) translateY(18px);
  z-index: 9999;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  max-width: calc(100vw - 32px);
  padding: 13px 22px;
  border-radius: 999px;
  background: linear-gradient(135deg, #285e52, #1d4b42);
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none !important;
  box-shadow: 0 14px 30px rgba(29, 75, 66, 0.28);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.global-floating-booking-cta.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.global-floating-booking-cta:hover,
.global-floating-booking-cta:focus {
  color: #fff !important;
  box-shadow: 0 16px 34px rgba(29, 75, 66, 0.34);
}
@media (max-width: 640px) {
  .global-floating-booking-cta {
    width: calc(100vw - 32px);
    min-width: 0;
    padding: 14px 18px;
    font-size: 15px;
  }
}


.admin-rule-tip {
  margin: 10px 0 16px;
  padding: 12px 14px;
  border: 1px solid #fecaca;
  border-radius: 12px;
  background: #fff7f7;
  color: #991b1b;
  line-height: 1.7;
  font-size: 14px;
}

/* Pricing admin layout */
.pricing-admin-form {
  max-width: 1320px;
}
.pricing-section {
  padding: 20px 0;
  border-top: 1px solid var(--line);
}
.pricing-section:first-child {
  padding-top: 0;
  border-top: 0;
}
.pricing-section h2 {
  margin: 0 0 8px;
}
.pricing-fields-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 220px));
  gap: 16px;
  align-items: end;
}
.pricing-fields-grid .field {
  margin: 0;
}
.special-price-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 14px;
}
.special-price-card {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f8fbf9;
}
.special-price-card h3 {
  margin: 0 0 12px;
  color: var(--primary);
  font-size: 16px;
}
.special-date-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.special-date-fields .field {
  min-width: 0;
  margin: 0;
}
.special-date-fields input {
  min-width: 0;
}
.special-price-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.special-price-fields input {
  min-width: 0;
}
.pricing-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  max-width: 692px;
  margin-bottom: 14px;
}
.pricing-section-heading .field-help {
  margin: 0;
}
.pricing-section-heading .checkbox-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  white-space: nowrap;
}
@media (max-width: 1100px) {
  .special-price-grid {
    grid-template-columns: 1fr;
  }
  .special-price-card {
    max-width: 680px;
  }
}
@media (max-width: 768px) {
  .pricing-fields-grid,
  .special-date-fields,
  .special-price-fields {
    grid-template-columns: 1fr;
  }
  .pricing-section-heading {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Unified admin page shell */
.admin-site-wrap {
  min-height: 100vh;
  background: #f6f8f7;
}
.admin-page-wrap {
  width: min(1600px, 96vw);
  max-width: 1600px;
  margin: 0 auto;
  padding: 24px 0 48px;
}
.admin-page-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow);
  padding: 24px;
}
.admin-page-head {
  margin: 0 0 22px;
}
.admin-page-head .eyebrow {
  margin: 0 0 6px;
}
.admin-page-head h1 {
  margin: 0 0 8px;
  color: var(--primary);
  font-size: 28px;
  line-height: 1.3;
}
.admin-page-head .lead {
  max-width: 920px;
  margin: 0;
}
.admin-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 22px;
  padding: 0 0 18px;
  border-bottom: 1px solid var(--line);
}
.admin-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f7fbf9;
  color: var(--text);
  text-align: center;
  text-decoration: none;
}
.admin-nav a.active {
  border-color: var(--primary);
  background: #eef8f2;
  color: var(--primary);
  font-weight: 800;
}
.admin-sub-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 18px;
}
.admin-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
  gap: 24px;
  align-items: start;
}
.admin-page-card .table-wrap,
.admin-page-card .table-scroll,
.admin-page-card .mini-table-wrap {
  overflow-x: auto;
}
@media (max-width: 900px) {
  .admin-content-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .admin-page-wrap {
    width: min(100% - 24px, 1600px);
    padding: 16px 0 36px;
  }
  .admin-page-card {
    padding: 18px;
    border-radius: 18px;
  }
  .admin-page-head h1 {
    font-size: 24px;
  }
  .admin-nav {
    gap: 8px;
  }
  .admin-nav a {
    flex: 1 1 calc(50% - 8px);
    min-width: 130px;
  }
}

/* Booking custom calendar fix - 2026-06-14
   Avoid native date picker issues in in-app browsers such as Baidu App WebView. */
.js-custom-date-input {
  cursor: pointer;
  background: #fff;
  -webkit-user-select: none;
  user-select: none;
}
.booking-date-warning {
  scroll-margin-top: 92px;
}
.booking-calendar-wrap {
  position: relative;
  z-index: 40;
}
.booking-calendar-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: 8px;
  z-index: 120;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(22, 48, 43, 0.18);
}
.booking-calendar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  color: var(--green-dark);
}
.booking-calendar-nav {
  width: 38px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f7faf8;
  color: var(--green-dark);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}
.booking-calendar-week,
.booking-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}
.booking-calendar-week {
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.booking-calendar-empty {
  min-height: 38px;
}
.booking-calendar-day {
  min-height: 38px;
  border: 1px solid #d7e2dc;
  border-radius: 10px;
  background: #ffffff;
  color: var(--text);
  font-weight: 700;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.booking-calendar-day:not(:disabled):hover,
.booking-calendar-day:not(:disabled):focus {
  border-color: var(--green);
  background: #eef8f3;
  outline: none;
}
.booking-calendar-day.is-selected {
  border-color: var(--green);
  background: var(--green);
  color: #fff;
}
.booking-calendar-day.is-disabled,
.booking-calendar-day.is-blocked,
.booking-calendar-day:disabled {
  cursor: not-allowed;
  color: #a0aaa6;
  background: #f1f3f2;
  border-color: #e2e7e4;
  text-decoration: line-through;
  opacity: 1;
}
.booking-calendar-day.is-blocked,
.booking-calendar-day.is-blocked:disabled {
  color: #c65d5d;
  background: #fff1f1;
  border-color: #f1c5c5;
}
.booking-calendar-tips {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 13px;
}
.calendar-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  margin-left: 8px;
}
.calendar-dot.available { background: var(--green); }
.calendar-dot.blocked { background: #f1c5c5; }
.booking-maintenance-confirm {
  margin: 16px 0;
  padding: 14px;
  border: 1px solid #ffd7a8;
  border-radius: 14px;
  background: #fff8ef;
  color: #6f4210;
  scroll-margin-top: 92px;
}
.booking-maintenance-confirm-text {
  font-size: 14px;
  line-height: 1.7;
  font-weight: 700;
}
.booking-maintenance-confirm-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.booking-maintenance-confirm .btn-secondary,
.booking-maintenance-confirm .btn-primary {
  border: 0;
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 800;
  cursor: pointer;
}
.booking-maintenance-confirm .btn-secondary {
  background: #fff;
  color: var(--green-dark);
  border: 1px solid var(--line);
}
.home-bg-shell::before {
  pointer-events: none !important;
}
.home-floating-cta:not(.is-visible),
.global-floating-booking-cta:not(.is-visible) {
  pointer-events: none !important;
}
.home-floating-cta.is-visible,
.global-floating-booking-cta.is-visible {
  pointer-events: auto;
}
@media (max-width: 640px) {
  .booking-calendar-panel {
    position: relative;
    top: 8px;
  }
  .booking-calendar-day,
  .booking-calendar-empty {
    min-height: 40px;
  }
}


/* Calendar month switch stability fix - 2026-06-15 */
.booking-calendar-head {
  grid-template-columns: minmax(82px, auto) 1fr minmax(82px, auto);
}
.booking-calendar-nav {
  width: auto;
  min-width: 82px;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
  touch-action: manipulation;
}
.booking-calendar-head strong {
  text-align: center;
  white-space: nowrap;
}
@media (max-width: 360px) {
  .booking-calendar-nav {
    min-width: 70px;
    padding: 0 8px;
    font-size: 13px;
  }
}
