/* ============= DESIGN SYSTEM v3.47 - Weather & Seasons ============= */
:root {
  --primary: #1a5f7a;
  --secondary: #c84b31;
  --accent: #f9a825;
  --text-dark: #2c3e50;
  --text-light: #666;
  --bg-light: #f8f9fa;
  --white: #fff;
  --shadow: 0 2px 20px rgba(0,0,0,.1);
  --shadow-hover: 0 8px 30px rgba(0,0,0,.15);
  --transition: all .3s ease;
  --g50: #f0f4f8;
  --g100: #e2e8f0;
  --g200: #cbd5e1;
  --g400: #94a3b8;
  --g600: #64748b;
  --g800: #334155;
  --gn: #27ae60;
  --rd: #e74c3c;
  --a200: #f6e58d;
  --a500: #f9a825;
  --a600: #e8a317;
  --focus-ring: 0 0 0 3px rgba(26,95,122,.4);
}

/* =========== Dark Mode (v2.20) =========== */
[data-theme="dark"] {
  --primary: #4da8da;
  --secondary: #e8836a;
  --accent: #f9a825;
  --text-dark: #e8ecf0;
  --text-light: #b0b8c1;
  --bg-light: #1e2530;
  --white: #161b22;
  --shadow: 0 2px 20px rgba(0,0,0,.35);
  --shadow-hover: 0 8px 30px rgba(0,0,0,.45);
  --g50: #212830;
  --g100: #303840;
  --g200: #404850;
  --g400: #8b949e;
  --g600: #c0c8d0;
  --g800: #e0e6ee;
  --focus-ring: 0 0 0 3px rgba(77,168,218,.4);
  color-scheme: dark;
}
[data-theme="dark"] body { background: #0d1117; color: #e8ecf0; }
[data-theme="dark"] .hd { background: #161b22; box-shadow: 0 2px 20px rgba(0,0,0,.5); }
[data-theme="dark"] .nv a { color: #c0c8d0; }
[data-theme="dark"] .nv a:hover, [data-theme="dark"] .nv a.ac { color: #e8836a; }
[data-theme="dark"] .tb { background: #0d1117; }
[data-theme="dark"] .tc, [data-theme="dark"] .acd, [data-theme="dark"] .sv, [data-theme="dark"] .dc, [data-theme="dark"] .pc, [data-theme="dark"] .wc, [data-theme="dark"] .tmc, [data-theme="dark"] .rc, [data-theme="dark"] .sk {
  background: #161b22;
}
[data-theme="dark"] .wc { background: #1e2530; }
[data-theme="dark"] .wc:hover { background: #212830; }
[data-theme="dark"] .ch { background: #161b22; border-color: #303840; color: #b0b8c1; }
[data-theme="dark"] .ch:hover:not(.ac) { border-color: #4da8da; color: #4da8da; }
[data-theme="dark"] .fb input[type=text] { background: #161b22; border-color: #303840; color: #e8ecf0; }
[data-theme="dark"] .dp { background: #161b22; border-color: #303840; color: #b0b8c1; }
[data-theme="dark"] .dp:hover:not(.ac) { border-color: var(--secondary); color: var(--secondary); }
[data-theme="dark"] .ic-toggle { background: #161b22; border-color: #28a745; color: #28a745; }
[data-theme="dark"] .ic-toggle:hover:not(.ac) { background: #0d3320; }
[data-theme="dark"] .af-badge { background: #303840; }
[data-theme="dark"] .af-clear { color: #e74c3c; border-color: #e74c3c; }
[data-theme="dark"] .af-clear:hover { background: #e74c3c; color: #0d1117; }
[data-theme="dark"] .pf-row label { color: #b0b8c1; }
[data-theme="dark"] .fg input, [data-theme="dark"] .fg textarea, [data-theme="dark"] .fg select { background: #161b22; border-color: #303840; color: #e8ecf0; }
[data-theme="dark"] .hr { background: linear-gradient(135deg, #0a1a28 0%, #0d2035 30%, #3a1a10 70%, #2a1010 100%); }
[data-theme="dark"] .hf { background: rgba(22,27,34,.95); }
[data-theme="dark"] .fi { color: #e8ecf0; }
[data-theme="dark"] .bt-o { border-color: #e8ecf0; color: #e8ecf0; }
[data-theme="dark"] .bt-o:hover { background: #e8ecf0; color: #0d1117; }
.print-btn { cursor: pointer; border: 2px solid var(--primary); color: var(--primary); background: var(--white); border-radius: 8px; font-weight: 600; transition: var(--transition); }
.print-btn:hover { background: var(--primary); color: var(--white); transform: translateY(-2px); box-shadow: var(--shadow-hover); }
[data-theme="dark"] .print-btn { border-color: var(--primary); color: var(--primary); background: transparent; }
[data-theme="dark"] .print-btn:hover { background: var(--primary); color: #0d1117; }
[data-theme="dark"] .bd-content { color: #e8ecf0; }
[data-theme="dark"] .bd-p { color: #b0b8c1; }
[data-theme="dark"] .nv.on { background: #161b22; }
[data-theme="dark"] #mob-cta { background: #161b22; }
[data-theme="dark"] .ss-dd { background: #161b22; border-color: #303840; }
[data-theme="dark"] .ssi:hover { background: #1e2530; }
[data-theme="dark"] .ssi:not(:last-child) { border-color: #303840; }
[data-theme="dark"] .share-btn { background: #161b22; border-color: #303840; color: #b0b8c1; }
[data-theme="dark"] .trust-row { background: transparent; }

/* === Reset & Base === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
    'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif;
  line-height: 1.6;
  color: var(--text-dark);
  background: var(--white);
  overflow-x: hidden;
}
.c { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* === Skip Link (Accessibility) === */
.sl {
  position: absolute; top: -100px; left: 0; z-index: 10000;
  background: var(--secondary); color: var(--white); padding: 12px 24px;
  font-weight: 600; text-decoration: none; border-radius: 0 0 8px 0;
  transition: top .2s;
}
.sl:focus { top: 0; }

/* === Focus visible === */
:focus-visible { outline: 2px solid var(--secondary); outline-offset: 2px; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--secondary); outline-offset: 2px; }

/* === Print Styles === */
@media print {
  .tb, .hd, .ft, .btt, #mob-cta, .to, .social-links { display: none !important; }
  body { font-size: 12pt; color: #000; }
  a { text-decoration: underline; }
}

/* === Reduced Motion === */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  html { scroll-behavior: auto; }
}

/* ---------- Top Bar ---------- */
.tb { background: var(--primary); color: var(--white); padding: 10px 0; font-size: 14px; }
.tb .c { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; }
.tbl { display: flex; gap: 25px; flex-wrap: wrap; }
.tbl span { display: flex; align-items: center; gap: 5px; }
.tbr { display: flex; gap: 20px; }
.tbr a { color: var(--white); text-decoration: none; font-size: 13px; transition: var(--transition); }
.tbr a:hover { color: var(--accent); }
@media (max-width: 640px) { .tbl { display: none; } }

/* ---------- Header ---------- */
.hd { background: var(--white); box-shadow: var(--shadow); position: sticky; top: 0; z-index: 1000; }
.hd .c { display: flex; justify-content: space-between; align-items: center; height: 80px; }
.lg a {
  display: flex; align-items: center; gap: 10px; text-decoration: none;
  font-size: 24px; font-weight: 700; color: var(--primary);
}
.lg a i { font-size: 32px; color: var(--secondary); }
.nv ul { display: flex; list-style: none; gap: 4px; }
.nv a {
  color: var(--text-dark); text-decoration: none; padding: 8px 14px;
  font-size: .9rem; font-weight: 500; position: relative; transition: var(--transition); cursor: pointer;
}
.nv a::after {
  content: ''; position: absolute; bottom: -2px; left: 14px; right: 14px;
  height: 2px; background: var(--secondary); transform: scaleX(0); transition: transform .3s;
}
.nv a:hover, .nv a.ac { color: var(--secondary); }
.nv a:hover::after, .nv a.ac::after { transform: scaleX(1); }
.mb {
  display: none; background: none; border: none; font-size: 24px;
  color: var(--text-dark); cursor: pointer; padding: 8px;
}
@media (max-width: 900px) {
  .nv {
    display: none; position: absolute; top: 80px; left: 0; right: 0;
    background: var(--white); box-shadow: 0 12px 40px rgba(0,0,0,.15); padding: 12px 0;
  }
  .nv.on { display: block; }
  .nv ul { flex-direction: column; gap: 0; }
  .nv a { display: block; padding: 14px 24px; }
  .nv a::after { display: none; }
  .mb { display: block; }
}

/* ---------- Hero ---------- */
.hr {
  position: relative; height: 600px;
  background: linear-gradient(135deg, #0d3b4e 0%, #1a5f7a 30%, #c84b31 70%, #a03a20 100%);
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  text-align: center; color: var(--white);
}
.hr .c { position: relative; z-index: 2; padding: 0 20px; }
.hr h1 { font-size: 3.5rem; font-weight: 800; line-height: 1.15; margin-bottom: 20px; text-shadow: 2px 2px 4px rgba(0,0,0,.3); }
.hr h1 span { color: var(--accent); }
.hr p { font-size: 1.2rem; opacity: .9; max-width: 650px; margin: 0 auto 40px; }
.ha { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; }

/* Hero Search Bar */
.hs {
  display: flex; max-width: 520px; margin: 0 auto 30px;
  border-radius: 50px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,.25);
}
.hs input {
  flex: 1; padding: 16px 24px; border: none; font-size: 1rem;
  font-family: inherit; outline: none; color: var(--text-dark);
}
.hs input::placeholder { color: #94a3b8; }
.hs button {
  padding: 16px 28px; border: none; background: var(--secondary);
  color: var(--white); font-size: 1rem; font-weight: 600; cursor: pointer;
  font-family: inherit; transition: var(--transition); white-space: nowrap;
}
.hs button:hover { background: #a03a20; }
@media (max-width: 768px) {
  .hr { height: 520px; }
  .hr h1 { font-size: 2rem; }
  .hr p { font-size: .95rem; margin-bottom: 25px; }
  .hs { max-width: 100%; }
  .hs input { padding: 14px 18px; }
}

/* ---------- Hero Features (Stats) ---------- */
.hf { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(255,255,255,.95); padding: 25px 0; z-index: 3; }
.hf .c { display: flex; justify-content: space-around; flex-wrap: wrap; gap: 20px; }
.fi { display: flex; align-items: center; gap: 10px; color: var(--text-dark); font-weight: 500; font-size: 15px; }
.fi i { font-size: 24px; color: var(--secondary); }
.fi .fn { font-size: 1.5rem; font-weight: 800; color: var(--primary); }

/* ---------- Buttons ---------- */
.bt {
  display: inline-flex; align-items: center; gap: 8px; padding: 14px 32px;
  border-radius: 50px; font-size: 1rem; font-weight: 600; text-decoration: none;
  cursor: pointer; border: none; transition: var(--transition); font-family: inherit;
}
.bt-p { background: var(--secondary); color: var(--white); }
.bt-p:hover { background: #b03d28; transform: translateY(-2px); box-shadow: var(--shadow-hover); }
.bt-o { background: transparent; color: var(--white); border: 2px solid var(--white); }
.bt-o:hover { background: var(--white); color: var(--primary); }
.bt2 {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 20px;
  border-radius: 20px; font-size: 14px; font-weight: 500; text-decoration: none;
  cursor: pointer; border: none; transition: var(--transition); font-family: inherit;
  background: var(--primary); color: var(--white);
}
.bt2:hover { background: var(--secondary); }

/* ---------- Section Header ---------- */
.shd { text-align: center; margin-bottom: 50px; }
.shd h2 { font-size: 2.25rem; font-weight: 700; color: var(--text-dark); margin-bottom: 15px; position: relative; display: inline-block; }
.shd h2::after { content: ''; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 60px; height: 3px; background: var(--secondary); }
.shd p { color: var(--text-light); font-size: 1rem; max-width: 600px; margin: 20px auto 0; }

/* ---------- Sections ---------- */
.se { padding: 80px 0; }
.se-alt { background: var(--bg-light); }

/* ---------- Tour Cards ---------- */
.tg { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 30px; }
#ft-grid { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 768px) { #ft-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 400px) { .tg, #ft-grid { grid-template-columns: 1fr; } }
.tc {
  background: var(--white); border-radius: 15px; overflow: hidden;
  box-shadow: var(--shadow); transition: var(--transition); cursor: pointer;
  display: flex; flex-direction: column;
}
.tc:hover { transform: translateY(-10px); box-shadow: var(--shadow-hover); }
.tci { position: relative; height: 220px; overflow: hidden; background: linear-gradient(135deg, #e8f0f5, #d5e3ec); }
.tci-img {
  width: 100%; height: 100%; object-fit: cover; transition: transform .5s;
  position: absolute; top: 0; left: 0;
}
.tc:hover .tci-img { transform: scale(1.1); }
.tcb {
  position: absolute; top: 15px; left: 15px; background: var(--secondary);
  color: var(--white); padding: 5px 15px; border-radius: 20px; font-size: 12px;
  font-weight: 500; z-index: 2;
}
.tcy { padding: 25px; flex: 1; display: flex; flex-direction: column; }
.tct {
  font-size: 1.1rem; font-weight: 600; color: var(--text-dark); margin-bottom: 10px;
  line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.tcm { display: flex; gap: 20px; font-size: 13px; color: var(--text-light); margin-bottom: 10px; flex-wrap: wrap; }
.tcm span { display: flex; align-items: center; gap: 5px; }
.tcm i { color: var(--primary); }
.tcd {
  font-size: .85rem; color: var(--text-light); line-height: 1.7; overflow: hidden;
  flex: 1; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.tcf { padding: 0 25px 20px; display: flex; justify-content: space-between; align-items: center; }
.tcp { font-size: 1.6rem; font-weight: 700; color: var(--secondary); }
.tcp small { font-size: .75rem; color: var(--text-light); font-weight: 400; }
.tcs { color: var(--accent); font-size: .8rem; }
.tcs span { color: var(--text-light); margin-left: 4px; }

/* ---------- Skeleton Loading ---------- */
.sk { pointer-events: none; }
.ski { height: 220px; background: var(--g50); position: relative; overflow: hidden; }
.sk-anim {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.6) 50%, transparent 100%);
  animation: sk-shimmer 1.5s infinite;
}
.skl { height: 14px; border-radius: 4px; background: var(--g50); margin-bottom: 10px; position: relative; overflow: hidden; }
.skl::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.6) 50%, transparent 100%);
  animation: sk-shimmer 1.5s infinite;
}
.skm { display: flex; gap: 15px; margin-top: 5px; }
@keyframes sk-shimmer { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }

/* ---------- Service Cards ---------- */
.sv-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; }
.sv {
  background: var(--white); padding: 40px 30px; border-radius: 15px;
  box-shadow: var(--shadow); transition: var(--transition); text-align: center; border: 1px solid #eee;
}
.sv:hover { transform: translateY(-5px); box-shadow: var(--shadow-hover); border-color: var(--primary); }
.sv .ic2 {
  width: 80px; height: 80px; background: linear-gradient(135deg, var(--primary), var(--secondary));
  border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px;
}
.sv .ic2 i { font-size: 32px; color: var(--white); }
.sv h3 { font-size: 1.25rem; font-weight: 700; color: var(--text-dark); margin-bottom: 12px; }
.sv p { color: var(--text-light); font-size: .9rem; line-height: 1.7; margin-bottom: 16px; }
.svl { color: var(--secondary); font-weight: 500; display: inline-flex; align-items: center; gap: 5px; text-decoration: none; }
.svl:hover { gap: 10px; }

/* ---------- Why Us Cards ---------- */
.wg { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.wc { background: var(--bg-light); border-radius: 15px; padding: 28px; display: flex; gap: 16px; align-items: flex-start; transition: var(--transition); }
.wc:hover { background: #eef4f7; transform: translateY(-2px); }
.wc .ic3 {
  width: 48px; height: 48px; border-radius: 12px;
  background: linear-gradient(135deg, var(--primary), var(--secondary));
  color: var(--white); display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; flex-shrink: 0;
}
.wc h4 { font-size: 1rem; font-weight: 600; color: var(--text-dark); margin-bottom: 4px; }
.wc p { font-size: .85rem; color: var(--text-light); }

/* ---------- Filter Bar ---------- */
.fb { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; align-items: center; }
.fb input[type=text] {
  flex: 1; min-width: 220px; padding: 14px 20px; border: 2px solid #ddd;
  border-radius: 50px; font-size: .9rem; font-family: inherit; outline: none;
  transition: var(--transition); position: relative;
}
.fb input[type=text]:focus { border-color: var(--primary); }
.fc { display: flex; gap: 8px; flex-wrap: wrap; }
.ch {
  padding: 9px 18px; border-radius: 50px; font-size: .85rem; font-weight: 500;
  cursor: pointer; border: 2px solid #ddd; background: var(--white);
  color: var(--text-light); transition: var(--transition); white-space: nowrap; font-family: inherit;
  display: inline-flex; align-items: center; gap: 6px;
}
.ch.ac { background: var(--primary); color: var(--white); border-color: var(--primary); }
.ch:hover:not(.ac) { border-color: var(--primary); color: var(--primary); }

/* Price filter row */
.pf-row { display: flex; gap: 12px; align-items: center; width: 100%; flex-wrap: wrap; }
.pf-row label { font-size: .85rem; font-weight: 600; color: var(--text-dark); white-space: nowrap; }
.pf-row input[type=range] { flex: 1; min-width: 100px; accent-color: var(--secondary); }
.pf-row .pf-val { font-size: .85rem; font-weight: 600; color: var(--secondary); min-width: 55px; text-align: right; }
.lm { text-align: center; margin-top: 40px; }

/* Mobile filter toggle */
.mft {
  display: none; padding: 10px 18px; border-radius: 50px; font-size: .85rem;
  font-weight: 500; cursor: pointer; border: 2px solid var(--primary);
  background: var(--white); color: var(--primary); font-family: inherit; margin-bottom: 16px;
}
.mft i { margin-right: 6px; }
.fb-wrap { transition: max-height .3s; overflow: hidden; }
@media (max-width: 768px) {
  .fb-wrap.collapsed { max-height: 0 !important; }
  .mft { display: inline-flex; }
  .pf-row { flex-direction: column; align-items: flex-start !important; }
  .pf-row input[type=range] { width: 100%; }
}

/* ---------- Search Suggestions Dropdown ---------- */
.ss { position: relative; flex: 1; min-width: 220px; }
.ss-dd {
  display: none; position: absolute; top: 100%; left: 0; right: 0;
  background: var(--white); border: 2px solid var(--primary); border-top: none;
  border-radius: 0 0 14px 14px; box-shadow: 0 12px 40px rgba(0,0,0,.15);
  z-index: 100; max-height: 360px; overflow-y: auto; margin-top: -2px;
}
.ssi { display: flex; align-items: flex-start; gap: 12px; padding: 12px 16px; cursor: pointer; transition: background .15s; }
.ssi:hover { background: var(--bg-light); }
.ssi:not(:last-child) { border-bottom: 1px solid #eee; }
.ssc { color: var(--primary); margin-top: 5px; font-size: .95rem; width: 18px; text-align: center; }
.ssn { font-size: .88rem; font-weight: 600; color: var(--text-dark); line-height: 1.3; }
.ssu { font-size: .78rem; color: var(--text-light); display: flex; align-items: center; gap: 4px; margin-top: 2px; }
[data-theme="dark"] .ssi { border-bottom-color: var(--g600); }
[data-theme="dark"] .ssi:hover { background: var(--g600); }
[data-theme="dark"] .ssn { color: #e2e8f0; }
[data-theme="dark"] .ssc { color: var(--accent); }

/* ---------- Tour Detail ---------- */
.dh { height: 420px; position: relative; overflow: hidden; background: linear-gradient(135deg, #0d3b4e 0%, #1a5f7a 40%, #c84b31 80%); }
.dhi { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.do {
  position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.85), transparent 70%);
  display: flex; flex-direction: column; justify-content: flex-end; padding: 40px 0; z-index: 1;
}
.do h1 { font-size: 2rem; font-weight: 800; color: var(--white); margin-bottom: 12px; line-height: 1.25; }
.do .mt { display: flex; gap: 20px; color: rgba(255,255,255,.85); font-size: .9rem; flex-wrap: wrap; align-items: center; }
.do .mt i { color: var(--accent); }
@media (max-width: 768px) { .dh { height: 320px; } .do h1 { font-size: 1.4rem; } }
.dl { display: grid; grid-template-columns: 1fr 340px; gap: 30px; padding: 50px 0 60px; }
@media (max-width: 900px) { .dl { grid-template-columns: 1fr; } }
.dc { background: var(--white); border-radius: 15px; padding: 30px; box-shadow: var(--shadow); margin-bottom: 24px; }
.dc h2 { font-size: 1.2rem; font-weight: 700; color: var(--text-dark); margin-bottom: 18px; display: flex; align-items: center; gap: 10px; }
.dc h2 .ic {
  width: 34px; height: 34px; border-radius: 50%; background: var(--secondary);
  color: var(--white); display: flex; align-items: center; justify-content: center; font-size: .9rem;
}
.sd { position: sticky; top: 100px; }
@media (max-width: 900px) { .sd { position: static; } }
.pc { background: var(--white); border-radius: 15px; padding: 30px; box-shadow: var(--shadow); text-align: center; border: 2px solid var(--secondary); }
.pc .fr { font-size: .85rem; color: var(--text-light); margin-bottom: 6px; }
.pc .pr { font-size: 2.5rem; font-weight: 800; color: var(--secondary); }
.pc .pr sup { font-size: 1.2rem; }
.pc .pe { font-size: .85rem; color: var(--text-light); }
.pc .ir { display: flex; justify-content: center; gap: 24px; margin: 18px 0; font-size: .85rem; color: var(--text-light); }
.pc .ir i { color: var(--primary); }
.pc .bt { width: 100%; justify-content: center; margin-top: 8px; }

/* ---------- Attractions ---------- */
.ag { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px; }
.acd { background: var(--white); border-radius: 15px; overflow: hidden; box-shadow: var(--shadow); transition: var(--transition); }
.acd:hover { transform: translateY(-5px); box-shadow: var(--shadow-hover); }
.ai { height: 200px; background: linear-gradient(135deg, #e8f0f5, #d5e8f0); display: flex; align-items: center; justify-content: center; font-size: 2.5rem; position: relative; overflow: hidden; }
.abd { padding: 18px 20px 24px; }
.abd h3 { font-size: 1.05rem; font-weight: 600; color: var(--text-dark); margin-bottom: 8px; }
.abd p { font-size: .85rem; color: var(--text-light); line-height: 1.6; }

/* ---------- Contact ---------- */
.cg { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
@media (max-width: 768px) { .cg { grid-template-columns: 1fr; } }
.fg { margin-bottom: 18px; }
.fg label { display: block; font-size: .85rem; font-weight: 600; color: var(--text-dark); margin-bottom: 6px; }
.fg input, .fg textarea, .fg select {
  width: 100%; padding: 14px 16px; border: 1px solid #ddd; border-radius: 8px;
  font-size: .9rem; font-family: inherit; transition: var(--transition); outline: none; background: var(--white);
}
.fg input:focus, .fg textarea:focus, .fg select:focus { border-color: var(--primary); }
.fg textarea { resize: vertical; min-height: 130px; }
.cic { background: var(--primary); color: var(--white); border-radius: 15px; padding: 35px; }
.cic h3 { font-size: 1.3rem; margin-bottom: 22px; }
.cii { display: flex; gap: 16px; margin-bottom: 20px; }
.cii i { color: var(--accent); font-size: 1.2rem; margin-top: 3px; width: 24px; }
.cii .lb { font-size: .8rem; color: rgba(255,255,255,.65); }
.cii .vl { font-weight: 500; font-size: .95rem; }

/* ---------- Footer ---------- */
.ft { background: var(--text-dark); color: var(--white); padding: 60px 0 30px; }
.fg2 { display: grid; grid-template-columns: 2fr 1fr 1fr 1.3fr; gap: 40px; margin-bottom: 40px; }
@media (max-width: 768px) { .fg2 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .fg2 { grid-template-columns: 1fr; } }
.fl { display: flex; align-items: center; gap: 10px; font-size: 1.3rem; font-weight: 700; margin-bottom: 14px; }
.fl i { color: var(--secondary); font-size: 1.5rem; }
.fs h4 { color: var(--white); font-size: 1.05rem; margin-bottom: 16px; }
.fs ul { list-style: none; }
.fs ul li { margin-bottom: 10px; font-size: .88rem; }
.fs a { color: rgba(255,255,255,.65); text-decoration: none; transition: var(--transition); }
.fs a:hover { color: var(--accent); }
.fs li i { color: var(--secondary); margin-right: 8px; width: 16px; }
.social-links { display: flex; gap: 12px; margin-top: 16px; }
.social-links a {
  width: 40px; height: 40px; background: rgba(255,255,255,.08); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; transition: var(--transition);
  color: var(--white); text-decoration: none;
}
.social-links a:hover { background: var(--secondary); transform: translateY(-3px); }
.fa { border-top: 1px solid rgba(255,255,255,.08); padding: 24px 0 0; text-align: center; font-size: .85rem; color: rgba(255,255,255,.45); }

/* ---------- Utilities ---------- */
.to {
  position: fixed; top: 20px; right: 20px; z-index: 9999; background: #27ae60;
  color: var(--white); padding: 14px 24px; border-radius: 8px;
  box-shadow: 0 12px 40px rgba(0,0,0,.15); font-weight: 500;
  transform: translateX(120%); transition: transform .3s; max-width: 400px;
}
.to.on { transform: translateX(0); }
.to.er { background: #e74c3c; }
.em { text-align: center; padding: 60px 20px; color: var(--text-light); }
.em i { font-size: 2.5rem; margin-bottom: 14px; display: block; }
.em a { color: var(--primary); font-weight: 600; }
.btt {
  position: fixed; bottom: 28px; right: 28px; z-index: 999; width: 44px; height: 44px;
  border-radius: 50%; background: var(--secondary); color: var(--white); border: none;
  font-size: 1.1rem; cursor: pointer; box-shadow: var(--shadow); display: none;
  align-items: center; justify-content: center; transition: var(--transition);
}
.btt:hover { background: var(--primary); }
.btt.on { display: flex; }
.pg { display: none; }
.pg.on { display: block; }

/* SPA Page Transition Animation (v2.50) */
.pg-fade-in { animation: pgFadeIn .25s ease both; }
@keyframes pgFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .pg-fade-in { animation: none; } }

/* ---------- Breadcrumb ---------- */
.bc { max-width: 1200px; margin: 20px auto 0; padding: 12px 20px; font-size: .82rem; color: var(--text-light); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bc a { color: var(--primary); text-decoration: none; font-weight: 500; transition: var(--transition); }
.bc a:hover { color: var(--secondary); }
.bc span { display: flex; align-items: center; gap: 8px; }
.bcl { color: var(--text-dark); font-weight: 600; }

/* ---------- Social Proof (v2.30) ---------- */
.sp-wrap { margin-top: 16px; padding: 16px; background: var(--bg-light); border-radius: 12px; }
.sp-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; }
.sp-row + .sp-row { border-top: 1px solid var(--g100); }
.sp-ic { width: 28px; height: 28px; background: var(--primary); color: var(--white); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; flex-shrink: 0; }
.sp-info { font-size: 0.8rem; color: var(--text-light); }
.sp-val { font-weight: 700; color: var(--secondary); }
@media (prefers-color-scheme: dark) { .sp-wrap { background: var(--g800); } }

/* ---------- Share Buttons ---------- */
.sh { margin-top: 20px; padding-top: 20px; border-top: 1px solid #eee; }
.shb {
  width: 38px; height: 38px; border-radius: 50%; border: none; display: inline-flex;
  align-items: center; justify-content: center; font-size: 1rem; cursor: pointer;
  transition: var(--transition); color: var(--white); text-decoration: none;
}
.shb-wa { background: #25d366; }
.shb-wa:hover { background: #1da851; transform: translateY(-2px); }
.shb-em { background: var(--primary); }
.shb-em:hover { background: #144d63; transform: translateY(-2px); }
.shb-cp { background: var(--text-light); }
.shb-cp:hover { background: var(--text-dark); transform: translateY(-2px); }

/* ---------- Quick Inquiry (v2.30) ---------- */
.qi-card { background: linear-gradient(135deg, var(--bg-light) 0%, var(--white) 100%); border: 2px solid var(--primary); }
.qi-form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.qi-input {
  padding: 12px 14px; border: 1px solid var(--g200); border-radius: 8px;
  font-size: 0.9rem; font-family: inherit; outline: none; background: var(--white);
  transition: border-color .2s;
}
.qi-input:focus { border-color: var(--primary); }
.qi-ta { grid-column: 1 / -1; resize: vertical; min-height: 60px; }
.qi-submit { grid-column: 1 / -1; width: 100%; justify-content: center; padding: 12px 24px; border: none; cursor: pointer; }
@media (max-width: 480px) { .qi-form { grid-template-columns: 1fr; } }

/* ---------- Form Validation ---------- */
.fg.er input, .fg.er textarea, .fg.er select { border-color: #e74c3c; background: #fef5f5; }
.fe { color: #e74c3c; font-size: .78rem; margin-top: 4px; display: none; }
.fg.er .fe { display: block; }

/* ---------- Wishlist ---------- */
.wl-btn {
  position: absolute; top: 12px; right: 12px; width: 36px; height: 36px;
  border-radius: 50%; background: rgba(255,255,255,.9); border: none; font-size: 1.05rem;
  cursor: pointer; z-index: 3; display: flex; align-items: center; justify-content: center;
  transition: all .3s; box-shadow: 0 2px 8px rgba(0,0,0,.1); color: #ccc; padding: 0;
}
.wl-btn:hover { transform: scale(1.15); color: #e74c3c; }
.wl-btn.on { color: #e74c3c; }
.nv-wl { position: relative; }
.wl-badge {
  background: #e74c3c; color: #fff; border-radius: 50%; min-width: 18px; height: 18px;
  font-size: 10px; display: inline-flex; align-items: center; justify-content: center;
  position: absolute; top: -5px; right: -8px; padding: 0 3px; line-height: 1;
}

/* ---------- Mobile CTA ---------- */
#mob-cta {
  display: none; position: fixed; bottom: 0; left: 0; right: 0; background: var(--white);
  padding: 12px 20px; box-shadow: 0 -4px 20px rgba(0,0,0,.15); z-index: 999;
  align-items: center; gap: 12px; justify-content: space-between;
}
@media (max-width: 900px) { #mob-cta.on-detail { display: flex; } }
#mob-cta .mp { font-weight: 700; font-size: 1.15rem; color: var(--secondary); }
#mob-cta .ms { font-size: .72rem; color: var(--text-light); }
#mob-cta .bt { white-space: nowrap; padding: 12px 24px; font-size: .9rem; }

/* ---------- About CTA ---------- */
.ctab { text-align: center; margin-top: 40px; }

/* ---------- Offline Banner ---------- */
.offline-banner {
  display: none; background: #e74c3c; color: var(--white); text-align: center;
  padding: 8px; font-size: .82rem; font-weight: 500;
}
.offline-banner.on { display: block; }

/* ---------- Blog Cards ---------- */
.rc {
  display: flex; flex-direction: column; background: var(--white);
  border-radius: 12px; overflow: hidden; box-shadow: var(--shadow);
  transition: var(--transition); text-decoration: none; color: inherit;
}
.rc:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.ti {
  width: 100%; height: 200px; background-size: cover; background-position: center;
  background-color: var(--g50); flex-shrink: 0; position: relative;
}
.tg-b { padding: 20px; flex: 1; display: flex; flex-direction: column; }
.tg-b h3 { font-size: 1.1rem; color: var(--text-dark); margin-bottom: 10px; line-height: 1.4; }
.tg-b p { color: var(--text-light); font-size: .9rem; line-height: 1.6; margin-bottom: 12px; }
.tg-m {
  margin-top: auto; padding-top: 12px; border-top: 1px solid #eef0f2;
  display: flex; justify-content: space-between; align-items: center;
  font-size: .8rem; color: var(--g600);
}
.tg-m > span + span { color: var(--secondary); font-weight: 600; }
.tg-m i { margin-right: 4px; }

/* Blog grid: reuse tour grid for responsiveness */
.pg-blog .tg { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
@media (max-width: 640px) {
  .pg-blog .tg { grid-template-columns: 1fr; }
  .ti { height: 180px; }
}

/* ---------- Blog Detail ---------- */
.bd-back {
  display: inline-flex; align-items: center; gap: 8px; color: var(--primary);
  text-decoration: none; font-size: .9rem; font-weight: 600; margin-bottom: 20px;
  transition: color .2s;
}
.bd-back:hover { color: var(--secondary); }
.bd-title {
  font-size: 2rem; font-weight: 800; color: var(--text-dark); line-height: 1.3;
  margin-bottom: 16px;
}
.bd-meta {
  display: flex; gap: 20px; color: var(--g600); font-size: .88rem; margin-bottom: 30px;
  padding-bottom: 20px; border-bottom: 1px solid #eef0f2;
}
.bd-meta span { display: flex; align-items: center; gap: 6px; }
.bd-meta i { color: var(--primary); }
.bd-img-wrap { margin-bottom: 30px; border-radius: 12px; overflow: hidden; }
.bd-img { width: 100%; max-height: 450px; object-fit: cover; display: block; }
.bd-content { line-height: 1.85; color: var(--text-dark); }
.bd-h2 { font-size: 1.5rem; font-weight: 700; color: var(--text-dark); margin: 32px 0 16px; }
.bd-h3 { font-size: 1.2rem; font-weight: 600; color: var(--text-dark); margin: 24px 0 12px; }
.bd-p { margin-bottom: 16px; color: var(--text-light); font-size: 1.02rem; }
@media (max-width: 768px) {
  .bd-title { font-size: 1.5rem; }
  .bd-meta { flex-direction: column; gap: 8px; }
  .bd-img { max-height: 300px; }
}

/* ---------- Blog Sidebar v2.42 ---------- */
.bl-wrap { display: flex; gap: 32px; align-items: flex-start; }
.bl-sb { width: 280px; flex-shrink: 0; position: sticky; top: 100px; }
.bl-main { flex: 1; min-width: 0; }
.bl-search {
  display: flex; background: var(--white); border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06); overflow: hidden; margin-bottom: 16px;
}
.bl-search input {
  flex: 1; border: none; padding: 12px 16px; font-size: .9rem;
  background: transparent; color: var(--text-dark); outline: none;
}
.bl-search input::placeholder { color: var(--g400); }
.bl-search button {
  background: var(--primary); border: none; color: #fff; padding: 12px 16px;
  cursor: pointer; transition: background .2s;
}
.bl-search button:hover { background: var(--secondary); }
.bl-sort {
  display: flex; align-items: center; gap: 8px; margin-bottom: 20px;
  font-size: .85rem; color: var(--g600);
}
.bl-sort select {
  flex: 1; padding: 6px 10px; border: 1px solid #e0e0e0; border-radius: 6px;
  font-size: .85rem; background: var(--white); color: var(--text-dark);
  cursor: pointer;
}
.bl-sort select:focus { border-color: var(--primary); outline: none; }
.bl-sec { margin-bottom: 24px; }
.bl-sec-title {
  font-size: .85rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px; color: var(--g500); margin-bottom: 12px;
  padding-bottom: 8px; border-bottom: 2px solid var(--primary);
}
.bl-cats { list-style: none; padding: 0; margin: 0; }
.bl-cats li { margin-bottom: 4px; }
.bl-cats li a, .bl-cats li span {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; border-radius: 8px; text-decoration: none;
  font-size: .88rem; color: var(--text-dark); transition: all .2s;
  cursor: pointer;
}
.bl-cats li a:hover, .bl-cats li span:hover { background: rgba(26,95,122,0.06); color: var(--primary); }
.bl-cats li a.active, .bl-cats li span.active {
  background: var(--primary); color: #fff; font-weight: 600;
}
.bl-cats li a.active .bl-count, .bl-cats li span.active .bl-count {
  background: rgba(255,255,255,0.25); color: #fff;
}
.bl-count {
  background: #f0f4f8; color: var(--g600); font-size: .75rem;
  padding: 2px 8px; border-radius: 20px; font-weight: 600; min-width: 24px; text-align: center;
}
.bl-feat { display: flex; flex-direction: column; gap: 10px; }
.bl-feat a {
  display: flex; gap: 10px; text-decoration: none; align-items: flex-start;
  padding: 6px 0; border-bottom: 1px solid #f0f0f0; transition: opacity .2s;
}
.bl-feat a:hover { opacity: .75; }
.bl-feat a:last-child { border-bottom: none; }
.bl-feat-img {
  width: 56px; height: 56px; border-radius: 8px; background-size: cover;
  background-position: center; flex-shrink: 0; background-color: var(--g50);
}
.bl-feat-info { flex: 1; min-width: 0; }
.bl-feat-info .bl-feat-title {
  font-size: .8rem; font-weight: 600; color: var(--text-dark);
  line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 2px;
}
.bl-feat-info .bl-feat-date {
  font-size: .72rem; color: var(--g500);
}
.bl-active-filter {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 16px; background: rgba(26,95,122,0.06);
  border-radius: 8px; margin-bottom: 20px; font-size: .88rem;
}
.bl-active-filter span { color: var(--primary); font-weight: 600; }
.bl-active-filter button {
  background: none; border: none; color: var(--g500); cursor: pointer;
  padding: 2px 6px; font-size: .85rem; margin-left: auto;
}
.bl-active-filter button:hover { color: var(--text-dark); }
/* Blog tag badges on cards */
.bl-tags {
  display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px;
}
.bl-tag {
  font-size: .7rem; padding: 2px 8px; border-radius: 12px;
  background: rgba(26,95,122,0.08); color: var(--primary);
  font-weight: 500; text-transform: uppercase; letter-spacing: .3px;
}
/* Blog card enhancements */
.rc .bl-tags { padding: 0 20px; }
.rc .bl-cat-badge {
  position: absolute; top: 12px; left: 12px; font-size: .7rem;
  padding: 4px 10px; border-radius: 12px; text-transform: uppercase;
  font-weight: 600; letter-spacing: .3px; z-index: 1;
}
/* Responsive: sidebar below on mobile */
@media (max-width: 900px) {
  .bl-wrap { flex-direction: column; }
  .bl-sb { width: 100%; position: static; }
  .bl-feat { flex-direction: row; flex-wrap: wrap; gap: 12px; }
  .bl-feat a { flex-direction: column; width: calc(50% - 12px); border-bottom: none; padding: 0; }
  .bl-feat-img { width: 100%; height: 80px; }
}

/* ---------- Search Results ---------- */
#sr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
#sr-loading .sk {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%; animation: skShimmer 1.5s infinite; border-radius: 8px;
}
@keyframes skShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
@media (max-width: 640px) {
  #sr-grid { grid-template-columns: 1fr; }
}

/* ---------- Attraction Cards (API v2.13) ---------- */
.acd {
  background: #fff; border-radius: 16px; overflow: hidden;
  box-shadow: 0 3px 14px rgba(0,0,0,0.08); transition: all .3s;
  display: block; text-decoration: none; color: inherit;
}
.acd:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.14); }
.acd.sk { pointer-events: none; }
.acd .ai { height: 210px; overflow: hidden; position: relative; }
.acd .ai img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.acd:hover .ai img { transform: scale(1.06); }
.acd .att-badge {
  position: absolute; top: 12px; left: 12px;
  background: rgba(0,0,0,0.55); backdrop-filter: blur(4px);
  color: #fff; padding: 4px 10px; border-radius: 20px; font-size: 12px;
}
.acd .att-hot { background: linear-gradient(135deg, #e74c3c, #c0392b); }
.acd .abd { padding: 20px; }
.acd .att-title { font-size: 1.1rem; font-weight: 700; color: #111; margin: 0 0 8px; }
.acd .att-title i { color: #c8a96e; margin-right: 4px; }
.acd .att-loc { font-size: 12px; color: #888; margin-bottom: 10px; }
.acd .att-desc { font-size: 13px; color: #666; line-height: 1.65; margin-bottom: 14px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.acd .att-footer { display: flex; align-items: center; justify-content: space-between; }
.acd .att-info { display: flex; gap: 12px; font-size: 12px; color: #888; }
.acd .att-info i { color: #c8a96e; margin-right: 3px; }
.acd .att-btn { padding: 7px 16px; background: #c8a96e; color: #fff; border-radius: 8px; font-size: 13px; font-weight: 600; transition: background .2s; }
.acd .att-btn:hover { background: #b8994e; }

.acd .sk-ln {
  height: 16px; margin-bottom: 8px; border-radius: 4px;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%; animation: skShimmer 1.5s infinite;
}
.acd .sk-ln.st { width: 60%; }

/* ========== Testimonials (v2.16) ========== */
.tm-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 24px;
  padding: 16px 0 32px;
}
@media (max-width: 768px) { .tm-grid { grid-template-columns: 1fr; } }

.tmc {
  background: var(--white);
  border: 1px solid var(--g50);
  border-radius: 16px;
  padding: 28px 24px 24px;
  box-shadow: var(--shadow);
  transition: var(--transition);
  display: flex; flex-direction: column;
}
.tmc:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }

.tm-stars { margin-bottom: 14px; }
.tm-star { color: #ddd; font-size: 1.1rem; margin-right: 2px; }
.tm-star.on { color: #f9a825; }

.tm-quote {
  font-size: 0.93rem;
  line-height: 1.75;
  color: var(--text-light);
  font-style: italic;
  flex: 1;
  margin-bottom: 18px;
  border-left: 3px solid var(--a600);
  padding-left: 14px;
  quotes: none;
}

.tm-author { border-top: 1px solid var(--g50); padding-top: 14px; }
.tm-name { display: block; font-weight: 700; font-size: 0.92rem; color: var(--text-dark); margin-bottom: 2px; }
.tm-from { display: block; font-size: 0.78rem; color: var(--g600); }

/* ========== Newsletter Footer (v2.16) ========== */
.nl-wrap { display: flex; flex-direction: column; }
#nl-email {
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 6px;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: .85rem;
  font-family: inherit;
  outline: none;
  transition: border-color .2s;
}
#nl-email::placeholder { color: rgba(255,255,255,.35); }
#nl-email:focus { border-color: var(--a500); }
.nl-msg { font-size: .78rem; margin-top: 6px; min-height: 1.2em; }
.nl-msg.ok { color: #4caf50; }
.nl-msg.er { color: #ef5350; }

/* ============= v3.4 �?Share Bar ============= */
.share-bar {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 0; margin-top: 16px;
}
.share-label { font-size: .85rem; color: var(--text-light); margin-right: 4px; }
.share-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--g100); background: var(--white);
  color: var(--g600); font-size: .9rem; cursor: pointer;
  transition: all .2s;
}
.share-btn:hover { border-color: var(--primary); color: var(--primary); background: rgba(26,95,122,.05); }
.share-native { color: var(--a600); border-color: var(--a200); }
.share-native:hover { background: rgba(249,168,37,.08); }
@media (max-width: 480px) {
  .share-bar { justify-content: center; flex-wrap: wrap; }
}

/* ============= v3.4 �?Trust Badges ============= */
.trust-row {
  display: flex; justify-content: center; gap: 0;
  max-width: 960px; margin: 0 auto;
}
.trust-item {
  flex: 1; text-align: center; padding: 14px 10px;
  border-right: 1px solid var(--g50);
}
.trust-item:last-child { border-right: none; }
.trust-icon {
  display: block; font-size: 1.2rem; color: var(--primary);
  margin-bottom: 6px;
}
.trust-label {
  display: block; font-size: .82rem; color: var(--text-dark);
  margin-bottom: 3px; font-weight: 600;
}
.trust-desc {
  display: block; font-size: .7rem; color: var(--text-light);
}
@media (max-width: 640px) {
  .trust-row { flex-wrap: wrap; }
  .trust-item { flex: 0 0 50%; border-bottom: 1px solid var(--g50); padding: 10px 6px; }
  .trust-item:nth-child(even) { border-right: none; }
  .trust-item:nth-last-child(-n+2) { border-bottom: none; }
}

/* ============= v3.16 �?Currency Dropdown (v2.36) ============= */
.nv-sel {
  padding: 5px 10px; font-size: .78rem; font-weight: 600; cursor: pointer;
  font-family: inherit; border: 1px solid var(--g100); border-radius: 20px;
  background: transparent; color: var(--text-light); outline: none;
  transition: all .2s; appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 8px center;
  padding-right: 26px; min-width: 90px;
}
.nv-sel:focus { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(220,38,38,0.15); }
.nv-sel option { background: #fff; color: #333; }
/* Dark mode */
body.dark .nv-sel { border-color: var(--g600); color: var(--g300); }
body.dark .nv-sel option { background: #1f2937; color: #e5e7eb; }
body.dark .nv-sel:focus { box-shadow: 0 0 0 2px rgba(239,68,68,0.25); }
@media (max-width: 900px) {
  .nv-sel { min-width: 80px; padding: 5px 22px 5px 8px; font-size: .72rem; }
}

/* Dark mode toggle standalone */
.dm-btn {
  background: none; border: 1px solid var(--g200); border-radius: 50%;
  width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--text-light); font-size: 1rem; transition: all .2s;
  margin-left: 8px;
}
.dm-btn:hover { border-color: var(--accent); color: var(--accent); }
[data-theme="dark"] .dm-btn { border-color: #404850; }
[data-theme="dark"] .dm-btn:hover { border-color: var(--accent); }

/* ============= v3.5 �?Lightbox ============= */
.lbx {
  display: none; position: fixed; inset: 0; z-index: 10000;
  background: rgba(0,0,0,.92); flex-direction: column; align-items: center;
  justify-content: center; animation: lbxFade .25s;
}
.lbx.on { display: flex; }
@keyframes lbxFade { from { opacity: 0; } to { opacity: 1; } }
.lbx-img {
  max-width: 90vw; max-height: 80vh; object-fit: contain;
  border-radius: 8px; box-shadow: 0 4px 60px rgba(0,0,0,.5);
}
.lbx-close {
  position: absolute; top: 20px; right: 20px; width: 44px; height: 44px;
  border-radius: 50%; background: rgba(255,255,255,.15); border: none;
  color: #fff; font-size: 1.3rem; cursor: pointer; display: flex;
  align-items: center; justify-content: center; transition: all .2s;
  z-index: 10001;
}
.lbx-close:hover { background: var(--secondary); }
.lbx-nav {
  position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px;
  border-radius: 50%; background: rgba(255,255,255,.15); border: none;
  color: #fff; font-size: 1.3rem; cursor: pointer; display: flex;
  align-items: center; justify-content: center; transition: all .2s;
  z-index: 10001;
}
.lbx-nav:hover { background: rgba(255,255,255,.3); }
.lbx-prev { left: 24px; }
.lbx-next { right: 24px; }
.lbx-counter {
  position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
  color: rgba(255,255,255,.7); font-size: .9rem; font-weight: 500;
}
@media (max-width: 640px) {
  .lbx-nav { width: 40px; height: 40px; font-size: 1.1rem; }
  .lbx-prev { left: 10px; }
  .lbx-next { right: 10px; }
  .lbx-img { max-width: 95vw; max-height: 70vh; }
}

/* ============= v3.6 �?WhatsApp / WeChat Floating Buttons ============= */
.fab-wrap {
  position: fixed; bottom: 28px; right: 24px; z-index: 9990;
  display: flex; flex-direction: column; gap: 12px;
}
.fab-btn {
  width: 56px; height: 56px; border-radius: 50%; border: none;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; cursor: pointer; box-shadow: 0 4px 16px rgba(0,0,0,.18);
  transition: all .25s; color: #fff; text-decoration: none;
  position: relative;
}
.fab-btn:hover { transform: scale(1.08); box-shadow: 0 6px 24px rgba(0,0,0,.25); }
.fab-btn:active { transform: scale(.95); }
.fab-wa { background: #25D366; }
.fab-wa:hover { background: #1ebe57; }
.fab-wc { background: #07C160; }
.fab-wc:hover { background: #06ad56; }
.fab-tooltip {
  position: absolute; right: 68px; background: rgba(0,0,0,.78); color: #fff;
  padding: 6px 14px; border-radius: 16px; font-size: .78rem; white-space: nowrap;
  pointer-events: none; opacity: 0; transition: opacity .2s;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.fab-btn:hover .fab-tooltip { opacity: 1; }
.fab-pulse {
  position: absolute; top: -4px; right: -4px; width: 14px; height: 14px;
  background: #ff4757; border-radius: 50%; border: 2px solid #fff;
  animation: fabPulse 2s infinite;
}
@keyframes fabPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,71,87,.5); }
  50% { box-shadow: 0 0 0 8px rgba(255,71,87,0); }
}
@media (max-width: 480px) {
  .fab-wrap { bottom: 20px; right: 16px; gap: 10px; }
  .fab-btn { width: 50px; height: 50px; font-size: 1.3rem; }
}

/* ============= v3.6 �?Cookie Consent Banner ============= */
.cc-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999;
  background: var(--white); border-top: 1px solid var(--g100);
  box-shadow: 0 -4px 24px rgba(0,0,0,.1); padding: 16px 0;
  transform: translateY(100%); transition: transform .4s ease;
}
.cc-banner.on { transform: translateY(0); }
.cc-inner {
  max-width: 960px; margin: 0 auto; padding: 0 24px;
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.cc-text { flex: 1; min-width: 240px; font-size: .85rem; color: var(--g600); line-height: 1.6; }
.cc-text a { color: var(--primary); text-decoration: underline; }
.cc-actions { display: flex; gap: 10px; flex-shrink: 0; }
.cc-actions button {
  padding: 8px 20px; border-radius: 24px; font-size: .82rem; font-weight: 600;
  cursor: pointer; font-family: inherit; transition: all .2s; border: 1px solid var(--g100);
}
.cc-accept { background: var(--primary); color: #fff; border-color: var(--primary) !important; }
.cc-accept:hover { background: #15506a; }
.cc-dismiss { background: transparent; color: var(--g600); }
.cc-dismiss:hover { background: var(--g50); }
@media (max-width: 640px) {
  .cc-inner { flex-direction: column; text-align: center; padding: 0 16px; }
  .cc-actions { width: 100%; justify-content: center; }
  .cc-actions button { flex: 1; }
}

/* ============= v3.6 �?Card entrance animations ============= */
.tc, .tmc, .rc, .acd {
  opacity: 0; transform: translateY(24px);
  transition: opacity .5s ease, transform .5s ease;
}
@media (prefers-reduced-motion: reduce) {
  .tc, .tmc, .rc, .acd { opacity: 1; transform: none; transition: none; }
}

/* ============= v3.7 �?Breadcrumb + Search Autocomplete (v2.22) ============= */
.bc {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: .82rem; color: var(--g600);
  padding: 16px 0; margin-bottom: 8px;
}
.bc a { color: var(--g600); text-decoration: none; transition: color .2s; }
.bc a:hover { color: var(--primary); }
.bc .bcl { color: var(--accent); font-weight: 500; }
.bc i { font-size: .75rem; }

/* Search autocomplete dropdown (v3.31 enhanced) */
.ss { position: relative; }
.ss-dd {
  display: none; position: absolute; top: 100%; left: 0; right: 0;
  background: var(--white); border: 1px solid var(--g100); border-radius: 0 0 14px 14px;
  box-shadow: 0 12px 40px rgba(0,0,0,.15); z-index: 100; max-height: 420px;
  overflow-y: auto; margin-top: 4px; padding: 6px 0;
}
.ss-item {
  padding: 10px 16px; font-size: .85rem; color: var(--text-dark);
  cursor: pointer; transition: background .15s; display: flex; align-items: center; gap: 8px;
}
.ss-item:hover, .ss-item:focus { background: var(--g50); }
.ss-item:first-child { padding-top: 14px; }
.ss-item:last-child { padding-bottom: 14px; }

/* Section headers in dropdown */
.ss-section-hdr {
  padding: 8px 16px; font-size: .73rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .05em; color: var(--text-light); display: flex; align-items: center; gap: 6px;
}
.ss-section-divider { height: 1px; background: var(--g100); margin: 4px 12px; }

/* Recent searches */
.ss-recent-ico { color: var(--text-light); font-size: .8rem; opacity: .6; }
.ss-clear-row { text-align: right; padding: 4px 12px 8px; }
.ss-clear-btn {
  background: none; border: none; color: var(--secondary); font-size: .75rem;
  cursor: pointer; padding: 2px 6px; border-radius: 4px; font-weight: 500;
}
.ss-clear-btn:hover { background: rgba(200,75,49,.08); }

/* Popular search chips */
.ss-popular-wrap { padding: 6px 16px 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.ss-popular-chip {
  display: inline-block; padding: 4px 12px; font-size: .78rem; font-weight: 500;
  background: var(--bg-light); border: 1px solid var(--g100); border-radius: 20px;
  cursor: pointer; transition: all .15s; color: var(--text-dark);
}
.ss-popular-chip:hover { background: var(--primary); color: #fff; border-color: var(--primary); }

/* Rich tour result items */
.ss-rich { display: flex; align-items: flex-start; gap: 12px; padding: 12px 16px !important; }
.ss-rich-thumb {
  width: 56px; height: 42px; flex-shrink: 0; border-radius: 6px; overflow: hidden;
  background: var(--g100);
}
.ss-rich-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ss-rich-info { flex: 1; min-width: 0; }
.ss-rich-title { font-size: .85rem; font-weight: 600; color: var(--text-dark); line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-rich-meta { font-size: .75rem; color: var(--text-light); display: flex; align-items: center; gap: 3px; margin-top: 3px; flex-wrap: wrap; }
.ss-rich-meta i { font-size: .65rem; }
.ss-rich-meta .fa-star { color: #f59e0b; }

/* Filter chip count badge (v3.31) */
.ch {
  display: inline-flex !important; align-items: center; gap: 6px;
}
.ch-label { font-weight: 500; }
.ch-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px;
  background: var(--g100); color: var(--text-light); font-size: .72rem; font-weight: 600;
  transition: all .2s;
}
.ch.ac .ch-count, .ch:hover .ch-count { background: var(--primary); color: #fff; }

/* Empty state suggested tours (v3.31) */
.es-suggest-hdr {
  font-size: .9rem; font-weight: 600; color: var(--text-dark);
  margin-top: 32px; margin-bottom: 14px; text-align: center;
}
.es-suggest-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
  max-width: 600px; margin: 0 auto;
}
.es-suggest-card {
  background: var(--white); border-radius: 10px; overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,.07); cursor: pointer;
  transition: transform .2s, box-shadow .2s; text-align: left;
}
.es-suggest-card:hover { transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.es-suggest-img {
  height: 80px; overflow: hidden; background: var(--g100);
}
.es-suggest-img img { width: 100%; height: 100%; object-fit: cover; }
.es-suggest-title {
  font-size: .78rem; font-weight: 600; color: var(--text-dark);
  padding: 6px 8px 0; line-height: 1.3;
}
.es-suggest-meta {
  font-size: .72rem; color: var(--text-light); padding: 2px 8px 8px;
  display: flex; align-items: center; gap: 2px;
}
.es-suggest-meta .fa-star { color: #f59e0b; font-size: .6rem; }

/* Dark mode for enhanced search */
[data-theme="dark"] .ss-dd { background: var(--g800); border-color: var(--g600); }
[data-theme="dark"] .ss-item { color: #e2e8f0; }
[data-theme="dark"] .ss-item:hover { background: var(--g600); }
[data-theme="dark"] .ss-section-divider { background: var(--g600); }
[data-theme="dark"] .ss-popular-chip { background: var(--g700); border-color: var(--g600); color: #c9d1d9; }
[data-theme="dark"] .ss-popular-chip:hover { background: var(--primary); border-color: var(--primary); }
[data-theme="dark"] .ss-rich-thumb { background: var(--g700); }
[data-theme="dark"] .ch-count { background: var(--g700); color: var(--g400); }
[data-theme="dark"] .es-suggest-card { background: var(--g800); }
[data-theme="dark"] .es-suggest-title { color: #e2e8f0; }
[data-theme="dark"] .es-suggest-img { background: var(--g700); }

/* Responsive: empty state suggestions */
@media (max-width: 600px) {
  .es-suggest-grid { grid-template-columns: 1fr; max-width: 220px; }
  .ss-rich-thumb { width: 44px; height: 36px; }
}

/* Honeypot �?hidden from view but detectable by bots */
#fhp { display: none; }

/* ============= v3.8 �?LQIP Blur-up + Focus-visible + A11y (v2.28) ============= */

/* LQIP blur-up: cards start blurred, transition to sharp on load */
.tci-img {
  opacity: 0;
  filter: blur(20px);
  transform: scale(1.05);
  transition: opacity .4s ease, filter .4s ease, transform .6s ease;
}
.tci-img.lqip-loaded {
  opacity: 1;
  filter: blur(0);
  transform: scale(1);
}
/* Blog & attraction card images also get LQIP */
.tg img, .ag img, .bg-img img {
  opacity: 0;
  transition: opacity .35s ease;
}
.tg img.lqip-loaded, .ag img.lqip-loaded, .bg-img img.lqip-loaded {
  opacity: 1;
}

/* Reduce motion preference for LQIP */
@media (prefers-reduced-motion: reduce) {
  .tci-img, .tg img, .ag img, .bg-img img {
    opacity: 1; filter: none; transform: none; transition: none;
  }
}

/* Focus-visible: better keyboard navigation outline */
:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
  border-radius: 4px;
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
}
/* Suppress focus ring for mouse clicks */
:focus:not(:focus-visible) {
  outline: none;
}

/* Skip-to-content enhanced visibility */
.sl:focus-visible {
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10000;
  clip: auto;
  width: auto;
  height: auto;
  padding: 12px 24px;
  background: var(--primary);
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0,0,0,.3);
}

/* =========== v3.11 �?Tour Comparison (v2.31) =========== */
/* Compare checkbox on tour cards */
.cmp-chk {
  position: absolute;
  top: 54px;
  right: 8px;
  width: 34px;
  height: 34px;
  border: 2px solid rgba(255,255,255,.85);
  border-radius: 50%;
  background: rgba(0,0,0,.25);
  color: #fff;
  cursor: pointer;
  z-index: 3;
  font-size: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .3s;
  backdrop-filter: blur(4px);
}
.cmp-chk:hover { border-color: #fff; background: rgba(0,0,0,.4); transform: scale(1.1); }
.cmp-chk.on { background: var(--secondary); border-color: var(--secondary); }
.cmp-chk.on i { color: #fff; }

/* Sticky compare bar */
.cmp-bar {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: #fff; border-top: 2px solid var(--primary);
  box-shadow: 0 -4px 20px rgba(0,0,0,.12);
  padding: 12px 20px;
  display: none;
  align-items: center;
  gap: 10px;
  z-index: 999;
  flex-wrap: wrap;
}
.cmp-bar.on { display: flex; }
.cmp-count {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--primary);
  white-space: nowrap;
}
.cmp-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--bg-light);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 4px 8px 4px 12px;
  font-size: 0.78rem;
}
.cmp-chip-name {
  max-width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cmp-chip-rm {
  background: none;
  border: none;
  color: #999;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  padding: 0 2px;
  transition: color .2s;
}
.cmp-chip-rm:hover { color: var(--secondary); }
.cmp-clear {
  background: none;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 6px 14px;
  font-size: 0.8rem;
  cursor: pointer;
  color: #666;
  transition: all .3s;
  font-family: inherit;
}
.cmp-clear:hover { border-color: var(--secondary); color: var(--secondary); }
.cmp-go {
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 8px 20px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .3s;
  font-family: inherit;
  margin-left: auto;
}
.cmp-go:hover { background: var(--secondary); transform: translateY(-1px); }

/* Comparison modal */
.cmp-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 10001;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 40px 20px;
  overflow-y: auto;
  backdrop-filter: blur(3px);
  animation: fadeIn .25s ease;
}
.cmp-modal-box {
  background: var(--white);
  border-radius: 16px;
  max-width: 1100px;
  width: 100%;
  box-shadow: 0 16px 48px rgba(0,0,0,.25);
  overflow: hidden;
  animation: slideUp .3s ease;
}
.cmp-mhdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(135deg, var(--primary), #2980b9);
  color: #fff;
}
.cmp-mhdr h2 { margin: 0; font-size: 1.25rem; font-weight: 700; }
.cmp-mclose {
  background: rgba(255,255,255,.2);
  border: none;
  color: #fff;
  font-size: 1.4rem;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .3s;
}
.cmp-mclose:hover { background: rgba(255,255,255,.35); }

/* Comparison table */
.cmp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.cmp-table th {
  text-align: left;
  padding: 12px 16px;
  background: var(--bg-light);
  border-bottom: 2px solid var(--border);
  font-weight: 600;
  color: #555;
  width: 100px;
  white-space: nowrap;
}
.cmp-table td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  text-align: center;
  min-width: 120px;
}
.cmp-table tr:hover td { background: rgba(26,95,122,.03); }
.cmp-table td:first-child { border-right: 2px solid var(--border); }
.cmp-img {
  width: 100%;
  max-width: 200px;
  height: 120px;
  object-fit: cover;
  border-radius: 8px;
}
.cmp-badge {
  display: inline-block;
  background: var(--bg-light);
  padding: 2px 10px;
  border-radius: 12px;
  font-size: 0.78rem;
  color: #555;
  border: 1px solid var(--border);
}
.cmp-hl {
  background: #fff3cd !important;
  font-weight: 600;
}
.cmp-actions {
  display: flex;
  gap: 10px;
  padding: 16px 24px;
  border-top: 1px solid var(--border);
  justify-content: center;
}
.cmp-diff {
  background: linear-gradient(135deg, #f9a825, #fbc02d);
  color: #333;
  border: none;
  border-radius: 6px;
  padding: 8px 18px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .3s;
  font-family: inherit;
}
.cmp-diff:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(249,168,37,.4); }

/* Dark mode for compare */
@media (prefers-color-scheme: dark) {
  .cmp-bar { background: var(--g900); border-top-color: var(--primary); }
  .cmp-chip { background: var(--g800); border-color: var(--g700); }
  .cmp-chip-name { color: #ccc; }
  .cmp-modal-box { background: var(--g900); }
  .cmp-table th { background: var(--g800); color: #aaa; }
  .cmp-table td { border-bottom-color: var(--g700); }
  .cmp-table tr:hover td { background: rgba(255,255,255,.03); }
  .cmp-hl { background: rgba(249,168,37,.15) !important; }
  .cmp-overlay { background: rgba(0,0,0,.75); }
}

/* Mobile compare bar */
@media (max-width: 768px) {
  .cmp-bar { padding: 10px 12px; gap: 6px; }
  .cmp-bar.on { flex-wrap: wrap; }
  .cmp-count { font-size: 0.75rem; }
  .cmp-chip-name { max-width: 70px; }
  .cmp-go { margin-left: 0; }
  .cmp-modal-box { margin: 0; border-radius: 12px; }
  .cmp-table th { width: 60px; font-size: 0.72rem; padding: 8px 6px; }
  .cmp-table td { font-size: 0.75rem; padding: 8px 6px; min-width: 0; }
  .cmp-mhdr { padding: 14px 16px; }
  .cmp-mhdr h2 { font-size: 1rem; }
  .cmp-actions { flex-wrap: wrap; }
}

/* =========== Print Stylesheet (v2.29) =========== */
@media print {
  /* Reset */
  *, *::before, *::after {
    background: #fff !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  /* Hide non-content elements */
  nav, .nv, .top-bar, #mb,
  footer, .ft, .nl-wrap,
  .fab-wrap, .cookie-banner, .cc-banner,
  #btt, #mob-cta, .mob-cta,
  .search-hero, .search-bar, .filter-bar, .fc,
  .share-bar, .trust-row, .tm-grid, .print-wrap,
  .pagination, .sk-grid,
  .bt, .btn, a[href^="#/contact"],
  .newsletter-section, .nl-section,
  .hero-search, .sw-controls,
  .bc, .social-links,
  .cmp-bar, .cmp-overlay, .cmp-chk,
  iframe, .video-wrap, video,
  script, style, noscript { display: none !important; }

  /* Page setup */
  @page {
    margin: 1.5cm 1.8cm;
    size: A4;
  }
  body {
    font-size: 12pt;
    line-height: 1.6;
    font-family: 'Georgia', 'Times New Roman', serif;
  }

  /* Typography */
  h1 { font-size: 22pt; margin: 0 0 8pt; page-break-after: avoid; }
  h2 { font-size: 16pt; margin: 14pt 0 6pt; page-break-after: avoid; }
  h3 { font-size: 13pt; margin: 10pt 0 4pt; page-break-after: avoid; }
  p, li { font-size: 11pt; orphans: 3; widows: 3; }

  /* Tour header */
  .dh {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    margin-bottom: 12pt;
    border-bottom: 2pt solid #000;
    padding-bottom: 10pt;
  }
  .dhi {
    max-width: 100%;
    max-height: 180pt;
    object-fit: contain;
    display: block;
    margin-bottom: 8pt;
    page-break-inside: avoid;
  }
  .do { position: static !important; padding: 0 !important; }
  .do h1 { font-size: 20pt; color: #000 !important; }
  .mt span { margin-right: 16pt; font-size: 10pt; }

  /* Content sections */
  .content-section, .dc, .ac, .atc, .bc-wrap {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 0 12pt !important;
  }

  /* Itinerary / overview / highlights blocks */
  .overview-block, .highlights-block, .itinerary-block, .inclusions-block {
    margin-bottom: 10pt;
    page-break-inside: avoid;
  }

  /* Gallery - show first 2 images only */
  .gallery-grid, .tg {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6pt;
    margin: 8pt 0;
  }
  .tg img, .gi, .gallery-grid img {
    max-width: 48%;
    max-height: 120pt;
    object-fit: cover;
    page-break-inside: avoid;
  }
  .tg img:nth-child(n+3) { display: none !important; }

  /* Links */
  a { text-decoration: underline; color: #000 !important; }
  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: #666 !important;
    text-decoration: none;
  }
  a[href^="#"]::after { content: none; } /* skip hash links */
  a[href^="javascript"]::after { content: none; }

  /* Price block */
  .dp, .tcp { font-size: 18pt; font-weight: bold; margin: 8pt 0; }

  /* Avoid page breaks inside */
  h1, h2, h3, h4, img, table, figure, .tci, .tc {
    page-break-inside: avoid;
  }

  /* Footer watermark */
  body::after {
    content: "Beijing Wonder Tours | beijingwondertours.com | +86 153 4772 3823";
    display: block;
    text-align: center;
    font-size: 8pt;
    color: #999 !important;
    margin-top: 24pt;
    padding-top: 8pt;
    border-top: 1pt solid #ccc;
  }
}

/* ==== Interactive Tour Map (v2.32) ==== */
.tour-map-card { margin: 0 0 20px; }
.tour-map-card h2 { margin: 0 0 12px; }
.tour-map-container {
  width: 100%;
  height: 380px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--g200);
  background: var(--g50);
  z-index: 1;
}
.tour-map-container.listing-map { height: 450px; }
/* Leaflet overrides for dark mode */
[data-theme="dark"] .tour-map-container {
  border-color: var(--g700);
  background: var(--g800);
}
/* Leaflet tile dark filter for dark mode */
[data-theme="dark"] .tour-map-container .leaflet-tile {
  filter: brightness(0.6) invert(1) contrast(3) hue-rotate(200deg) saturate(0.3) brightness(0.7);
}
[data-theme="dark"] .tour-map-container .leaflet-container {
  background: #1a1a2e;
}
/* Map popup styling */
.tour-map-popup { font-family: inherit; min-width: 160px; }
.tour-map-popup strong { font-size: 0.92rem; display: block; margin-bottom: 4px; color: var(--a700); }
.tour-map-popup small { color: var(--g500); font-size: 0.78rem; display: block; margin-bottom: 4px; }
.tour-map-popup .popup-link {
  display: inline-block; margin-top: 6px; font-size: 0.8rem;
  background: var(--a600); color: #fff; padding: 3px 10px; border-radius: 4px;
  text-decoration: none; cursor: pointer;
}
.tour-map-popup .popup-link:hover { background: var(--a700); }
/* Map legend */
.map-legend {
  background: rgba(255,255,255,0.92); padding: 8px 12px; border-radius: 6px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.15); font-size: 0.78rem; line-height: 1.6;
}
[data-theme="dark"] .map-legend { background: rgba(30,30,50,0.92); color: #ddd; }
.map-legend i { margin-right: 4px; }
/* Tour listing map toggle */
.map-toggle-bar {
  display: flex; align-items: center; gap: 10px; margin: 16px 0;
  padding: 0; flex-wrap: wrap;
}
.map-toggle-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px;
  border: 1px solid var(--g300); border-radius: 20px; background: var(--white);
  font-size: 0.82rem; color: var(--g600); cursor: pointer; transition: all 0.2s;
}
.map-toggle-btn:hover { border-color: var(--a500); color: var(--a600); }
.map-toggle-btn.active { background: var(--a600); color: #fff; border-color: var(--a600); }
/* Responsive */
@media (max-width:768px) {
  .tour-map-container { height: 280px; }
  .tour-map-container.listing-map { height: 340px; }
  .map-legend { font-size: 0.7rem; padding: 6px 10px; }
}

/* ==== Itinerary Timeline (v2.33) ==== */
/* Toggle buttons */
.tl-toggle { display: inline-flex; border: 1px solid var(--g300); border-radius: 20px; overflow: hidden; }
.tl-tbtn {
  padding: 5px 14px; font-size: 0.78rem; border: none; background: transparent;
  color: var(--g500); cursor: pointer; transition: all 0.2s;
}
.tl-tbtn.active { background: var(--a600); color: #fff; }
.tl-tbtn:hover:not(.active) { color: var(--a600); }

/* Timeline wrapper */
.tl-wrap {
  position: relative; padding-left: 48px; margin-top: 4px;
}

/* Vertical timeline line */
.tl-line {
  position: absolute; left: 19px; top: 10px; bottom: 10px;
  width: 2px; background: linear-gradient(to bottom, var(--a400), var(--a200) 60%, var(--g200));
  border-radius: 1px;
}

/* Day marker dot */
.tl-item { position: relative; margin-bottom: 24px; }
.tl-item:last-child { margin-bottom: 0; }
.tl-dot {
  position: absolute; left: -48px; top: 2px; width: 40px; height: 40px;
  border-radius: 50%; background: var(--white); border: 2px solid var(--a400);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 4px rgba(59,130,246,0.08);
  z-index: 1; transition: all 0.25s;
}
.tl-item:hover .tl-dot {
  border-color: var(--a600); box-shadow: 0 0 0 6px rgba(59,130,246,0.15);
  transform: scale(1.08);
}
.tl-dot-num {
  font-size: 0.72rem; font-weight: 700; color: var(--a600); letter-spacing: 0.02em;
}

/* Day card */
.tl-card {
  background: var(--white); border: 1px solid var(--g100); border-radius: 12px;
  padding: 16px 20px; transition: box-shadow 0.25s, border-color 0.25s;
}
.tl-item:hover .tl-card {
  box-shadow: 0 4px 16px rgba(0,0,0,0.06); border-color: var(--g200);
}

/* Day header */
.tl-day-h { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.tl-day-title { font-weight: 600; font-size: 1rem; color: var(--text-dark); }
.tl-dur {
  font-size: 0.72rem; color: var(--g500); background: var(--bg-tag);
  padding: 2px 8px; border-radius: 10px;
}

/* Description */
.tl-desc { font-size: 0.88rem; color: var(--g600); line-height: 1.65; margin-bottom: 10px; }

/* Activities row */
.tl-act-row { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 8px; }
.tl-act-tag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 11px; border-radius: 16px; font-size: 0.8rem;
  background: var(--bg-tag); color: var(--g700);
  border: 1px solid var(--g200); transition: all 0.2s;
}
.tl-act-tag:hover { border-color: var(--a300); background: rgba(59,130,246,0.04); color: var(--a700); }
.tl-tag-ic { font-size: 0.72rem; color: var(--a500); }

/* Meals */
.tl-meals { margin-top: 6px; }
.tl-meal-badge {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 3px 9px; border-radius: 12px; font-size: 0.72rem; font-weight: 600;
  color: #fff;
}
.tl-meal-b { background: #f59e0b; }  /* breakfast - amber */
.tl-meal-l { background: #10b981; }  /* lunch - emerald */
.tl-meal-d { background: #6366f1; }  /* dinner - indigo */
.tl-meal-ic { font-size: 0.62rem; }
.tl-meal-txt { font-size: 0.78rem; color: var(--g500); }

/* Highlight */
.tl-highlight {
  margin-top: 8px; font-size: 0.82rem; color: var(--a600); background: rgba(59,130,246,0.06);
  padding: 6px 12px; border-radius: 8px; border-left: 3px solid var(--a400);
}
.tl-hl-ic { font-size: 0.7rem; }

/* List view mode: hide timeline line + dots, show as plain list */
.tl-list-view .tl-line { display: none; }
.tl-list-view .tl-dot { display: none; }
.tl-list-view { padding-left: 0; }
.tl-list-view .tl-item { margin-bottom: 12px; }
.tl-list-view .tl-card { border-left: 2px solid transparent; }
.tl-list-view .tl-item:hover .tl-card { border-left-color: var(--a400); }

/* ==== Dark mode timeline ==== */
[data-theme="dark"] .tl-line { background: linear-gradient(to bottom, var(--a500), var(--a300) 60%, rgba(255,255,255,0.05)); }
[data-theme="dark"] .tl-dot { background: var(--card-bg); border-color: var(--a500); box-shadow: 0 0 0 4px rgba(59,130,246,0.12); }
[data-theme="dark"] .tl-dot-num { color: var(--a400); }
[data-theme="dark"] .tl-card { background: var(--card-bg); border-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .tl-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.25); border-color: rgba(255,255,255,0.1); }
[data-theme="dark"] .tl-act-tag { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.08); color: #ccc; }
[data-theme="dark"] .tl-act-tag:hover { border-color: var(--a500); background: rgba(59,130,246,0.1); color: var(--a300); }
[data-theme="dark"] .tl-highlight { background: rgba(59,130,246,0.08); }
[data-theme="dark"] .tl-toggle { border-color: rgba(255,255,255,0.12); }
[data-theme="dark"] .tl-tbtn { color: #999; }
[data-theme="dark"] .tl-tbtn:hover:not(.active) { color: var(--a400); }
[data-theme="dark"] .tl-meal-txt { color: #999; }

/* ==== Timeline responsive ==== */
@media (max-width:640px) {
  .tl-wrap { padding-left: 40px; }
  .tl-line { left: 16px; }
  .tl-dot { left: -40px; width: 34px; height: 34px; }
  .tl-dot-num { font-size: 0.65rem; }
  .tl-card { padding: 12px 14px; }
  .tl-day-title { font-size: 0.9rem; }
  .tl-act-tag { font-size: 0.73rem; padding: 3px 9px; }
  .tl-toggle { margin-top: 2px; }
  .tl-tbtn { padding: 4px 10px; font-size: 0.7rem; }
}

/* ---------- Group Pricing Table (v2.34) ---------- */
.pr-table { margin-top: 14px; border: 1px solid var(--g100); border-radius: 10px; overflow: hidden; }
.pr-row { display: flex; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--g100); font-size: 0.9rem; transition: background .2s; }
.pr-row:last-child { border-bottom: none; }
.pr-row:hover { background: var(--g50); }
.pr-row.best { background: linear-gradient(135deg, #fff8e1, #fff3cd); border-left: 4px solid var(--accent); }
.pr-row.best .pr-badge { background: var(--accent); color: #333; font-size: 0.68rem; padding: 2px 8px; border-radius: 10px; font-weight: 700; margin-left: 8px; white-space: nowrap; }
.pr-grp { flex: 1; display: flex; align-items: center; gap: 8px; font-weight: 600; color: var(--text-dark); }
.pr-grp i { color: var(--primary); width: 18px; text-align: center; }
.pr-price-col { text-align: right; }
.pr-price-per { font-weight: 700; font-size: 1.05rem; color: var(--secondary); }
.pr-price-small { font-size: 0.75rem; color: var(--g400); }
.pr-save { color: var(--gn); font-size: 0.75rem; font-weight: 600; }
.pr-note { margin-top: 10px; font-size: 0.75rem; color: var(--g400); text-align: center; }

/* ---------- Included / Excluded (v2.34) ---------- */
.ic-card, .ex-card { margin-top: 18px; border-radius: 12px; overflow: hidden; }
.ic-card { border: 1px solid #d4edda; }
.ex-card { border: 1px solid #f5c6cb; }
.ic-hd, .ex-hd {
  display: flex; align-items: center; gap: 10px; padding: 14px 18px; font-size: 0.95rem; font-weight: 600;
  cursor: pointer; user-select: none; transition: background .2s;
}
.ic-hd { background: #d4edda; color: #155724; }
.ex-hd { background: #f8d7da; color: #721c24; }
.ic-hd:hover { background: #c3e6cb; }
.ex-hd:hover { background: #f1c0c4; }
.ic-hd i.arr, .ex-hd i.arr { margin-left: auto; transition: transform .3s; }
.ic-hd.open i.arr, .ex-hd.open i.arr { transform: rotate(180deg); }
.ic-body, .ex-body { display: none; padding: 14px 18px; background: var(--white); }
.ic-body.open, .ex-body.open { display: block; }
.inc-li, .exc-li {
  display: flex; align-items: flex-start; gap: 10px; padding: 7px 0; font-size: 0.88rem; color: var(--text-light); line-height: 1.5;
}
.inc-li i { color: var(--gn); margin-top: 3px; }
.exc-li i { color: var(--rd); margin-top: 3px; }

/* ---------- Enhanced Quick Inquiry (v2.34) ---------- */
.qi-enhanced .qi-form { grid-template-columns: 1fr 1fr; }
.qi-enhanced .qi-input { font-size: 0.88rem; }
.qi-enhanced .qi-row-full { grid-column: 1 / -1; }
.qi-select, .qi-date {
  padding: 12px 14px; border: 1px solid var(--g200); border-radius: 8px;
  font-size: 0.88rem; font-family: inherit; outline: none; background: var(--white);
  transition: border-color .2s; color: var(--text-dark); width: 100%; box-sizing: border-box;
}
.qi-select:focus, .qi-date:focus { border-color: var(--primary); }
.qi-date::-webkit-calendar-picker-indicator { cursor: pointer; opacity: 0.6; }

/* ---------- Dark mode for v2.34 ---------- */
[data-theme="dark"] .pr-table { border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .pr-row { border-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .pr-row:hover { background: rgba(255,255,255,0.03); }
[data-theme="dark"] .pr-row.best { background: rgba(249,168,37,0.1); border-left-color: var(--accent); }
[data-theme="dark"] .pr-grp { color: #ddd; }
[data-theme="dark"] .pr-price-per { color: #f07050; }
[data-theme="dark"] .pr-note { color: #888; }
[data-theme="dark"] .ic-card { border-color: rgba(39,174,96,0.2); }
[data-theme="dark"] .ex-card { border-color: rgba(231,76,60,0.2); }
[data-theme="dark"] .ic-hd { background: rgba(39,174,96,0.15); color: #5ddb8e; }
[data-theme="dark"] .ex-hd { background: rgba(231,76,60,0.12); color: #f5958a; }
[data-theme="dark"] .ic-hd:hover { background: rgba(39,174,96,0.2); }
[data-theme="dark"] .ex-hd:hover { background: rgba(231,76,60,0.18); }
[data-theme="dark"] .ic-body, [data-theme="dark"] .ex-body { background: var(--g800); }
[data-theme="dark"] .inc-li, [data-theme="dark"] .exc-li { color: #bbb; }
[data-theme="dark"] .qi-select, [data-theme="dark"] .qi-date { background: var(--g800); border-color: rgba(255,255,255,0.1); color: #ddd; }

/* ==== Print: hide toggle, keep timeline simplified ==== */
@media print {
  .tl-toggle { display: none; }
  .tl-wrap { padding-left: 0; }
  .tl-line, .tl-dot { display: none; }
  .tl-card { border: none; box-shadow: none; padding: 8px 0; page-break-inside: avoid; }
  .tl-act-tag { border: 1px solid #ccc; background: #f9f9f9; }
  .tl-meal-badge { background: #ddd !important; color: #333 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* =============================================
   v3.15 �?Reviews & Ratings Widget
   ============================================= */
.rv-card { padding: 28px 24px; }
.rv-card h2 { margin: 0 0 20px 0; }
.rv-card h2 .ic { margin-right: 8px; color: var(--accent); }

/* Rating Summary */
.rv-summary { display: flex; gap: 32px; align-items: center; margin-bottom: 24px; padding: 20px; background: var(--g50); border-radius: 14px; }
.rv-avg-col { text-align: center; min-width: 120px; }
.rv-big-rating { font-size: 3rem; font-weight: 800; color: var(--accent); line-height: 1; }
.rv-stars-sm { margin: 6px 0; }
.rv-stars-sm .rv-star-sm { font-size: 0.85rem; color: var(--accent); margin: 0 1px; }
.rv-total { font-size: 0.82rem; color: var(--g500); margin-top: 4px; }
/* Star Distribution */
.rv-dist-col { flex: 1; display: flex; flex-direction: column; gap: 5px; }
.rv-dist-row { display: flex; align-items: center; gap: 8px; }
.rv-dist-label { font-size: 0.78rem; color: var(--g500); min-width: 40px; text-align: right; white-space: nowrap; }
.rv-dist-bar-wrap { flex: 1; height: 8px; background: var(--g200); border-radius: 4px; overflow: hidden; }
.rv-dist-bar { height: 100%; background: var(--accent); border-radius: 4px; transition: width .6s cubic-bezier(.4,0,.2,1); min-width: 0; }
.rv-dist-count { font-size: 0.78rem; color: var(--g400); min-width: 20px; text-align: left; }

/* Sort Controls */
.rv-sort-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--g150); }
.rv-sort-label { font-size: 0.82rem; color: var(--g500); margin-right: 4px; }
.rv-sort-btn { background: none; border: 1px solid var(--g200); padding: 6px 14px; border-radius: 20px; font-size: 0.8rem; cursor: pointer; color: var(--g600); font-family: inherit; transition: all .2s; }
.rv-sort-btn:hover { border-color: var(--accent); color: var(--accent); }
.rv-sort-btn.active { background: var(--accent); color: #fff; border-color: var(--accent); }

/* Review List */
.rv-list { display: flex; flex-direction: column; gap: 16px; }
.rv-item { display: flex; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--g100); }
.rv-item:last-child { border-bottom: none; }
/* Avatar */
.rv-avatar { width: 44px; height: 44px; min-width: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 1.1rem; }
/* Content */
.rv-content { flex: 1; }
.rv-header { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; flex-wrap: wrap; }
.rv-name { font-weight: 600; font-size: 0.92rem; color: var(--text-dark); }
.rv-verified { font-size: 0.75rem; color: #27ae60; display: inline-flex; align-items: center; gap: 3px; background: rgba(39,174,96,0.08); padding: 2px 8px; border-radius: 10px; }
.rv-date { font-size: 0.78rem; color: var(--g400); margin-left: auto; }
.rv-stars { margin: 4px 0 6px; }
.rv-stars .rv-star { font-size: 0.82rem; color: var(--accent); margin-right: 1px; }
.rv-stars .fa-star-half-alt { color: var(--accent); }
.rv-comment { font-size: 0.9rem; line-height: 1.7; color: var(--g600); }
.rv-helpful { font-size: 0.78rem; color: var(--g400); margin-top: 8px; display: flex; align-items: center; gap: 4px; }

/* Write Review CTA */
.rv-cta { text-align: center; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--g100); }
.rv-cta-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 28px; font-size: 0.92rem; }

/* Stars (reusable component) �?also used by external placeholders */
.fa-star-half-alt { color: var(--accent); }

/* ============ Dark Mode ============ */
[data-theme="dark"] .rv-summary { background: var(--g750); }
[data-theme="dark"] .rv-dist-bar-wrap { background: rgba(255,255,255,0.1); }
[data-theme="dark"] .rv-dist-label, [data-theme="dark"] .rv-dist-count { color: #999; }
[data-theme="dark"] .rv-sort-bar { border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .rv-sort-btn { border-color: rgba(255,255,255,0.15); color: #aaa; }
[data-theme="dark"] .rv-sort-btn:hover { border-color: var(--accent); color: var(--accent); }
[data-theme="dark"] .rv-item { border-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .rv-name { color: #eee; }
[data-theme="dark"] .rv-comment { color: #bbb; }
[data-theme="dark"] .rv-verified { background: rgba(39,174,96,0.12); }
[data-theme="dark"] .rv-cta { border-color: rgba(255,255,255,0.08); }

/* ============ Responsive ============ */
@media (max-width: 640px) {
  .rv-summary { flex-direction: column; gap: 16px; text-align: center; }
  .rv-avg-col { min-width: auto; }
  .rv-dist-col { width: 100%; }
  .rv-dist-label { min-width: 30px; font-size: 0.72rem; }
  .rv-header { gap: 6px; }
  .rv-date { margin-left: 0; }
  .rv-avatar { width: 38px; height: 38px; min-width: 38px; font-size: 0.95rem; }
  .rv-card { padding: 20px 16px; }
}

/* ============ Print ============ */
@media print {
  .rv-cta, .rv-sort-bar { display: none; }
  .rv-item { border-bottom: 1px dotted #ccc; page-break-inside: avoid; }
  .rv-avatar { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .rv-dist-bar { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ============ Booking Modal (v2.37) ============ */
.bk-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.55); z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 16px; }
.bk-box { background: #fff; border-radius: 16px; width: 100%; max-width: 540px; max-height: 90vh; overflow-y: auto; padding: 28px 24px; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: bkFadeIn 0.25s ease; }
@keyframes bkFadeIn { from { opacity: 0; transform: translateY(16px) scale(0.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
.bk-close { position: absolute; top: 12px; right: 16px; background: none; border: none; font-size: 1.5rem; cursor: pointer; color: var(--g400); padding: 4px 8px; border-radius: 50%; font-family: inherit; line-height: 1; }
.bk-close:hover { color: var(--text-light); background: var(--g100); }

/* Step indicators */
.bk-steps { display: flex; align-items: center; justify-content: center; gap: 0; margin-bottom: 24px; }
.bk-step { display: flex; flex-direction: column; align-items: center; gap: 6px; opacity: 0.4; transition: opacity 0.3s; }
.bk-step.active, .bk-step.done { opacity: 1; }
.bk-step-num { width: 34px; height: 34px; border-radius: 50%; background: var(--g100); color: var(--g500); display: flex; align-items: center; justify-content: center; font-size: 0.85rem; font-weight: 700; transition: all 0.3s; }
.bk-step.active .bk-step-num { background: var(--accent); color: #fff; }
.bk-step.done .bk-step-num { background: var(--gn); color: #fff; }
.bk-step-label { font-size: 0.72rem; color: var(--g500); white-space: nowrap; font-weight: 500; }
.bk-step-line { flex: 1; height: 2px; background: var(--g150); margin: 0 8px; margin-bottom: 22px; max-width: 50px; border-radius: 1px; }
.bk-step.active ~ .bk-step-line { background: var(--accent); opacity: 0.3; }

/* Step header */
.bk-step-hd { margin-bottom: 16px; }
.bk-step-hd h3 { font-size: 1.05rem; color: var(--text-dark); margin: 0; }
.bk-step-hd p { margin: 4px 0 0; }

/* Sections */
.bk-sec { margin-bottom: 20px; }

/* Departure list */
.bk-dep-list { display: flex; flex-direction: column; gap: 8px; }
.bk-dep-item { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border: 2px solid var(--g150); border-radius: 10px; cursor: pointer; transition: all 0.2s; }
.bk-dep-item:hover { border-color: var(--accent); background: rgba(212,57,42,0.03); }
.bk-dep-item.active { border-color: var(--accent); background: rgba(212,57,42,0.06); }
.bk-dep-left { display: flex; flex-direction: column; align-items: center; min-width: 48px; }
.bk-dep-day { font-size: 1.4rem; font-weight: 700; color: var(--text-dark); line-height: 1; }
.bk-dep-mon { font-size: 0.72rem; color: var(--g500); text-transform: uppercase; }
.bk-dep-right { text-align: right; }
.bk-dep-price { font-weight: 700; color: var(--accent); font-size: 0.95rem; }
.bk-dep-seats { font-size: 0.75rem; color: var(--g400); margin-top: 2px; }

/* Calendar */
.bk-cal-wrap { display: flex; flex-direction: column; align-items: center; }
.bk-cal { width: 100%; max-width: 340px; padding: 12px; border: 1px solid var(--g150); border-radius: 12px; }
.bk-cal-hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.bk-cal-nav { background: none; border: none; font-size: 1.4rem; cursor: pointer; color: var(--g500); padding: 4px 10px; border-radius: 6px; font-family: inherit; line-height: 1; }
.bk-cal-nav:hover { background: var(--g100); color: var(--text-light); }
.bk-cal-title { font-size: 0.92rem; font-weight: 600; color: var(--text-dark); }
.bk-cal-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.bk-cal-day-hd { text-align: center; font-size: 0.72rem; color: var(--g500); padding: 4px 0; font-weight: 600; }
.bk-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.bk-cal-cell { text-align: center; padding: 8px 2px; font-size: 0.85rem; border-radius: 8px; color: var(--text-dark); transition: all 0.15s; }
.bk-cal-cell:hover:not(.bk-cal-past) { background: var(--accent); color: #fff; }
.bk-cal-cell.bk-cal-past { color: var(--g300); }
.bk-cal-cell.bk-cal-active { background: var(--accent); color: #fff; font-weight: 700; }
.bk-date-inp { padding: 8px 14px; border: 1px solid var(--g150); border-radius: 8px; font-size: 0.9rem; font-family: inherit; }

/* Traveler counters */
.bk-ctr-row { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--g100); }
.bk-ctr-row:last-child { border-bottom: none; }
.bk-ctr-label { font-size: 0.9rem; color: var(--text-dark); font-weight: 500; }
.bk-ctr { display: flex; align-items: center; gap: 10px; }
.bk-ctr-btn { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--g150); background: #fff; font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--text-dark); transition: all 0.15s; font-family: inherit; line-height: 1; }
.bk-ctr-btn:hover { border-color: var(--accent); color: var(--accent); }
.bk-ctr-btn:disabled { opacity: 0.3; cursor: not-allowed; }
.bk-ctr-val { font-size: 1rem; font-weight: 700; min-width: 28px; text-align: center; color: var(--text-dark); }

/* Price summary */
.bk-price-summary { background: var(--g50); border-radius: 12px; padding: 16px; margin-bottom: 16px; }
.bk-price-hd { font-size: 0.85rem; font-weight: 600; color: var(--g500); margin-bottom: 10px; text-transform: uppercase; letter-spacing: 0.5px; }
.bk-price-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; font-size: 0.9rem; color: var(--g500); }
.bk-price-val { font-weight: 600; color: var(--text-dark); }
.bk-price-total { border-top: 1px solid var(--g200); padding-top: 10px; margin-top: 4px; }
.bk-total-label { font-weight: 600; color: var(--text-dark); font-size: 0.95rem; }

/* Form */
.bk-form { display: flex; flex-direction: column; gap: 14px; margin-bottom: 16px; }
.bk-fg { display: flex; flex-direction: column; gap: 4px; }
.bk-fg-label { font-size: 0.82rem; font-weight: 600; color: var(--g500); }
.bk-fg-input { padding: 10px 14px; border: 2px solid var(--g150); border-radius: 10px; font-size: 0.9rem; font-family: inherit; color: var(--text-dark); transition: border-color 0.2s; outline: none; }
.bk-fg-input:focus { border-color: var(--accent); }
.bk-fg-ta { resize: vertical; }

/* Buttons */
.bk-btn-wrap { display: flex; gap: 10px; justify-content: flex-end; margin-top: 8px; }
.bk-back-btn { padding: 10px 20px; border: 2px solid var(--g150); border-radius: 10px; background: #fff; color: var(--g500); cursor: pointer; font-size: 0.9rem; font-family: inherit; transition: all 0.2s; }
.bk-back-btn:hover { border-color: var(--g300); color: var(--text-dark); }
.bk-next-btn { padding: 10px 24px !important; font-size: 0.9rem !important; }
.bk-submit-btn { background: var(--gn) !important; }

/* Review */
.bk-review { margin-bottom: 16px; }
.bk-review-item { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--g100); font-size: 0.9rem; }
.bk-review-item:last-child { border-bottom: none; }
.bk-review-label { color: var(--g500); font-weight: 500; }
.bk-review-val { color: var(--text-dark); text-align: right; max-width: 65%; word-break: break-word; }

/* Price confirm */
.bk-price-confirm { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; background: var(--g50); border-radius: 12px; margin-bottom: 4px; }

/* Success */
.bk-success { text-align: center; padding: 20px 0; }
.bk-success-icon { font-size: 3rem; color: var(--gn); margin-bottom: 4px; }
.bk-booking-no { display: inline-block; font-size: 0.9rem; font-weight: 700; background: #f0f0f0; color: #555; padding: 8px 18px; border-radius: 8px; margin: 12px 0 4px; font-family: monospace; letter-spacing: 0.5px; }

/* ============ Dark mode booking ============ */
[data-theme="dark"] .bk-box { background: var(--g800); border: 1px solid rgba(255,255,255,0.05); }
[data-theme="dark"] .bk-cal { border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .bk-cal-cell { color: #ddd; }
[data-theme="dark"] .bk-cal-cell.bk-cal-past { color: #444; }
[data-theme="dark"] .bk-cal-nav { color: #999; }
[data-theme="dark"] .bk-cal-nav:hover { background: rgba(255,255,255,0.06); color: #eee; }
[data-theme="dark"] .bk-cal-title { color: #eee; }
[data-theme="dark"] .bk-cal-day-hd { color: #888; }
[data-theme="dark"] .bk-cal-wrap .bk-date-inp { background: var(--g750); border-color: rgba(255,255,255,0.1); color: #ddd; }
[data-theme="dark"] .bk-dep-item { border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .bk-dep-item:hover { border-color: var(--accent); background: rgba(212,57,42,0.08); }
[data-theme="dark"] .bk-dep-day { color: #eee; }
[data-theme="dark"] .bk-dep-mon { color: #999; }
[data-theme="dark"] .bk-ctr-btn { background: var(--g750); border-color: rgba(255,255,255,0.12); color: #ddd; }
[data-theme="dark"] .bk-ctr-row { border-color: rgba(255,255,255,0.05); }
[data-theme="dark"] .bk-ctr-label, [data-theme="dark"] .bk-ctr-val { color: #eee; }
[data-theme="dark"] .bk-price-summary { background: var(--g750); }
[data-theme="dark"] .bk-price-val, [data-theme="dark"] .bk-total-label { color: #eee; }
[data-theme="dark"] .bk-price-row { color: #bbb; }
[data-theme="dark"] .bk-price-total { border-color: rgba(255,255,255,0.1); }
[data-theme="dark"] .bk-fg-input { background: var(--g750); border-color: rgba(255,255,255,0.1); color: #ddd; }
[data-theme="dark"] .bk-fg-input:focus { border-color: var(--accent); }
[data-theme="dark"] .bk-fg-label { color: #aaa; }
[data-theme="dark"] .bk-review-item { border-color: rgba(255,255,255,0.05); }
[data-theme="dark"] .bk-review-label { color: #aaa; }
[data-theme="dark"] .bk-review-val { color: #eee; }
[data-theme="dark"] .bk-back-btn { background: var(--g750); border-color: rgba(255,255,255,0.1); color: #bbb; }
[data-theme="dark"] .bk-back-btn:hover { border-color: rgba(255,255,255,0.3); color: #eee; }
[data-theme="dark"] .bk-price-confirm { background: var(--g750); }
[data-theme="dark"] .bk-booking-no { background: var(--g750); color: #ccc; }
[data-theme="dark"] .bk-step-num { background: var(--g750); }
[data-theme="dark"] .bk-step-line { background: rgba(255,255,255,0.1); }

/* ============ Booking Payment UI (v2.38) ============ */
.bk-pay-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.bk-pay-card { border: 2px solid var(--g150); border-radius: 10px; padding: 12px; cursor: pointer; transition: all 0.2s; display: flex; align-items: flex-start; gap: 10px; }
.bk-pay-card:hover { border-color: var(--accent); background: rgba(212,57,42,0.03); }
.bk-pay-card.active { border-color: var(--accent); background: rgba(212,57,42,0.06); box-shadow: 0 0 0 3px rgba(212,57,42,0.1); }
.bk-pay-card-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--g50); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--g500); }
.bk-pay-card.active .bk-pay-card-icon { background: var(--accent); color: #fff; }
.bk-pay-card-title { font-size: 0.85rem; font-weight: 600; color: var(--text-dark); margin-bottom: 2px; }
.bk-pay-card-desc { font-size: 0.72rem; color: var(--g400); }

/* Stripe card form */
.bk-stripe-wrap { margin-bottom: 16px; }
#bk-stripe-card { padding: 14px; border: 2px solid var(--g150); border-radius: 10px; background: #fff; transition: border-color 0.2s; }
#bk-stripe-card.StripeElement--focus { border-color: var(--accent); }
.bk-stripe-err { color: #e74c3c; font-size: 0.82rem; margin: 8px 0; padding: 8px 12px; background: rgba(231,76,60,0.06); border-radius: 8px; }
.bk-stripe-pay-btn { background: #635bff !important; }
.bk-stripe-pay-btn:hover { background: #554de6 !important; }

/* QR code placeholder */
.bk-qr-placeholder { width: 180px; height: 180px; margin: 16px auto; background: var(--g100); border-radius: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.bk-qr-icon { color: var(--g400); }
.bk-qr-label { font-size: 0.78rem; color: var(--g400); font-weight: 600; }

/* Bank transfer info */
.bk-bank-info { text-align: left; background: var(--g50); border-radius: 10px; padding: 14px 16px; font-size: 0.85rem; line-height: 1.8; margin-bottom: 12px; }
.bk-bank-lbl { font-weight: 600; font-size: 0.8rem; color: var(--g500); }
.bk-bank-val { color: var(--text-dark); }

/* Dark mode payment */
[data-theme="dark"] .bk-pay-card { border-color: rgba(255,255,255,0.1); }
[data-theme="dark"] .bk-pay-card:hover { background: rgba(212,57,42,0.08); }
[data-theme="dark"] .bk-pay-card.active { background: rgba(212,57,42,0.1); }
[data-theme="dark"] .bk-pay-card-icon { background: rgba(255,255,255,0.06); color: #aaa; }
[data-theme="dark"] .bk-pay-card-title { color: #eee; }
[data-theme="dark"] .bk-pay-card-desc { color: #888; }
[data-theme="dark"] #bk-stripe-card { background: var(--g750); border-color: rgba(255,255,255,0.1); }
[data-theme="dark"] .bk-stripe-err { background: rgba(231,76,60,0.1); }
[data-theme="dark"] .bk-qr-placeholder { background: var(--g750); }
[data-theme="dark"] .bk-qr-icon { color: #888; }
[data-theme="dark"] .bk-qr-label { color: #888; }
[data-theme="dark"] .bk-bank-info { background: var(--g750); }
[data-theme="dark"] .bk-bank-lbl { color: #aaa; }
[data-theme="dark"] .bk-bank-val { color: #eee; }

/* ============ Responsive ============ */
@media (max-width: 600px) {
  .bk-box { padding: 20px 16px; border-radius: 12px; max-height: 95vh; }
  .bk-step-label { font-size: 0.65rem; }
  .bk-step-num { width: 28px; height: 28px; font-size: 0.75rem; }
  .bk-cal { max-width: 100%; padding: 8px; }
  .bk-cal-cell { padding: 6px 1px; font-size: 0.78rem; }
  .bk-btn-wrap { flex-direction: column-reverse; }
  .bk-back-btn, .bk-next-btn { width: 100%; text-align: center; }
  .bk-pay-grid { grid-template-columns: 1fr; }
}

/* ============ Booking Lookup v2.39 ============ */
.bk-lookup-form {
  background: var(--card-bg, #fff);
  border-radius: 12px;
  padding: 32px;
  box-shadow: 0 2px 16px rgba(0,0,0,.06);
  border: 1px solid var(--border, #e5e7eb);
}
.bk-lookup-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 20px;
}
.bk-lookup-field label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 6px;
  color: var(--text, #374151);
}
.bk-lookup-field input {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid var(--border, #d1d5db);
  border-radius: 8px;
  font-size: 0.95rem;
  background: var(--input-bg, #fff);
  color: var(--text, #111827);
  transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box;
}
.bk-lookup-field input:focus {
  outline: none;
  border-color: var(--primary, #dc2626);
  box-shadow: 0 0 0 3px rgba(220,38,38,.1);
}
.bk-lookup-msg {
  margin-top: 12px;
  font-size: 0.88rem;
  min-height: 20px;
}
.bk-lookup-msg.err {
  color: #ef4444;
  font-weight: 500;
}
/* Result card */
.blr-card {
  background: var(--card-bg, #fff);
  border-radius: 12px;
  box-shadow: 0 2px 20px rgba(0,0,0,.08);
  border: 1px solid var(--border, #e5e7eb);
  overflow: hidden;
}
.blr-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  background: linear-gradient(135deg, var(--primary, #dc2626), #b91c1c);
  color: #fff;
}
.blr-ref span {
  display: block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  opacity: 0.75;
}
.blr-ref strong {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.blr-status {
  padding: 4px 14px;
  border-radius: 20px;
  font-size: 0.78rem;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
}
.badge-yellow { background: #f59e0b; }
.badge-blue   { background: #3b82f6; }
.badge-green  { background: #10b981; }
.badge-purple { background: #6366f1; }
.badge-red    { background: #ef4444; }

.blr-info {
  padding: 20px 24px;
}
.blr-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px solid var(--border, #f3f4f6);
}
.blr-row:last-child { border-bottom: none; }
.blr-label {
  font-size: 0.85rem;
  color: var(--muted, #6b7280);
  flex-shrink: 0;
  margin-right: 16px;
}
.blr-val {
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--text, #111827);
  text-align: right;
}
.blr-val small {
  color: var(--muted, #9ca3af);
  font-weight: 400;
}
.blr-price {
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--primary, #dc2626);
}
/* Progress steps */
.blr-progress {
  display: flex;
  justify-content: space-between;
  padding: 16px 24px;
  border-top: 1px solid var(--border, #f3f4f6);
  background: var(--bg, #f9fafb);
}
.bks {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1;
  position: relative;
}
.bks::after {
  content: '';
  position: absolute;
  top: 8px;
  left: 50%;
  right: -50%;
  height: 2px;
  background: var(--border, #e5e7eb);
  z-index: 0;
}
.bks:last-child::after { display: none; }
.bks-dot {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--border, #d1d5db);
  border: 2px solid var(--bg, #fff);
  position: relative;
  z-index: 1;
  flex-shrink: 0;
}
.bks.done::after { background: var(--primary, #dc2626); }
.bks.done .bks-dot { background: var(--primary, #dc2626); border-color: var(--primary, #dc2626); }
.bks.cur .bks-dot { background: #fff; border-color: var(--primary, #dc2626); border-width: 3px; }
.bks span {
  font-size: 0.68rem;
  color: var(--muted, #9ca3af);
  text-align: center;
  white-space: nowrap;
}
.bks.done span, .bks.cur span { color: var(--text, #374151); font-weight: 600; }

.blr-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  border-top: 1px solid var(--border, #f3f4f6);
}
.blr-date {
  font-size: 0.8rem;
  color: var(--muted, #9ca3af);
}

/* Mobile */
@media (max-width: 600px) {
  .bk-lookup-fields { grid-template-columns: 1fr; }
  .bk-lookup-form { padding: 20px 16px; }
  .blr-header { flex-direction: column; align-items: flex-start; gap: 10px; }
  .blr-progress { padding: 12px 8px; }
  .bks span { font-size: 0.6rem; }
  .blr-row { flex-direction: column; gap: 4px; }
  .blr-val { text-align: left; }
  .blr-footer { flex-direction: column; gap: 12px; align-items: flex-start; }
}

/* Dark mode */
[data-theme="dark"] .bk-lookup-form { background: var(--card-bg); border-color: var(--border); }
[data-theme="dark"] .bk-lookup-field input { background: var(--input-bg); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .blr-card { background: var(--card-bg); border-color: var(--border); }
[data-theme="dark"] .blr-progress { background: var(--bg); }
[data-theme="dark"] .blr-info { background: var(--card-bg); }
[data-theme="dark"] .blr-row { border-color: var(--border); }

/* ============ v2.40 Reviews Page ============ */
.rv-loading { text-align: center; padding: 32px; color: var(--text-light); font-size: .95rem; }

/* Reviews Page Card */
.rv-page-stats { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border); font-size: .9rem; color: var(--text-light); }
.rv-page-avg { font-weight: 700; color: var(--primary); font-size: 1rem; background: rgba(26,95,122,.08); padding: 4px 10px; border-radius: 6px; }

/* Sort bar */
.rv-sort-btn { background: var(--bg-secondary); border: 1px solid var(--border); color: var(--text); padding: 6px 14px; border-radius: 20px; cursor: pointer; font-size: .82rem; margin-right: 6px; transition: all .2s; }
.rv-sort-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.rv-sort-btn:hover:not(.active) { background: var(--primary-light); }

/* Review Card (page list) */
.rv-card-page { display: flex; gap: 16px; padding: 20px; margin-bottom: 12px; background: var(--card-bg); border: 1px solid var(--border); border-radius: 12px; transition: box-shadow .2s; }
.rv-card-page:hover { box-shadow: var(--shadow); }
.rv-avatar-page { width: 48px; height: 48px; min-width: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; font-weight: 700; color: #fff; }
.rv-body-page { flex: 1; }
.rv-hdr-page { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; flex-wrap: wrap; }
.rv-name-page { font-weight: 600; color: var(--text-dark); }
.rv-country { font-size: .8rem; color: var(--text-light); background: var(--bg-secondary); padding: 2px 8px; border-radius: 12px; }
.rv-date-page { font-size: .78rem; color: var(--text-light); margin-left: auto; }
.rv-stars-page { margin-bottom: 6px; }
.rv-tour-ref { font-size: .8rem; color: var(--primary); margin-bottom: 6px; }
.rv-title-page { font-weight: 600; color: var(--text-dark); margin-bottom: 4px; }
.rv-comment-page { color: var(--text); line-height: 1.7; font-size: .92rem; }

/* Pagination */
.rv-pager { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--border); }
.rv-pager-btn { background: var(--bg-secondary); border: 1px solid var(--border); color: var(--text); padding: 8px 18px; border-radius: 6px; cursor: pointer; font-size: .85rem; transition: all .2s; }
.rv-pager-btn:hover:not(:disabled) { background: var(--primary); color: #fff; border-color: var(--primary); }
.rv-pager-btn:disabled { opacity: .4; cursor: not-allowed; }
.rv-pager-info { font-size: .85rem; color: var(--text-light); }

/* Empty / error states */
.rv-page-empty { text-align: center; padding: 48px 20px; color: var(--text-light); font-size: .95rem; }
.rv-page-empty .bt { margin-top: 16px; }

/* ============ v2.40 Write Review Page ============ */
.rv-write-wrap { background: var(--card-bg); border: 1px solid var(--border); border-radius: 12px; padding: 32px; }
.rv-write-group { margin-bottom: 20px; }
.rv-write-label { display: block; font-weight: 600; margin-bottom: 8px; color: var(--text-dark); font-size: .9rem; }
.rv-write-input { width: 100%; padding: 12px 14px; border: 1px solid var(--border); border-radius: 8px; font-size: .92rem; color: var(--text); background: var(--input-bg); transition: border-color .2s; box-sizing: border-box; }
.rv-write-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(26,95,122,.1); }
.rv-write-textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--border); border-radius: 8px; font-size: .92rem; color: var(--text); background: var(--input-bg); resize: vertical; min-height: 120px; font-family: inherit; transition: border-color .2s; box-sizing: border-box; }
.rv-write-textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(26,95,122,.1); }

/* Star selector */
.rv-star-display { display: flex; gap: 4px; }
.rv-write-star { font-size: 2rem; color: #ccc; transition: color .15s, transform .15s; }
.rv-write-star.on { color: #f9a825; }
.rv-write-star:hover { transform: scale(1.2); }

/* Messages */
.rv-write-msg { padding: 10px 14px; border-radius: 8px; font-size: .85rem; margin-bottom: 16px; }
.rv-write-msg.error { background: rgba(200,75,49,.1); color: var(--secondary); border: 1px solid rgba(200,75,49,.3); }

/* Success state */
.rv-write-success { text-align: center; padding: 32px 20px; }
.rv-write-success-icon { font-size: 3rem; color: #2ecc71; margin-bottom: 16px; }
.rv-write-success h3 { font-size: 1.3rem; color: var(--text-dark); margin-bottom: 8px; }
.rv-write-success p { color: var(--text-light); margin-bottom: 20px; }
.rv-write-success .bt { display: inline-flex; margin: 0 auto; }

/* Dark mode for reviews pages */
[data-theme="dark"] .rv-page-stats { border-color: var(--border); }
[data-theme="dark"] .rv-page-avg { background: rgba(26,95,122,.15); }
[data-theme="dark"] .rv-sort-btn { background: var(--bg); border-color: var(--border); }
[data-theme="dark"] .rv-card-page { background: var(--card-bg); border-color: var(--border); }
[data-theme="dark"] .rv-write-wrap { background: var(--card-bg); border-color: var(--border); }
[data-theme="dark"] .rv-write-input { background: var(--input-bg); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .rv-write-textarea { background: var(--input-bg); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .rv-write-star { color: #555; }
[data-theme="dark"] .rv-pager-btn { background: var(--bg); border-color: var(--border); }

/* ============ Print ============ */
@media print {
  .bk-overlay { display: none !important; }
}

/* ============ Account Page (v2.41) ============ */
/* Auth gate */
.ac-auth-card {
  max-width: 420px; margin: 0 auto;
  background: var(--card-bg); border-radius: 12px; padding: 32px;
  box-shadow: 0 2px 12px rgba(0,0,0,.08);
  text-align: center;
}
.ac-auth-card h2 { margin: 0 0 8px; font-size: 1.5rem; color: var(--text); }
.ac-auth-icon { font-size: 3.5rem; color: var(--primary); margin-bottom: 8px; }
.ac-auth-desc { color: var(--text-light); font-size: .9rem; margin-bottom: 24px; }
.ac-auth-form .ac-field { text-align: left; margin-bottom: 16px; }
.ac-auth-form .ac-field label { display: block; font-weight: 600; margin-bottom: 4px; font-size: .85rem; color: var(--text); }
.ac-auth-form .ac-field input {
  width: 100%; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: 6px; font-size: .9rem; box-sizing: border-box;
  background: var(--input-bg); color: var(--text);
}
.ac-auth-form .ac-field input:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 3px rgba(26,95,122,.15); }
.ac-auth-msg { font-size: .85rem; min-height: 20px; margin-bottom: 8px; }
.ac-auth-msg.err { color: var(--secondary); }
.ac-auth-foot { margin-top: 20px; font-size: .88rem; color: var(--text-light); }
.ac-auth-foot a { color: var(--primary); font-weight: 600; text-decoration: none; }
.ac-auth-foot a:hover { text-decoration: underline; }

/* Dashboard */
.ac-dash-header {
  display: flex; align-items: center; gap: 16px; margin-bottom: 24px;
  padding-bottom: 16px; border-bottom: 1px solid var(--border);
}
.ac-avatar {
  width: 48px; height: 48px; border-radius: 50%; background: var(--primary);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem; font-weight: 700; flex-shrink: 0;
}
.ac-dash-info { flex: 1; }
.ac-dash-info h2 { margin: 0 0 2px; font-size: 1.2rem; color: var(--text); }
.ac-dash-email { font-size: .85rem; color: var(--text-light); }
.ac-logout-btn { padding: 6px 16px; font-size: .82rem; flex-shrink: 0; }

/* Tabs */
.ac-tabs { display: flex; gap: 4px; margin-bottom: 24px; border-bottom: 1px solid var(--border); }
.ac-tab {
  padding: 10px 20px; border: none; background: none; cursor: pointer;
  font-size: .9rem; color: var(--text-light); border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s; font-weight: 500;
}
.ac-tab:hover { color: var(--text); }
.ac-tab.active { color: var(--primary); border-bottom-color: var(--primary); }
.ac-tab i { margin-right: 6px; }
.ac-tab-content { min-height: 200px; }

/* Loading / Error / Empty */
.ac-loading { text-align: center; padding: 40px 20px; color: var(--text-light); }
.ac-error { text-align: center; padding: 40px 20px; color: var(--secondary); }
.ac-empty { text-align: center; padding: 40px 20px; }
.ac-empty p { color: var(--text-light); margin: 12px 0 16px; }
.ac-empty a { margin: 0 auto; display: inline-flex; }

/* Profile form */
.ac-profile-form { max-width: 500px; }
.ac-profile-form .ac-field { margin-bottom: 14px; }
.ac-profile-form .ac-field label { display: block; font-weight: 600; margin-bottom: 4px; font-size: .85rem; color: var(--text); }
.ac-profile-form .ac-field input,
.ac-profile-form .ac-field select {
  width: 100%; padding: 9px 12px; border: 1px solid var(--border);
  border-radius: 6px; font-size: .9rem; box-sizing: border-box;
  background: var(--input-bg); color: var(--text);
}
.ac-profile-form .ac-field input:focus,
.ac-profile-form .ac-field select:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 3px rgba(26,95,122,.15); }
.ac-profile-form .ac-field input:disabled { opacity: .6; cursor: not-allowed; }
.ac-btn-row { margin-top: 16px; }
.ac-btn-row .bt { padding: 10px 24px; font-size: .9rem; }
.ac-profile-msg { font-size: .85rem; min-height: 20px; margin-top: 8px; }
.ac-profile-msg.ok { color: #2e7d32; }
.ac-profile-msg.err { color: var(--secondary); }

/* Password change section */
.ac-pw-section { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--border); }
.ac-pw-section h3 { margin: 0 0 16px; font-size: 1.1rem; color: var(--text); }
.ac-pw-form { max-width: 400px; }
.ac-pw-form .ac-field { margin-bottom: 14px; }
.ac-pw-form .ac-field label { display: block; font-weight: 600; margin-bottom: 4px; font-size: .85rem; color: var(--text); }
.ac-pw-form .ac-field input {
  width: 100%; padding: 9px 12px; border: 1px solid var(--border);
  border-radius: 6px; font-size: .9rem; box-sizing: border-box;
  background: var(--input-bg); color: var(--text);
}
.ac-pw-form .ac-field input:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 3px rgba(26,95,122,.15); }
.ac-pw-msg { font-size: .85rem; min-height: 20px; margin-top: 8px; }
.ac-pw-msg.ok { color: #2e7d32; }
.ac-pw-msg.err { color: var(--secondary); }

/* Booking cards */
.ac-booking-list { display: flex; flex-direction: column; gap: 16px; }
.ac-booking-card {
  display: flex; gap: 16px; align-items: flex-start;
  background: var(--card-bg); border-radius: 10px; padding: 16px;
  box-shadow: 0 1px 6px rgba(0,0,0,.06); border-left: 4px solid var(--gray);
}
.ac-booking-card[data-status="confirmed"] { border-left-color: #1976d2; }
.ac-booking-card[data-status="paid"] { border-left-color: #2e7d32; }
.ac-booking-card[data-status="completed"] { border-left-color: #2e7d32; }
.ac-booking-card[data-status="cancelled"] { border-left-color: #c62828; }
.ac-booking-card[data-status="refunded"] { border-left-color: #ef6c00; }
.ac-bk-img { width: 120px; height: 90px; border-radius: 6px; overflow: hidden; flex-shrink: 0; }
.ac-bk-img img { width: 100%; height: 100%; object-fit: cover; }
.ac-bk-info { flex: 1; min-width: 0; }
.ac-bk-title { margin-bottom: 6px; }
.ac-bk-title a { color: var(--primary); font-weight: 600; text-decoration: none; font-size: 1.05rem; }
.ac-bk-title a:hover { text-decoration: underline; }
.ac-bk-ref, .ac-bk-date, .ac-bk-guests, .ac-bk-price { font-size: .85rem; color: var(--text-light); margin: 2px 0; }
.ac-bk-ref strong, .ac-bk-date strong, .ac-bk-guests strong, .ac-bk-price strong { color: var(--text); }
.ac-bk-status {
  padding: 4px 12px; border-radius: 20px; font-size: .78rem; font-weight: 600;
  white-space: nowrap; flex-shrink: 0; background: #e0e0e0; color: #555;
}
.ac-bk-status.badge-confirmed { background: #bbdefb; color: #1565c0; }
.ac-bk-status.badge-paid { background: #c8e6c9; color: #2e7d32; }
.ac-bk-status.badge-completed { background: #c8e6c9; color: #1b5e20; }
.ac-bk-status.badge-cancelled { background: #ffcdd2; color: #b71c1c; }
.ac-bk-status.badge-refunded { background: #ffe0b2; color: #e65100; }

/* Review cards */
.ac-review-list { display: flex; flex-direction: column; gap: 12px; }
.ac-review-card {
  background: var(--card-bg); border-radius: 10px; padding: 16px;
  box-shadow: 0 1px 6px rgba(0,0,0,.06);
}
.ac-review-stars { margin-bottom: 8px; }
.ac-star i { font-size: .85rem; color: #ddd; }
.ac-star.active i { color: var(--accent); }
.ac-review-title { font-weight: 600; color: var(--text); margin-bottom: 4px; }
.ac-review-tour { font-size: .82rem; margin-bottom: 6px; }
.ac-review-tour a { color: var(--primary); text-decoration: none; }
.ac-review-tour a:hover { text-decoration: underline; }
.ac-review-body { font-size: .9rem; color: var(--text-light); line-height: 1.6; margin-bottom: 8px; }
.ac-review-status { font-size: .75rem; padding: 2px 10px; border-radius: 12px; display: inline-block; background: #f0f0f0; color: #888; margin-right: 8px; }
.ac-review-status.ok { background: #c8e6c9; color: #2e7d32; }
.ac-review-date { font-size: .78rem; color: var(--text-light); display: inline-block; }

/* Pager */
.ac-pager { display: flex; gap: 6px; justify-content: center; margin-top: 20px; }
.ac-pager-btn {
  padding: 6px 14px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--card-bg); color: var(--text); cursor: pointer; font-size: .85rem;
}
.ac-pager-btn:hover { background: var(--bg2); }
.ac-pager-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); }

/* Dark mode */
[data-theme="dark"] .ac-auth-card { background: var(--card-bg); }
[data-theme="dark"] .ac-booking-card { background: var(--card-bg); }
[data-theme="dark"] .ac-review-card { background: var(--card-bg); }
[data-theme="dark"] .ac-bk-status { background: #333; color: #ccc; }
[data-theme="dark"] .ac-bk-status.badge-confirmed { background: #1a3a5c; color: #64b5f6; }
[data-theme="dark"] .ac-bk-status.badge-paid { background: #1b3a1b; color: #81c784; }
[data-theme="dark"] .ac-bk-status.badge-completed { background: #1b3a1b; color: #66bb6a; }
[data-theme="dark"] .ac-bk-status.badge-cancelled { background: #4a1a1a; color: #ef9a9a; }
[data-theme="dark"] .ac-review-status { background: #333; color: #aaa; }
[data-theme="dark"] .ac-review-status.ok { background: #1b3a1b; color: #81c784; }
[data-theme="dark"] .ac-pager-btn { background: var(--card-bg); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .ac-pager-btn:hover { background: var(--bg2); }
[data-theme="dark"] .ac-pager-btn.active { background: var(--primary); }

/* Responsive */
@media (max-width: 600px) {
  .ac-booking-card { flex-direction: column; }
  .ac-bk-img { width: 100%; height: 140px; }
  .ac-bk-status { align-self: flex-start; }
  .ac-tabs { overflow-x: auto; }
  .ac-tab { padding: 8px 14px; font-size: .82rem; white-space: nowrap; }
  .ac-dash-header { flex-wrap: wrap; }
}

/* ===== v2.43 - Social Proof Ticker ===== */
.sp-ticker {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding: 12px 16px; margin: 16px 0;
  background: linear-gradient(135deg, #f0f9ff 0%, #e8f5e9 100%);
  border-radius: 12px; border: 1px solid #c8e6c9;
  font-size: .88rem; color: #2e7d32;
}
.sp-ticker-item {
  display: flex; align-items: center; gap: 6px;
  font-weight: 500;
}
.sp-ticker-item i { color: var(--secondary); font-size: 1rem; }
.sp-ticker-num {
  font-weight: 700; color: var(--primary);
  min-width: 28px; text-align: center;
}
[data-theme="dark"] .sp-ticker {
  background: linear-gradient(135deg, #0d2137 0%, #0d3320 100%);
  border-color: #1b4332; color: #81c784;
}
[data-theme="dark"] .sp-ticker-item i { color: #4db6ac; }
[data-theme="dark"] .sp-ticker-num { color: #64b5f6; }

/* ===== v2.43 - Cookie Preferences Modal ===== */
.cc-settings {
  background: transparent; color: var(--text-light); border: 1px solid var(--border);
  padding: 8px 16px; border-radius: 6px; cursor: pointer; font-size: .85rem;
  transition: all .2s; white-space: nowrap;
}
.cc-settings:hover { background: var(--bg2); color: var(--text); }
.cp-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  animation: cpFadeIn .25s ease;
}
@keyframes cpFadeIn { from { opacity: 0; } to { opacity: 1; } }
.cp-modal {
  background: var(--card-bg); border-radius: 16px; width: 90%; max-width: 500px;
  max-height: 85vh; overflow-y: auto; box-shadow: 0 16px 48px rgba(0,0,0,.25);
  animation: cpSlideUp .3s ease;
}
@keyframes cpSlideUp { from { transform: translateY(30px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.cp-header { padding: 24px 24px 16px; border-bottom: 1px solid var(--border); }
.cp-header h3 { margin: 0 0 6px; font-size: 1.2rem; color: var(--text); }
.cp-header p { margin: 0; font-size: .88rem; color: var(--text-light); }
.cp-body { padding: 8px 24px; }
.cp-row {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px 0; border-bottom: 1px solid var(--border);
}
.cp-row:last-child { border-bottom: none; }
.cp-row-info { flex: 1; min-width: 0; }
.cp-row-info strong { display: block; font-size: .92rem; margin-bottom: 3px; color: var(--text); }
.cp-row-info span { font-size: .82rem; color: var(--text-light); line-height: 1.4; }
/* Toggle switch */
.cp-toggle { position: relative; display: inline-block; width: 46px; height: 26px; flex-shrink: 0; }
.cp-toggle input { opacity: 0; width: 0; height: 0; }
.cp-slider {
  position: absolute; inset: 0; background: #ccc; border-radius: 26px;
  cursor: pointer; transition: background .3s;
}
.cp-slider::before {
  content: ''; position: absolute; left: 3px; bottom: 3px;
  width: 20px; height: 20px; background: #fff; border-radius: 50%;
  transition: transform .3s;
}
.cp-toggle input:checked + .cp-slider { background: var(--primary); }
.cp-toggle input:checked + .cp-slider::before { transform: translateX(20px); }
.cp-toggle.disabled .cp-slider { background: #bbb; cursor: not-allowed; opacity: .6; }
.cp-toggle.disabled .cp-slider::before { background: #e0e0e0; }
.cp-footer {
  padding: 16px 24px 24px; display: flex; gap: 10px; justify-content: flex-end;
  border-top: 1px solid var(--border);
}
.cp-save {
  padding: 10px 24px; border-radius: 8px; border: 1px solid var(--primary);
  background: transparent; color: var(--primary); cursor: pointer;
  font-size: .9rem; font-weight: 600; transition: all .2s;
}
.cp-save:hover { background: var(--primary); color: #fff; }
.cp-accept-all {
  padding: 10px 24px; border-radius: 8px; border: none;
  background: var(--primary); color: #fff; cursor: pointer;
  font-size: .9rem; font-weight: 600; transition: opacity .2s;
}
.cp-accept-all:hover { opacity: .9; }
[data-theme="dark"] .cp-slider { background: #555; }
[data-theme="dark"] .cp-toggle.disabled .cp-slider { background: #444; }
[data-theme="dark"] .cp-toggle.disabled .cp-slider::before { background: #666; }

/* ===== v2.43 - Floating Newsletter CTA ===== */
.nw-float {
  position: fixed; bottom: -400px; right: 24px; z-index: 9998;
  background: var(--card-bg); border-radius: 16px; box-shadow: 0 8px 32px rgba(0,0,0,.18);
  width: 340px; padding: 0; overflow: hidden;
  transition: bottom .4s cubic-bezier(.4,0,.2,1);
  border: 1px solid var(--border);
}
.nw-float.on { bottom: 24px; }
.nw-float-close {
  position: absolute; top: 8px; right: 10px; z-index: 2;
  background: none; border: none; font-size: 1.3rem; color: var(--text-light);
  cursor: pointer; line-height: 1; padding: 4px;
}
.nw-float-close:hover { color: var(--text); }
.nw-float-icon {
  background: linear-gradient(135deg, var(--primary), var(--secondary));
  padding: 18px; text-align: center;
}
.nw-float-icon i { font-size: 1.6rem; color: #fff; }
.nw-float-body { padding: 16px 20px 20px; }
.nw-float-body strong { display: block; font-size: 1rem; margin-bottom: 4px; color: var(--text); }
.nw-float-body > span { display: block; font-size: .82rem; color: var(--text-light); margin-bottom: 12px; line-height: 1.4; }
.nw-float-form { display: flex; gap: 8px; }
.nw-float-form input {
  flex: 1; padding: 10px 14px; border: 1px solid var(--border); border-radius: 8px;
  font-size: .88rem; background: var(--bg); color: var(--text); outline: none;
  min-width: 0;
}
.nw-float-form input:focus { border-color: var(--primary); }
.nw-float-form button {
  padding: 10px 18px; border: none; border-radius: 8px;
  background: var(--primary); color: #fff; font-weight: 600; cursor: pointer;
  font-size: .88rem; white-space: nowrap; transition: opacity .2s;
}
.nw-float-form button:hover { opacity: .9; }
.nw-float-msg { display: block; margin-top: 8px; font-size: .8rem; color: var(--gn); min-height: 18px; }
.nw-float-msg.error { color: var(--rd); }
@media (max-width: 500px) {
  .nw-float { right: 8px; width: calc(100vw - 16px); max-width: 340px; }
  .nw-float.on { bottom: 12px; }
}

/* ===== v2.44 - Gallery Image Strip ===== */
.gl-strip { margin: 0; background: var(--g50); border-bottom: 1px solid var(--g100); }
.gl-scroll {
  display: flex; gap: 8px; overflow-x: auto; padding: 12px 16px;
  -webkit-overflow-scrolling: touch; scrollbar-width: thin; scroll-behavior: smooth;
}
.gl-scroll::-webkit-scrollbar { height: 4px; }
.gl-scroll::-webkit-scrollbar-thumb { background: var(--g300); border-radius: 4px; }
.gl-img {
  flex-shrink: 0; width: 200px; height: 140px; object-fit: cover; border-radius: 8px;
  background: var(--g200); transition: transform .2s, box-shadow .2s;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.gl-img:hover { transform: scale(1.03); box-shadow: 0 4px 16px rgba(0,0,0,.15); }
[data-theme="dark"] .gl-strip { background: var(--g900); border-color: var(--g700); }
[data-theme="dark"] .gl-img { background: var(--g800); }

/* ===== v2.44 - Quick Facts "At a Glance" ===== */
.qf-wrap {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 0;
  background: var(--white); border-bottom: 1px solid var(--g100);
}
.qf-item {
  padding: 14px 10px; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  border-right: 1px solid var(--g50);
}
.qf-item:last-child { border-right: none; }
.qf-icon { font-size: 1.15rem; color: var(--secondary); }
.qf-label { font-size: .7rem; text-transform: uppercase; letter-spacing: .5px; color: var(--g400); font-weight: 500; }
.qf-value { font-size: .85rem; font-weight: 600; color: var(--text-dark); }
[data-theme="dark"] .qf-wrap { background: var(--g850); border-color: var(--g700); }
[data-theme="dark"] .qf-item { border-right-color: var(--g750); }
[data-theme="dark"] .qf-icon { color: var(--a300); }
[data-theme="dark"] .qf-value { color: var(--g100); }
@media (max-width: 768px) {
  .qf-wrap { grid-template-columns: repeat(3, 1fr); }
  .qf-item:nth-child(3n) { border-right: none; }
  .qf-item { border-bottom: 1px solid var(--g50); padding: 12px 8px; }
}
@media (max-width: 480px) {
  .qf-wrap { grid-template-columns: repeat(3, 1fr); }
  .gl-img { width: 160px; height: 110px; }
}

/* ============= Hero Carousel (v3.19) ============= */
.hc-wrap {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;
  overflow: hidden;
}
.hc-inner { width: 100%; height: 100%; position: relative; }
.hc-slide {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  background-size: cover; background-position: center;
  opacity: 0; transition: opacity 1.2s ease-in-out;
}
.hc-slide.on { opacity: 1; }
/* Overlay for text readability */
.hc-wrap::after {
  content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  background: linear-gradient(180deg, rgba(13,59,78,.55) 0%, rgba(26,95,122,.4) 50%, rgba(0,0,0,.6) 100%);
  z-index: 2; pointer-events: none;
}
[data-theme="dark"] .hc-wrap::after {
  background: linear-gradient(180deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,.5) 50%, rgba(0,0,0,.8) 100%);
}
/* Caption on slides */
.hc-caption {
  position: absolute; bottom: 120px; left: 50%; transform: translateX(-50%);
  text-align: center; color: var(--white); z-index: 3; width: 90%; max-width: 700px;
  text-shadow: 1px 2px 6px rgba(0,0,0,.5);
}
.hc-cap-title { font-size: 1.6rem; font-weight: 700; margin: 0 0 4px; letter-spacing: .5px; }
.hc-cap-sub { font-size: .95rem; font-weight: 400; opacity: .9; margin: 0; }
/* Navigation arrows */
.hc-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 4;
  width: 46px; height: 46px; border-radius: 50%; border: 2px solid rgba(255,255,255,.6);
  background: rgba(0,0,0,.25); color: var(--white); font-size: 1rem;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .3s, border-color .3s; backdrop-filter: blur(4px);
}
.hc-arrow:hover { background: rgba(0,0,0,.5); border-color: rgba(255,255,255,.9); }
.hc-prev { left: 20px; }
.hc-next { right: 20px; }
/* Dot indicators */
.hc-dots {
  position: absolute; bottom: 100px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 10px; z-index: 4;
}
.hc-dot {
  width: 10px; height: 10px; border-radius: 50%; border: 2px solid rgba(255,255,255,.7);
  background: transparent; cursor: pointer; padding: 0; transition: background .3s, transform .3s;
}
.hc-dot:hover { background: rgba(255,255,255,.4); transform: scale(1.2); }
.hc-dot.on { background: var(--white); border-color: var(--white); transform: scale(1.15); }
/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  .hc-slide { transition: none; }
  .hc-dot { transition: none; }
}

/* ── Difficulty Badge on Cards (v2.46) ── */
.tc-diff { transition: opacity .2s; }
.tc:hover .tc-diff { opacity: .95; }

/* ── Pickup Point (v2.46) ── */
.pu-content { display: flex; gap: 20px; align-items: flex-start; padding: 16px 20px; background: var(--g50); border-radius: 12px; margin: 12px 0 0; }
.pu-icon-wrap { flex-shrink: 0; width: 48px; height: 48px; border-radius: 12px; background: var(--primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; }
.pu-text { flex: 1; font-size: .95rem; color: var(--g700); line-height: 1.5; padding-top: 4px; }
.pu-note { margin-top: 12px; font-size: .82rem; color: var(--g500); display: flex; align-items: flex-start; gap: 6px; }
.pu-note i { color: var(--primary); margin-top: 2px; }

/* ── Before You Go (v2.46) ── */
.byg-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 4px; }
.byg-item { padding: 20px; border: 1px solid var(--g100); border-radius: 12px; transition: box-shadow .25s, transform .2s; }
.byg-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,.06); transform: translateY(-2px); }
.byg-icon { width: 44px; height: 44px; border-radius: 10px; background: var(--gn-lt); color: var(--gn); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; margin-bottom: 12px; }
.byg-title { font-size: .92rem; font-weight: 700; color: var(--text-dark); margin-bottom: 6px; }
.byg-text { font-size: .82rem; color: var(--g600); line-height: 1.55; margin: 0; }

/* ── Map Toggle Active (v2.46) ── */
.map-toggle-btn.active { background: var(--secondary) !important; color: #fff !important; }

/* ── v2.46 Dark Mode ── */
[data-theme="dark"] .pu-content { background: rgba(255,255,255,.04); }
[data-theme="dark"] .pu-text { color: #c0c8d0; }
[data-theme="dark"] .byg-item { border-color: rgba(255,255,255,.08); background: rgba(255,255,255,.02); }
[data-theme="dark"] .byg-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,.3); }
[data-theme="dark"] .byg-icon { background: rgba(74,194,154,.12); }
[data-theme="dark"] .byg-title { color: #e8ecf0; }
[data-theme="dark"] .byg-text { color: #88929e; }

/* Responsive */
@media (max-width: 1024px) {
  .hc-arrow { width: 40px; height: 40px; font-size: .9rem; }
  .hc-prev { left: 12px; } .hc-next { right: 12px; }
  .hc-cap-title { font-size: 1.4rem; }
  .hc-cap-sub { font-size: .85rem; }
}
@media (max-width: 768px) {
  .hc-caption { bottom: 110px; }
  .hc-cap-title { font-size: 1.1rem; }
  .hc-cap-sub { font-size: .78rem; }
  .hc-dots { bottom: 95px; gap: 8px; }
  .hc-dot { width: 8px; height: 8px; }
  .hc-arrow { width: 36px; height: 36px; font-size: .8rem; }
  .hc-prev { left: 8px; } .hc-next { right: 8px; }
}
@media (max-width: 480px) {
  .hc-caption { bottom: 105px; }
  .hc-cap-title { font-size: 1rem; }
  .hc-cap-sub { font-size: .72rem; max-width: 280px; margin: 0 auto; }
  .hc-dots { bottom: 90px; }
  .hc-arrow { display: none; }
}

/* ── v3.21 Active Filter Tags + Difficulty Pills + Instant Confirmation ── */

/* Difficulty filter pills */
.df-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.dp {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 14px; border: 2px solid #ddd; border-radius: 50px;
  font-size: .82rem; font-family: inherit; font-weight: 600;
  background: var(--white); color: var(--text-dark); cursor: pointer;
  transition: all .2s; white-space: nowrap;
}
.dp:hover:not(.ac) { border-color: var(--secondary); color: var(--secondary); }
.dp.ac { background: var(--secondary); color: #fff; border-color: var(--secondary); }

/* Instant confirmation toggle */
.ic-toggle {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 16px; border: 2px solid #28a745; border-radius: 50px;
  font-size: .82rem; font-family: inherit; font-weight: 600;
  background: var(--white); color: #28a745; cursor: pointer;
  transition: all .2s; white-space: nowrap;
}
.ic-toggle:hover:not(.ac) { background: #e8f5e9; }
.ic-toggle.ac { background: #28a745; color: #fff; }

/* Active filter bar */
.af-bar { margin-top: 8px; }
.af-badges { display: flex; gap: 8px; flex-wrap: wrap; }
.af-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 10px; background: var(--primary); color: #fff;
  border-radius: 20px; font-size: .78rem; font-weight: 500;
  white-space: nowrap; cursor: default;
}
.af-badge-x {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border: none; border-radius: 50%;
  background: rgba(255,255,255,0.3); color: #fff; font-size: .85rem;
  font-weight: 700; cursor: pointer; padding: 0; line-height: 1;
  transition: background .2s;
}
.af-badge-x:hover { background: rgba(255,255,255,0.5); }

.af-clear {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 14px; border: 1px solid #e74c3c; border-radius: 20px;
  font-size: .78rem; font-family: inherit; font-weight: 600;
  background: transparent; color: #e74c3c; cursor: pointer;
  transition: all .2s;
}
.af-clear:hover { background: #e74c3c; color: #fff; }

/* Instant confirmation badge on tour cards */
.ic-badge {
  position: absolute; top: 72px; left: 12px;
  background: #28a745; color: #fff; padding: 2px 8px;
  border-radius: 10px; font-size: .65rem; font-weight: 700;
  z-index: 2; display: inline-flex; align-items: center; gap: 4px;
  text-transform: uppercase; letter-spacing: .3px;
}

@media (max-width: 768px) {
  .df-pills { gap: 4px; }
  .dp { padding: 5px 10px; font-size: .75rem; }
  .ic-toggle { padding: 5px 12px; font-size: .75rem; }
  .af-badges { gap: 6px; }
  .af-badge { padding: 4px 8px; font-size: .72rem; }
}

@media (max-width: 480px) {
  .dp { padding: 4px 8px; font-size: .7rem; }
  .ic-toggle { padding: 4px 10px; font-size: .7rem; }
}

/* ========== v2.48 Guide Profile Section ========== */
.guide-card { margin-top: 0; }
.guide-body { display: flex; gap: 20px; align-items: flex-start; }
.guide-photo { position: relative; flex-shrink: 0; }
.guide-photo img {
  width: 80px; height: 80px; border-radius: 50%; object-fit: cover;
  border: 3px solid var(--primary); box-shadow: 0 4px 12px rgba(0,0,0,.1);
}
.guide-verified {
  position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%);
  background: #28a745; color: #fff; padding: 2px 10px; border-radius: 10px;
  font-size: .65rem; font-weight: 600; white-space: nowrap;
}
.guide-info { flex: 1; min-width: 0; }
.guide-name { font-size: 1.15rem; font-weight: 700; margin: 0 0 8px 0; color: var(--text-dark); }
.guide-badges { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.guide-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: 12px; font-size: .75rem; font-weight: 500;
}
.gb-lang { background: #e3f2fd; color: #1565c0; }
.gb-exp { background: #fff3e0; color: #e65100; }
.gb-rate { background: #fce4ec; color: #c62828; }
.guide-msg {
  font-size: .88rem; color: var(--g500); line-height: 1.65; margin: 0 0 10px 0;
  font-style: italic; border-left: 3px solid var(--primary);
  padding-left: 12px;
}
.guide-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.guide-tag {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 4px 10px; border-radius: 15px; font-size: .73rem; font-weight: 500;
  background: var(--g50); color: var(--text-light);
  border: 1px solid var(--g100); transition: all .2s;
}
.guide-tag:hover { background: var(--primary); color: #fff; border-color: var(--primary); }

/* ========== v2.48 Seasonal Weather Sidebar ========== */
.weather-card {
  background: var(--white); border: 1px solid var(--g100); border-radius: 12px;
  padding: 16px; margin-top: 16px;
}
.weather-hd {
  font-size: .88rem; font-weight: 700; color: var(--text-dark);
  margin-bottom: 12px; display: flex; align-items: center; gap: 6px;
}
.weather-hd i { color: #f39c12; font-size: 1rem; }
.weather-table { display: flex; flex-direction: column; gap: 2px; }
.weather-row {
  display: grid; grid-template-columns: 36px 24px 1fr 42px;
  align-items: center; gap: 6px; padding: 5px 6px; border-radius: 6px;
  font-size: .73rem;
}
.weather-row.best { background: #e8f5e9; color: #2e7d32; font-weight: 600; }
.weather-m { font-weight: 600; }
.weather-ico { text-align: center; font-size: .78rem; }
.weather-ico .fa-snowflake { color: #90caf9; }
.weather-ico .fa-sun { color: #f39c12; }
.weather-ico .fa-wind { color: #78909c; }
.weather-ico .fa-temperature-high { color: #e74c3c; }
.weather-ico .fa-cloud { color: #b0bec5; }
.weather-temp { font-size: .7rem; white-space: nowrap; }
.weather-rain { text-align: right; font-size: .7rem; }
.weather-note { font-size: .7rem; color: var(--g400); margin: 10px 0 0 0; line-height: 1.4; }

/* ========== v2.48 Quality Trust Badges Sidebar ========== */
.qt-card {
  background: var(--white); border: 1px solid var(--g100); border-radius: 12px;
  padding: 14px 16px; margin-top: 16px;
}
.qt-row {
  display: flex; align-items: center; gap: 10px; padding: 10px 0;
  border-bottom: 1px solid var(--g50);
}
.qt-row:last-child { border-bottom: none; }
.qt-icon {
  width: 36px; height: 36px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: var(--g50); color: var(--primary); font-size: .88rem;
  flex-shrink: 0; transition: all .25s;
}
.qt-row:hover .qt-icon { background: var(--primary); color: #fff; }
.qt-info { flex: 1; min-width: 0; }
.qt-title { display: block; font-size: .8rem; font-weight: 600; color: var(--text-dark); }
.qt-desc { display: block; font-size: .72rem; color: var(--g400); margin-top: 1px; }

/* ----- Dark mode overrides ----- */
[data-theme="dark"] .gb-lang { background: rgba(21,101,192,.2); color: #64b5f6; }
[data-theme="dark"] .gb-exp { background: rgba(230,81,0,.2); color: #ffab40; }
[data-theme="dark"] .gb-rate { background: rgba(198,40,40,.2); color: #ef9a9a; }
[data-theme="dark"] .guide-tag { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.1); }
[data-theme="dark"] .guide-tag:hover { background: var(--primary); border-color: var(--primary); }
[data-theme="dark"] .weather-card,
[data-theme="dark"] .qt-card { background: var(--white); }
[data-theme="dark"] .weather-row.best { background: rgba(46,125,50,.15); }
[data-theme="dark"] .qt-icon { background: rgba(255,255,255,.08); }

/* ----- Responsive: Guide Profile ----- */
@media (max-width: 768px) {
  .guide-body { flex-direction: column; align-items: flex-start; }
  .guide-photo img { width: 64px; height: 64px; }
  .guide-name { font-size: 1.05rem; }
  .guide-badges { gap: 6px; }
  .guide-badge { padding: 2px 8px; font-size: .7rem; }
  .guide-msg { font-size: .82rem; }
  .guide-tag { font-size: .68rem; padding: 3px 8px; }
  .weather-row { font-size: .7rem; grid-template-columns: 32px 22px 1fr 38px; }
  .qt-card { padding: 12px; }
}

@media (max-width: 480px) {
  .guide-body { gap: 12px; }
  .guide-photo img { width: 52px; height: 52px; }
  .guide-badges { flex-direction: column; gap: 4px; }
  .guide-msg { font-size: .78rem; padding-left: 8px; }
  .guide-tags { gap: 4px; }
  .guide-tag { font-size: .65rem; padding: 2px 7px; }
  .weather-row { grid-template-columns: 28px 20px 1fr 34px; font-size: .68rem; }
}

/* ============= v3.23 �?Smart Tour Badges ============= */

/* Tour badge on card image (stacked top-left, below difficulty) */
.tb {
  position: absolute; left: 12px; z-index: 2;
  padding: 2px 9px; border-radius: 10px; font-size: .66rem; font-weight: 700;
  letter-spacing: .3px; text-transform: uppercase; white-space: nowrap;
  animation: tb-in .35s cubic-bezier(.34,1.56,.64,1);
  display: flex; align-items: center; gap: 4px;
}
.tb:nth-of-type(1) { top: 68px; }
.tb:nth-of-type(2) { top: 92px; }

/* Badge color variants */
.tb-top-rated { background: linear-gradient(135deg, #f59e0b, #d97706); color: #fff; }
.tb-best-seller { background: linear-gradient(135deg, #f97316, #ea580c); color: #fff; }
.tb-popular { background: linear-gradient(135deg, #8b5cf6, #7c3aed); color: #fff; }
.tb-new { background: linear-gradient(135deg, #10b981, #059669); color: #fff; }

/* Hero tour badges (inline, next to category/difficulty) */
.tbh {
  display: inline-block; vertical-align: top; margin-left: 8px;
  padding: 4px 14px; border-radius: 20px; font-size: .8rem; font-weight: 600;
}
.tbh-top-rated { background: linear-gradient(135deg, #f59e0b, #d97706); color: #fff; }
.tbh-best-seller { background: linear-gradient(135deg, #f97316, #ea580c); color: #fff; }
.tbh-popular { background: linear-gradient(135deg, #8b5cf6, #7c3aed); color: #fff; }
.tbh-new { background: linear-gradient(135deg, #10b981, #059669); color: #fff; }

/* Badge animation */
@keyframes tb-in {
  from { opacity: 0; transform: scale(.7) translateY(-4px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

/* ============= v3.23 �?Recently Viewed Sidebar ============= */

.rs-card {
  margin-top: 16px; padding: 14px 16px;
  border: 1px solid var(--g200); border-radius: 12px;
  background: var(--white);
}
.rs-hd {
  font-size: .8rem; font-weight: 700; color: var(--text-dark);
  margin-bottom: 12px; display: flex; align-items: center; gap: 6px;
}
.rs-hd i { color: var(--primary); font-size: .82rem; }
.rs-item {
  display: flex; gap: 10px; align-items: center; padding: 8px 0;
  border-bottom: 1px solid var(--g100); text-decoration: none;
  transition: all .2s; cursor: pointer;
}
.rs-item:last-child { border-bottom: none; }
.rs-item:hover { background: var(--g50); margin: 0 -8px; padding-left: 8px; padding-right: 8px; border-radius: 8px; }
.rs-thumb {
  flex-shrink: 0; width: 64px; height: 48px; border-radius: 6px;
  overflow: hidden; background: var(--g100);
}
.rs-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rs-info { flex: 1; min-width: 0; }
.rs-title {
  display: block; font-size: .78rem; font-weight: 600; color: var(--text-dark);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rs-price { display: block; font-size: .72rem; color: var(--secondary); font-weight: 600; margin-top: 2px; }

/* ============= v3.23 �?Enhanced Mobile CTA ============= */

#mob-cta {
  transform: translateY(100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
}
#mob-cta.on-detail { transform: translateY(0); }
#mob-cta .mp { font-size: 1.25rem; }
#mob-cta .bt { border-radius: 8px; transition: all .2s; }
#mob-cta .bt:hover { transform: scale(1.02); }

/* Spacer for content below sticky bar */
@media (max-width: 900px) {
  #mob-cta.on-detail + * { margin-bottom: 0; }
  body.has-mob-cta { padding-bottom: 80px; }
}

/* Dark mode overrides */
[data-theme="dark"] .rs-card { background: #1a2233; border-color: #2a3344; }
[data-theme="dark"] .rs-item { border-color: #2a3344; }
[data-theme="dark"] .rs-item:hover { background: #1e2838; }
[data-theme="dark"] .rs-title { color: #e2e8f0; }
[data-theme="dark"] .rs-hd { color: #e2e8f0; }

/* Responsive */
@media (max-width: 768px) {
  .tb:nth-of-type(1) { top: 64px; }
  .tb:nth-of-type(2) { top: 88px; }
  .tb { font-size: .62rem; padding: 2px 7px; }
  .rs-card { margin-top: 12px; padding: 12px; }
  .rs-thumb { width: 52px; height: 40px; }
}

@media (max-width: 480px) {
  .tb:nth-of-type(1) { top: 60px; left: 8px; }
  .tb:nth-of-type(2) { top: 82px; left: 8px; }
  .tbh { font-size: .7rem; padding: 3px 10px; margin-left: 4px; }
  .rs-item { gap: 8px; }
  .rs-title { font-size: .72rem; }
}

/* ========== Practical Tips Accordion (v2.50) ========== */
.tips-card { background: var(--card-bg, #fff); border-radius: 12px; padding: 28px 32px; box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.06)); margin-bottom: 20px; }
.tips-item { border-bottom: 1px solid var(--border-light, #e8ecf1); }
.tips-item:last-child { border-bottom: none; }
.tips-toggle { list-style: none; display: flex; align-items: center; gap: 10px; padding: 16px 4px; cursor: pointer; font-size: .95rem; font-weight: 600; color: var(--text-dark, #1a202c); user-select: none; transition: color .2s; }
.tips-toggle::-webkit-details-marker { display: none; }
.tips-toggle::marker { display: none; content: ''; }
.tips-toggle:hover { color: var(--primary, #c8a96e); }
.tips-ico { width: 28px; height: 28px; border-radius: 8px; background: var(--primary-light, #f5efe0); color: var(--primary, #c8a96e); display: flex; align-items: center; justify-content: center; font-size: .85rem; flex-shrink: 0; transition: background .2s, color .2s; }
.tips-toggle:hover .tips-ico { background: var(--primary, #c8a96e); color: #fff; }
.tips-arrow { margin-left: auto; font-size: .75rem; color: var(--text-light, #718096); transition: transform .25s; }
.tips-item[open] .tips-arrow { transform: rotate(180deg); }
.tips-body { padding: 0 4px 16px 42px; font-size: .9rem; line-height: 1.7; color: var(--text-muted, #4a5568); }
.tips-body p { margin: 0; }

/* Dark mode */
[data-theme="dark"] .tips-card { background: #1a2233; box-shadow: 0 1px 3px rgba(0,0,0,.15); }
[data-theme="dark"] .tips-item { border-color: #2a3344; }
[data-theme="dark"] .tips-toggle { color: #e2e8f0; }
[data-theme="dark"] .tips-toggle:hover { color: var(--primary, #c8a96e); }
[data-theme="dark"] .tips-body { color: #a0aec0; }

/* Responsive */
@media (max-width: 768px) {
  .tips-card { padding: 20px 18px; }
  .tips-toggle { font-size: .88rem; padding: 14px 2px; }
  .tips-body { font-size: .84rem; padding-left: 36px; }
}
@media (max-width: 480px) {
  .tips-card { padding: 16px 12px; border-radius: 10px; }
  .tips-toggle { font-size: .84rem; gap: 8px; padding: 12px 2px; }
  .tips-ico { width: 24px; height: 24px; font-size: .75rem; }
  .tips-body { font-size: .8rem; padding-left: 30px; }
}

/* ========== Reading Progress Bar (v2.51) ========== */
#rp-bar {
  position: fixed; top: 0; left: 0; width: 100%; height: 3px;
  z-index: 9999; background: transparent; pointer-events: none;
}
.rp-fill {
  height: 100%; width: 0;
  background: linear-gradient(90deg, var(--primary), var(--secondary), var(--accent));
  border-radius: 0 2px 2px 0;
  transition: width .15s ease-out;
}

/* ========== Nav Scroll Shadow (v2.51) ========== */
.hd.scrolled { box-shadow: 0 4px 20px rgba(0,0,0,.15); }
[data-theme="dark"] .hd.scrolled { box-shadow: 0 4px 24px rgba(0,0,0,.5); }

/* ========== Wishlist Detail Button (v2.52) ========== */
.wl-btn-detail {
  width: 100%; background: none; border: 2px solid var(--border, #e2e8f0);
  padding: 10px 24px; border-radius: 50px; font-size: .85rem; cursor: pointer;
  font-family: inherit; color: var(--text-light, #64748b); transition: all .3s;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.wl-btn-detail:hover { border-color: #e74c3c; color: #e74c3c; transform: translateY(-1px); }
.wl-btn-detail.on { border-color: #e74c3c; color: #e74c3c; background: #fdf2f2; }
[data-theme="dark"] .wl-btn-detail { border-color: var(--g600); color: #94a3b8; }
[data-theme="dark"] .wl-btn-detail:hover { border-color: #e74c3c; color: #e74c3c; }
[data-theme="dark"] .wl-btn-detail.on { background: rgba(231,76,60,.12); }

/* ========== Share Button & Modal (v2.52) ========== */
.sh-btn {
  width: 100%; background: var(--g50, #f8fafc); border: 2px solid var(--border, #e2e8f0);
  padding: 10px 24px; border-radius: 50px; font-size: .85rem; cursor: pointer;
  font-family: inherit; color: var(--text-light, #64748b); transition: all .3s;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.sh-btn:hover { border-color: var(--primary); color: var(--primary); transform: translateY(-1px); }
[data-theme="dark"] .sh-btn { background: var(--g800); border-color: var(--g600); color: #94a3b8; }
[data-theme="dark"] .sh-btn:hover { border-color: var(--primary); color: var(--primary); }
.sh-overlay {
  display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5);
  z-index: 10001; align-items: center; justify-content: center;
}
.sh-overlay.open { display: flex; }
.sh-modal {
  background: var(--white, #fff); border-radius: 16px; padding: 32px;
  max-width: 420px; width: 90%; box-shadow: 0 20px 60px rgba(0,0,0,.2);
  animation: shFadeIn .25s ease;
}
@keyframes shFadeIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.sh-modal h3 { margin: 0 0 4px; font-size: 1.2rem; display: flex; align-items: center; gap: 8px; }
.sh-modal .sh-sub { font-size: .82rem; color: var(--g400); margin: 0 0 20px; }
.sh-opt {
  display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px 16px;
  border: 1px solid var(--border, #e2e8f0); border-radius: 12px; background: var(--white);
  cursor: pointer; font-family: inherit; font-size: .9rem; color: var(--text);
  transition: all .2s; margin-bottom: 10px; text-align: left;
}
.sh-opt:hover { border-color: var(--primary); background: var(--g50); transform: translateX(4px); }
.sh-opt i { font-size: 1.1rem; width: 20px; text-align: center; }
.sh-opt.copy { color: var(--primary); }
.sh-opt.email { color: #e74c3c; }
.sh-opt.whatsapp { color: #25D366; }
.sh-opt.wechat { color: #07C160; }
.sh-cancel {
  width: 100%; padding: 10px; border: none; border-radius: 10px; background: var(--g100);
  cursor: pointer; font-family: inherit; font-size: .85rem; color: var(--g500);
  margin-top: 6px; transition: background .2s;
}
.sh-cancel:hover { background: var(--g200); }
.sh-toast {
  position: fixed; bottom: 32px; left: 50%; transform: translateX(-50%);
  background: #333; color: #fff; padding: 10px 24px; border-radius: 50px;
  font-size: .85rem; z-index: 10002; animation: shToast .3s ease;
  pointer-events: none;
}
@keyframes shToast { from { opacity: 0; transform: translateX(-50%) translateY(10px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }
[data-theme="dark"] .sh-modal { background: var(--g800); }
[data-theme="dark"] .sh-opt { background: var(--g800); border-color: var(--g600); }
[data-theme="dark"] .sh-opt:hover { background: var(--g700); }
[data-theme="dark"] .sh-cancel { background: var(--g700); }
[data-theme="dark"] .sh-cancel:hover { background: var(--g600); }

/* ========== Tour FAQ Accordion (v2.52) ========== */
.tf-card {
  background: var(--white); border-radius: 16px; padding: 28px 32px;
  margin-bottom: 20px; box-shadow: var(--shadow-sm, 0 2px 12px rgba(0,0,0,.06));
  border: 1px solid var(--border, #e2e8f0);
}
.tf-card h2 { margin: 0 0 4px; font-size: 1.15rem; display: flex; align-items: center; gap: 8px; }
.tf-card .tf-sub { font-size: .82rem; color: var(--g400); margin: 0 0 16px; }
.tf-item {
  border: 1px solid var(--border, #e2e8f0); border-radius: 10px;
  margin-bottom: 8px; overflow: hidden; transition: border-color .2s;
}
.tf-item[open] { border-color: var(--primary); }
.tf-item summary {
  padding: 14px 44px 14px 16px; font-weight: 600; font-size: .92rem;
  cursor: pointer; position: relative; list-style: none; user-select: none;
  display: flex; align-items: center; gap: 8px; transition: background .2s;
}
.tf-item summary::-webkit-details-marker { display: none; }
.tf-item summary::after {
  content: '\f078'; font-family: 'Font Awesome 6 Free'; font-weight: 900;
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  font-size: .7rem; color: var(--g400); transition: transform .25s;
}
.tf-item[open] summary::after { transform: translateY(-50%) rotate(180deg); color: var(--primary); }
.tf-item summary:hover { background: var(--g50); }
.tf-item summary .tf-q-icon { color: var(--primary); font-size: .85rem; flex-shrink: 0; }
.tf-item .tf-a {
  padding: 0 16px 14px 40px; font-size: .88rem; color: var(--text-light);
  line-height: 1.6;
}
[data-theme="dark"] .tf-card { background: var(--g850); border-color: var(--g600); }
[data-theme="dark"] .tf-item { border-color: var(--g600); }
[data-theme="dark"] .tf-item[open] { border-color: var(--primary); }
[data-theme="dark"] .tf-item summary:hover { background: var(--g700); }
[data-theme="dark"] .tf-item .tf-a { color: #94a3b8; }
@media (max-width: 768px) {
  .tf-card { padding: 20px 16px; }
  .tf-item summary { padding: 12px 40px 12px 12px; font-size: .87rem; }
  .tf-item .tf-a { padding: 0 12px 12px 32px; font-size: .84rem; }
}

/* ========== Card Image Hover Zoom (v2.51) ========== */
.tci { overflow: hidden; }
.tci-img { transition: transform .5s ease; will-change: transform; }
.tc:hover .tci-img, .tc:focus-within .tci-img { transform: scale(1.08); }
/* Gallery strip zoom */
.gl-img { transition: transform .4s ease; }
.gl-img:hover { transform: scale(1.05); }
/* Attraction card zoom */
.acd .aci { overflow: hidden; }
.acd .aci img { transition: transform .5s ease; }
.acd:hover .aci img, .acd:focus-within .aci img { transform: scale(1.08); }
/* Blog card zoom */
.tmc .tmc-thumb { overflow: hidden; }
.tmc .tmc-thumb img { transition: transform .5s ease; }
.tmc:hover .tmc-thumb img, .tmc:focus-within .tmc-thumb img { transform: scale(1.08); }
/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .tci-img, .gl-img, .acd .aci img, .tmc .tmc-thumb img { transition: none !important; }
  .tc:hover .tci-img, .tc:focus-within .tci-img,
  .acd:hover .aci img, .acd:focus-within .aci img,
  .tmc:hover .tmc-thumb img, .tmc:focus-within .tmc-thumb img { transform: none !important; }
}

/* =========== v2.53: Categories Showcase + Count-Up Stats =========== */
/* Categories Grid */
.cs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.cs-card {
  display: block;
  text-decoration: none;
  border-radius: 16px;
  overflow: hidden;
  background: var(--white);
  box-shadow: var(--shadow);
  transition: var(--transition), transform .35s cubic-bezier(.25,.8,.25,1.2);
  position: relative;
}
.cs-card:hover, .cs-card:focus-visible {
  transform: translateY(-6px);
  box-shadow: var(--shadow-hover);
}
.cs-bg {
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.cs-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.15);
}
.cs-ico {
  font-size: 2.4rem;
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.3));
}
.cs-info {
  padding: 14px 16px;
  text-align: center;
}
.cs-title {
  display: block;
  font-weight: 700;
  font-size: .95rem;
  color: var(--text-dark);
  margin-bottom: 2px;
}
.cs-count {
  display: block;
  font-size: .78rem;
  color: var(--g600);
}

/* Count-Up Stats enhancement */
.hf .fn {
  transition: opacity .3s ease;
}
.fn.cu-counting {
  animation: cuPulse .4s ease-out;
}
@keyframes cuPulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.15); }
  100% { transform: scale(1); }
}

/* Responsive: Categories */
@media (max-width: 1024px) {
  .cs-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .cs-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .cs-bg { height: 80px; }
  .cs-ico { font-size: 2rem; }
  .cs-title { font-size: .85rem; }
}
@media (max-width: 480px) {
  .cs-grid { gap: 10px; }
  .cs-bg { height: 70px; }
  .cs-ico { font-size: 1.6rem; }
  .cs-info { padding: 10px 12px; }
  .cs-title { font-size: .8rem; }
}

/* Dark mode: Categories */
[data-theme="dark"] .cs-card { background: var(--g800); }
[data-theme="dark"] .cs-title { color: var(--white); }
[data-theme="dark"] .cs-count { color: var(--g400); }

/* === v2.54 Mobile Bottom Navigation === */
.mbn {
  display: none; position: fixed; bottom: 0; left: 0; right: 0;
  background: var(--white); z-index: 998;
  box-shadow: 0 -2px 16px rgba(0,0,0,.1);
  padding: 6px 8px env(safe-area-inset-bottom, 8px);
  justify-content: space-around; align-items: center;
}
@media (max-width: 768px) { .mbn { display: flex; } }
.mbn-item {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  text-decoration: none; color: var(--g500); font-size: .65rem;
  font-weight: 500; padding: 4px 10px; border-radius: 8px;
  transition: color .2s, background .2s; min-width: 50px;
  position: relative;
}
.mbn-item i { font-size: 1.15rem; }
.mbn-item.on { color: var(--secondary); }
.mbn-item:active { background: var(--g100); }
.mbn-item .mbn-dot {
  position: absolute; top: 2px; right: 2px; width: 7px; height: 7px;
  border-radius: 50%; background: var(--secondary); display: none;
}
.mbn-item .mbn-dot.show { display: block; }

/* Offset for mobile bottom nav �?push content up */
@media (max-width: 768px) {
  .btt { bottom: 80px !important; }
  #mob-cta.on-detail { bottom: 68px; }
  #fab-wrap { bottom: 80px !important; }
  body.has-mbn { padding-bottom: 68px; }
  .to { bottom: 80px !important; }
}

/* === v2.54 Sticky Filter Bar === */
.fb-wrap.sticky {
  position: sticky; top: 68px; z-index: 99;
  background: var(--bg); padding: 12px 0; margin: 0;
  border-bottom: 1px solid rgba(0,0,0,.06);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
@media (max-width: 768px) {
  .fb-wrap.sticky { top: 56px; padding: 8px 0; }
}

/* === v2.54 Available Date Badge === */
.tc-ad {
  position: absolute; bottom: 10px; left: 12px;
  background: rgba(39,174,96,.9); color: #fff;
  font-size: .68rem; padding: 3px 10px; border-radius: 10px;
  z-index: 2; font-weight: 600;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.tc-ad i { margin-right: 3px; }

/* === v2.54 BTT Scroll Progress Ring === */
.btt-progress {
  position: absolute; top: -3px; left: -3px;
  width: calc(100% + 6px); height: calc(100% + 6px);
  transform: rotate(-90deg);
}
.btt-progress circle {
  fill: none; stroke: var(--secondary); stroke-width: 3;
  stroke-dasharray: 126; stroke-dashoffset: 126;
  transition: stroke-dashoffset .15s ease;
  opacity: .7;
}
[data-theme="dark"] .fb-wrap.sticky { background: rgba(18,18,18,.92); border-color: rgba(255,255,255,.06); }
[data-theme="dark"] .mbn { background: var(--g850); border-top: 1px solid var(--g700); }
[data-theme="dark"] .mbn-item:active { background: var(--g700); }

/* === v2.55 Skeleton Loading Cards === */
.sk-card {
  background: var(--bg); border-radius: 12px; overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.06); display: flex; flex-direction: column;
  min-height: 320px;
}
.sk-img { width: 100%; height: 160px; }
.sk-body { padding: 16px; flex:1; }
.sk-line { height: 14px; border-radius: 6px; margin-bottom: 10px; background: var(--g150); }
.sk-title { width: 75%; height: 18px; }
.sk-meta { width: 50%; }
.sk-price { width: 35%; height: 16px; }

/* Shimmer animation */
.sk-shimmer {
  background: linear-gradient(90deg, var(--g100) 25%, var(--g200) 50%, var(--g100) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s ease-in-out infinite;
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
  .sk-shimmer { animation: none; background: var(--g150); }
}

/* Dark mode skeleton */
[data-theme="dark"] .sk-card { background: var(--g800); }
[data-theme="dark"] .sk-shimmer {
  background: linear-gradient(90deg, var(--g700) 25%, var(--g600) 50%, var(--g700) 75%);
  background-size: 200% 100%;
}

/* === v2.55 Enhanced Toast Notification === */
.to {
  position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(100px);
  background: #1a1a2e; color: #fff; padding: 12px 44px 12px 16px; border-radius: 10px;
  font-size: .9rem; font-weight: 500; z-index: 10001; opacity: 0;
  transition: transform .3s cubic-bezier(.4,0,.2,1), opacity .3s ease;
  display: flex; align-items: center; gap: 10px; min-width: 200px; max-width: 90vw;
  box-shadow: 0 8px 32px rgba(0,0,0,.18);
}
.to.on { transform: translateX(-50%) translateY(0); opacity: 1; }
.to-ico { font-size: 1.2rem; flex-shrink: 0; }
.to-msg { flex: 1; line-height: 1.4; }
.to-close {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  background: none; border: none; color: rgba(255,255,255,.5); font-size: 1.3rem;
  cursor: pointer; padding: 4px 8px; line-height: 1; border-radius: 4px;
  transition: color .2s;
}
.to-close:hover { color: #fff; }
.to-success { background: #0d6b3d; }
.to-success .to-ico { color: #4ade80; }
.to-error { background: #991b1b; }
.to-error .to-ico { color: #f87171; }
.to-warning { background: #92400e; }
.to-warning .to-ico { color: #fbbf24; }
.to-info { background: #1e3a5f; }
.to-info .to-ico { color: #60a5fa; }

@media (max-width: 768px) {
  .to { bottom: 84px; font-size: .82rem; padding: 10px 40px 10px 14px; }
}

/* === v2.55 Empty States === */
.em {
  grid-column: 1 / -1; text-align: center; padding: 60px 20px;
  color: var(--g500);
}
.em .fas { font-size: 3rem; margin-bottom: 16px; opacity: .4; }
.em p { font-size: 1.05rem; margin-bottom: 8px; }
.es-cta {
  display: inline-block; margin-top: 16px; padding: 10px 28px;
  background: var(--primary); color: #fff; border-radius: 24px;
  text-decoration: none; font-weight: 600; font-size: .9rem;
  transition: background .2s, transform .2s;
}
.es-cta:hover { background: var(--primary-dark, #154f6e); transform: translateY(-1px); }
.es-wishlist .fas { color: #e74c3c; }
.es-compare .fas { color: #8e44ad; }

[data-theme="dark"] .em { color: var(--g400); }
[data-theme="dark"] .em .fas { opacity: .3; }

/* === v2.55 LQIP Blur-Up === */
img.lqip {
  transition: filter .4s ease, opacity .4s ease;
  filter: blur(12px); opacity: .6;
}
img.lqip-loaded { filter: blur(0); opacity: 1; }

/* ============= v2.56 Detail Tabs ============= */

/* Tab Navigation */
.dt-nav {
  display: flex;
  gap: 2px;
  background: var(--white);
  border: 1px solid var(--g100);
  border-radius: 12px;
  padding: 4px;
  margin-bottom: 20px;
  position: sticky;
  top: 68px;
  z-index: 40;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.dt-nav::-webkit-scrollbar { display: none; }

.dt-tab {
  flex: 1;
  min-width: 72px;
  white-space: nowrap;
  padding: 10px 16px;
  border: none;
  border-radius: 9px;
  background: transparent;
  color: var(--g600);
  font-size: .88rem;
  font-weight: 500;
  cursor: pointer;
  transition: all .2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  outline: none;
  font-family: inherit;
}
.dt-tab:hover {
  background: var(--g50);
  color: var(--primary);
}
.dt-tab:focus-visible {
  box-shadow: var(--focus-ring);
  background: var(--g50);
}
.dt-tab.active {
  background: var(--primary);
  color: #fff;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(26,95,122,.25);
}

/* Tab Panels */
.dt-panels { position: relative; }
.dt-panel {
  display: none;
  animation: dtFadeIn .25s ease;
}
.dt-panel.active { display: block; }

@keyframes dtFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Dark Mode */
[data-theme="dark"] .dt-nav {
  background: var(--white);
  border-color: var(--g200);
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
[data-theme="dark"] .dt-tab { color: var(--g400); }
[data-theme="dark"] .dt-tab:hover {
  background: var(--g100);
  color: var(--primary);
}
[data-theme="dark"] .dt-tab.active {
  background: var(--primary);
  color: #fff;
}

/* Responsive */
@media (max-width: 768px) {
  .dt-nav {
    top: 60px;
    border-radius: 0;
    margin: 0 -16px 16px -16px;
    padding: 6px 8px;
    border-left: none;
    border-right: none;
  }
  .dt-tab {
    padding: 8px 12px;
    font-size: .8rem;
    min-width: 60px;
    gap: 4px;
  }
}

@media (max-width: 480px) {
  .dt-nav { top: 56px; padding: 4px 6px; }
  .dt-tab { padding: 7px 10px; font-size: .76rem; min-width: 52px; gap: 3px; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .dt-panel { animation: none; }
  .dt-tab { transition: none; }
}

/* ============= v3.29 �?Similar Tours Carousel ============= */
.sc-sec { padding: 48px 0 36px; background: var(--bg-light); border-top: 1px solid var(--g100); }
.sc-sec .shd { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.sc-hd-btns { flex-shrink: 0; }
.sc-wrap { position: relative; margin: 0 -8px; }
.sc-track {
  display: flex; gap: 20px; overflow-x: auto;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch; padding: 8px 12px;
  scrollbar-width: none; outline: none;
}
.sc-track::-webkit-scrollbar { display: none; }
.sc-card { flex: 0 0 320px; scroll-snap-align: start; transition: transform 0.25s ease; }
.sc-card:hover { transform: translateY(-4px); }
.sc-arrow {
  position: absolute; top: 42%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid var(--g200); background: var(--white);
  box-shadow: 0 2px 12px rgba(0,0,0,0.1); cursor: pointer; z-index: 5;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-dark); font-size: 1rem;
  transition: all 0.2s ease;
}
.sc-arrow:hover { background: var(--primary); color: var(--white); border-color: var(--primary); box-shadow: 0 4px 16px rgba(0,0,0,0.18); transform: translateY(-50%) scale(1.08); }
.sc-arrow:focus-visible { box-shadow: var(--focus-ring); }
.sc-prev { left: -18px; }
.sc-next { right: -18px; }
.sc-dots { display: flex; justify-content: center; gap: 8px; margin-top: 18px; }
.sc-dot {
  width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid var(--g300); background: transparent;
  cursor: pointer; padding: 0; transition: all 0.25s ease;
}
.sc-dot:hover { border-color: var(--primary); }
.sc-dot.active { background: var(--primary); border-color: var(--primary); width: 26px; border-radius: 5px; }
.sc-va { display: inline-flex; align-items: center; gap: 4px; }
.sc-va:hover { background: var(--primary); color: var(--white); }

/* Dark mode */
[data-theme="dark"] .sc-sec { background: #162030; border-color: #2a3a50; }
[data-theme="dark"] .sc-arrow { background: #1e2d3d; border-color: #3a4a60; color: #d0d8e0; }
[data-theme="dark"] .sc-arrow:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
[data-theme="dark"] .sc-dot { border-color: #4a5a70; }
[data-theme="dark"] .sc-dot.active { background: var(--primary); border-color: var(--primary); }

/* Responsive */
@media (max-width: 768px) {
  .sc-sec { padding: 32px 0 24px; }
  .sc-card { flex: 0 0 280px; }
  .sc-arrow { display: none; }
  .sc-track { padding: 8px 4px; }
}
@media (max-width: 480px) {
  .sc-card { flex: 0 0 260px; }
  .sc-sec .shd { flex-direction: column; align-items: flex-start; }
}

/* ============= v3.30 �?Discount Badges + Quick View + Popularity Heat (v2.58) ============= */
/* Discount Badge */
.do-badge {
  position: absolute; top: 12px; right: 12px;
  background: #e74c3c; color: #fff;
  padding: 3px 10px; border-radius: 14px;
  font-size: 0.75rem; font-weight: 700; z-index: 3;
  letter-spacing: 0.02em; box-shadow: 0 2px 8px rgba(231,76,60,0.35);
}
/* Footer: original price strikethrough */
.tco {
  text-decoration: line-through; color: var(--text-light);
  font-size: 0.9rem; font-weight: 400; margin-right: 8px;
  display: inline-block; opacity: 0.65;
}
.tcp.disc { color: #e74c3c; }
.tcp.disc .tco { font-size: 0.82rem; }

/* Popularity Heat Indicator */
.ph-ind {
  font-size: 0.75rem; color: #e67e22; margin-top: 6px;
  display: flex; align-items: center; gap: 2px;
  font-weight: 500;
}

/* Quick View Overlay (card image) */
.qv-overlay {
  position: absolute; inset: 0;
  background: rgba(0,0,0,0.45); display: flex;
  align-items: center; justify-content: center;
  opacity: 0; transition: opacity 0.25s ease; z-index: 4;
  pointer-events: none;
}
.tc:hover .qv-overlay,
.tc:focus-within .qv-overlay { opacity: 1; pointer-events: auto; }
.qv-btn {
  background: var(--primary); color: #fff; border: none;
  padding: 9px 20px; border-radius: 24px; font-size: 0.82rem;
  font-weight: 600; cursor: pointer; display: flex; align-items: center;
  gap: 6px; transition: transform 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}
.qv-btn:hover { transform: scale(1.06); box-shadow: 0 6px 24px rgba(0,0,0,0.35); }

/* Quick View Modal Overlay */
#qv-overlay.qv-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.6);
  z-index: 1000; display: none; align-items: center;
  justify-content: center; opacity: 1; pointer-events: auto;
}
#qv-overlay.qv-overlay[style*="flex"] { display: flex; }

.qv-modal { width: 100%; max-width: 560px; margin: 20px; max-height: 90vh; overflow-y: auto; border-radius: 16px; }
.qv-content { background: var(--white); border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.3); position: relative; }

/* QV Image */
.qv-img { position: relative; height: 220px; overflow: hidden; }
.qv-img img { width: 100%; height: 100%; object-fit: cover; }
.qv-do { top: 14px; right: 14px; font-size: 0.85rem; padding: 4px 12px; }
.qv-cat {
  position: absolute; bottom: 14px; left: 14px;
  background: rgba(255,255,255,0.92); color: #333;
  padding: 4px 12px; border-radius: 14px; font-size: 0.72rem;
  font-weight: 600; z-index: 2;
}

/* QV Body */
.qv-body { padding: 24px; }
.qv-title { font-size: 1.3rem; font-weight: 700; color: var(--text-dark); margin-bottom: 12px; line-height: 1.4; }

/* QV Facts */
.qv-facts { display: flex; flex-wrap: wrap; gap: 14px; font-size: 0.8rem; color: var(--text-light); margin-bottom: 14px; }
.qv-facts span { display: flex; align-items: center; gap: 4px; }
.qv-facts i { color: var(--primary); font-size: 0.75rem; }

/* QV Description */
.qv-desc { font-size: 0.88rem; color: var(--text-light); line-height: 1.65; margin-bottom: 16px; }

/* QV Pricing */
.qv-price-row { display: flex; align-items: baseline; gap: 10px; margin-bottom: 20px; }
.qv-price-disc { font-size: 1.5rem; font-weight: 700; color: var(--secondary); }
.qv-price-disc small { font-size: 0.72rem; color: var(--text-light); font-weight: 400; }
.qv-price-orig { font-size: 0.9rem; color: var(--text-light); text-decoration: line-through; opacity: 0.6; }

/* QV Actions */
.qv-actions { display: flex; gap: 10px; }
.qv-full { flex: 1; justify-content: center; padding: 10px 20px; font-size: 0.9rem; }
.qv-book { flex-shrink: 0; padding: 10px 24px; font-size: 0.9rem; }

/* QV Close */
.qv-close {
  position: absolute; top: 12px; right: 12px;
  width: 32px; height: 32px; border-radius: 50%;
  background: rgba(0,0,0,0.45); color: #fff; border: none;
  font-size: 0.85rem; cursor: pointer; z-index: 5;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s ease;
}
.qv-close:hover { background: rgba(0,0,0,0.7); }

/* Quick View: fade-in animation */
@keyframes qvFadeIn {
  from { opacity: 0; transform: translateY(20px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
#qv-overlay.qv-overlay[style*="flex"] .qv-modal { animation: qvFadeIn 0.3s ease; }

/* Dark mode */
[data-theme="dark"] .qv-content { background: #1a2a3d; }
[data-theme="dark"] .qv-title { color: #e8ecf2; }
[data-theme="dark"] .qv-cat { background: rgba(26,42,61,0.92); color: #d0d8e0; }
[data-theme="dark"] .qv-close { background: rgba(255,255,255,0.15); }
[data-theme="dark"] .qv-close:hover { background: rgba(255,255,255,0.3); }
[data-theme="dark"] .ph-ind { color: #f0a040; }
[data-theme="dark"] .do-badge { box-shadow: 0 2px 8px rgba(231,76,60,0.5); }

/* Responsive */
@media (max-width: 768px) {
  .qv-overlay { display: none !important; } /* Hide card hover overlay on mobile */
  .qv-modal { max-width: calc(100vw - 32px); margin: 12px; }
  .qv-img { height: 180px; }
  .qv-body { padding: 18px; }
  .qv-title { font-size: 1.15rem; }
  .qv-price-disc { font-size: 1.3rem; }
  .qv-actions { flex-direction: column; }
}

@media (max-width: 480px) {
  .qv-img { height: 150px; }
  .qv-body { padding: 14px; }
  .qv-facts { gap: 8px; font-size: 0.75rem; }
  .qv-desc { font-size: 0.82rem; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .qv-overlay { transition: none; }
  #qv-overlay.qv-overlay[style*="flex"] .qv-modal { animation: none; }
  .qv-btn { transition: none; }
}

/* ============= v3.32 �?Availability Calendar & Price Calculator ============= */

/* -- Availability Calendar Card -- */
.av-card {
  background: var(--white);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 14px;
  box-shadow: 0 1px 6px rgba(0,0,0,.06);
  border: 1px solid var(--g100, #eee);
}
.av-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.av-nav {
  background: none;
  border: 1px solid var(--g200, #ddd);
  border-radius: 6px;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  color: var(--text-dark);
  font-size: 0.75rem;
  transition: background 0.2s, border-color 0.2s;
}
.av-nav:hover { background: var(--bg-light); border-color: var(--primary); color: var(--primary); }
.av-month {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--text-dark);
  text-transform: none;
}
.av-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0;
  margin-bottom: 6px;
}
.av-day-h {
  text-align: center;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--g400, #999);
  padding: 4px 0;
  text-transform: uppercase;
}
.av-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}
.av-cell {
  width: 100%;
  aspect-ratio: 1;
  border: none;
  border-radius: 8px;
  background: transparent;
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--text-dark);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.15s, color 0.15s, transform 0.1s;
  padding: 0;
}
.av-cell:hover:not(.av-past):not(.av-unavail) {
  background: var(--primary);
  color: #fff;
  transform: scale(1.08);
}
.av-empty { visibility: hidden; pointer-events: none; }
.av-past { color: var(--g300, #ccc); cursor: default; }
.av-unavail { color: #ef4444; cursor: default; text-decoration: line-through; }
.av-avail { color: var(--text-dark); }
.av-hot { color: var(--secondary, #c84b31); font-weight: 700; }
.av-hot::after {
  content: '';
  display: block;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--secondary, #c84b31);
  margin: 1px auto 0;
}
.av-selected {
  background: var(--primary) !important;
  color: #fff !important;
  font-weight: 700;
  transform: scale(1.08);
}
.av-selected.av-hot::after { background: #fff; }
.av-sel {
  margin-top: 10px;
  padding: 8px 10px;
  background: var(--bg-light);
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--primary);
  text-align: center;
}

/* -- Price Calculator Card -- */
.px-card {
  background: var(--white);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 14px;
  box-shadow: 0 1px 6px rgba(0,0,0,.06);
  border: 1px solid var(--g100, #eee);
}
.px-hd {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--text-dark);
  margin-bottom: 14px;
  display: flex; align-items: center; gap: 6px;
}
.px-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--g500, #777);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.px-gs-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 16px;
}
.px-gs-btn {
  width: 36px; height: 36px;
  border: 1px solid var(--g200, #ddd);
  border-radius: 50%;
  background: var(--white);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-dark);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
  line-height: 1;
}
.px-gs-btn:hover:not(:disabled) {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.px-gs-btn:disabled {
  opacity: 0.35;
  cursor: default;
}
.px-gs-val {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--text-dark);
  min-width: 32px;
  text-align: center;
}
.px-summary {
  background: var(--bg-light);
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 14px;
}
.px-pp-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
}
.px-pp-label {
  font-size: 0.8rem;
  color: var(--g500, #777);
}
.px-pp-val {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--text-dark);
}
.px-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0 2px;
  border-top: 1px dashed var(--g200, #ddd);
  margin-top: 6px;
}
.px-total-label {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text-dark);
}
.px-total-val {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--secondary, #c84b31);
}
.px-disc-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2px 0;
  font-size: 0.75rem;
}
.px-disc-val {
  font-weight: 700;
  font-size: 0.82rem;
}
.px-btn {
  width: 100%;
  font-size: 0.9rem;
  padding: 12px !important;
  display: flex; align-items: center; justify-content: center; gap: 6px;
}

/* Dark mode */
[data-theme="dark"] .av-card,
[data-theme="dark"] .px-card {
  background: #1e293b;
  border-color: #334155;
}
[data-theme="dark"] .av-nav { color: #94a3b8; border-color: #475569; }
[data-theme="dark"] .av-nav:hover { background: #334155; }
[data-theme="dark"] .av-month { color: #e2e8f0; }
[data-theme="dark"] .av-day-h { color: #64748b; }
[data-theme="dark"] .av-cell { color: #cbd5e1; }
[data-theme="dark"] .av-cell:hover:not(.av-past):not(.av-unavail) { background: var(--primary); color: #fff; }
[data-theme="dark"] .av-past { color: #475569; }
[data-theme="dark"] .av-unavail { color: #f87171; }
[data-theme="dark"] .av-avail { color: #cbd5e1; }
[data-theme="dark"] .av-sel { background: #122543; color: #60a5fa; }
[data-theme="dark"] .px-gs-btn { background: #1e293b; border-color: #475569; color: #cbd5e1; }
[data-theme="dark"] .px-gs-btn:hover:not(:disabled) { background: var(--primary); color: #fff; }
[data-theme="dark"] .px-gs-val { color: #e2e8f0; }
[data-theme="dark"] .px-summary { background: #0f172a; }
[data-theme="dark"] .px-pp-label { color: #94a3b8; }
[data-theme="dark"] .px-pp-val { color: #cbd5e1; }
[data-theme="dark"] .px-total-label { color: #e2e8f0; }
[data-theme="dark"] .px-total-val { color: var(--secondary); }
[data-theme="dark"] .px-total-row { border-color: #334155; }

/* Mobile responsive */
@media (max-width: 767px) {
  .av-card { margin-bottom: 10px; }
  .av-cell { font-size: 0.72rem; border-radius: 6px; }
  .px-card { margin-bottom: 10px; }
}

/* ============= v3.33 �?Enhanced Wishlist (v2.61) ============= */

/* Wishlist Toolbar */
.wl-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: var(--white);
  border: 1px solid var(--g100);
  border-radius: 12px;
  margin-bottom: 20px;
}

/* Wishlist Stats */
.wl-stats {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 200px;
}
.wl-stats .fas { color: #e74c3c; font-size: 1.1em; }
.wl-stats-text {
  font-size: .88rem;
  color: var(--text-secondary, #64748b);
  font-weight: 500;
}

/* Sort Wrap */
.wl-sort-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
}
.wl-sort-label {
  font-size: .82rem;
  color: var(--text-secondary, #94a3b8);
  white-space: nowrap;
}
.wl-sort-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--g100);
  border-radius: 8px;
  background: var(--white);
  color: var(--text-secondary, #64748b);
  cursor: pointer;
  font-size: .82rem;
  transition: all .2s;
}
.wl-sort-btn:hover { background: #f8f9fa; border-color: var(--primary); color: var(--primary); }
.wl-sort-btn.active { background: var(--primary); border-color: var(--primary); color: #fff; }

/* Wishlist Actions */
.wl-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.wl-act-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border: 1px solid var(--g100);
  border-radius: 8px;
  background: var(--white);
  color: var(--text-secondary, #475569);
  cursor: pointer;
  font-size: .82rem;
  font-weight: 500;
  transition: all .2s;
  white-space: nowrap;
}
.wl-act-btn:hover { background: #f8f9fa; transform: translateY(-1px); }
.wl-share-btn:hover { border-color: #3b82f6; color: #3b82f6; }
.wl-email-btn:hover { border-color: #10b981; color: #10b981; }
.wl-print-btn:hover { border-color: #8b5cf6; color: #8b5cf6; }
.wl-clear-btn:hover { border-color: #ef4444; color: #ef4444; background: #fef2f2; }

/* Wishlist Empty Enhanced */
.wl-empty-sub {
  font-size: .85rem;
  color: var(--text-secondary, #94a3b8);
  margin-top: 6px !important;
}

/* Wishlist Suggest Header */
.wl-suggest-hdr {
  font-size: .95rem;
  font-weight: 600;
  color: var(--text, #334155);
  margin-top: 24px;
  margin-bottom: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--g200);
}
.wl-suggest-hdr .fas { color: #f59e0b; }

/* Wishlist Suggest Grid */
.wl-suggest-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.wl-suggest-card {
  display: block;
  border-radius: 10px;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--g100);
  text-decoration: none;
  transition: transform .2s, box-shadow .2s;
}
.wl-suggest-card:hover { transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,.08); }
.wl-sc-img {
  height: 110px;
  background-size: cover;
  background-position: center;
  background-color: #e2e8f0;
}
.wl-sc-info { padding: 10px 12px; }
.wl-sc-title {
  font-size: .82rem;
  font-weight: 600;
  color: var(--text, #1e293b);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 6px;
}
.wl-sc-meta {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: .78rem;
  color: var(--text-secondary, #64748b);
}
.wl-sc-star { color: #f59e0b; font-size: .75em; }

/* Dark mode overrides */
[data-theme="dark"] .wl-toolbar { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .wl-stats-text { color: #94a3b8; }
[data-theme="dark"] .wl-sort-btn { background: #1e293b; border-color: #475569; color: #94a3b8; }
[data-theme="dark"] .wl-sort-btn:hover { background: #334155; border-color: var(--primary); color: var(--primary); }
[data-theme="dark"] .wl-sort-btn.active { background: var(--primary); color: #fff; }
[data-theme="dark"] .wl-act-btn { background: #1e293b; border-color: #475569; color: #94a3b8; }
[data-theme="dark"] .wl-act-btn:hover { background: #334155; }
[data-theme="dark"] .wl-clear-btn:hover { background: #3b1818; }
[data-theme="dark"] .wl-suggest-card { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .wl-sc-title { color: #e2e8f0; }
[data-theme="dark"] .wl-suggest-hdr { color: #e2e8f0; border-color: #334155; }

/* Responsive */
@media (max-width: 767px) {
  .wl-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 12px;
  }
  .wl-stats { min-width: auto; }
  .wl-sort-wrap { flex-wrap: wrap; }
  .wl-actions { justify-content: flex-start; }
  .wl-act-btn { padding: 6px 10px; font-size: .78rem; }
  .wl-suggest-grid { grid-template-columns: repeat(2, 1fr); }
}

/* =============================================
   v3.34 �?Smart Urgency & Social Proof
   ============================================= */

/* --- Pulsing live viewer dot --- */
@keyframes pulse-dot {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.8); opacity: 0.4; }
}
@keyframes pulse-dot-ring {
  0% { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(2.5); opacity: 0; }
}
.sp-ic-live {
  position: relative;
  background: #e8f5e9 !important;
}
.sp-live-dot {
  display: block;
  width: 10px; height: 10px;
  background: #22c55e;
  border-radius: 50%;
  animation: pulse-dot 2s ease-in-out infinite;
  position: relative;
  z-index: 1;
}
.sp-live-dot::after {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid #22c55e;
  animation: pulse-dot-ring 2s ease-out infinite;
}
.sp-val-live {
  color: #16a34a !important;
}
.sp-live {
  background: linear-gradient(90deg, #f0fdf4 0%, transparent 100%);
  border-radius: 8px;
  padding: 10px 8px !important;
}
.sp-live + .sp-row { border-top-color: #dcfce7; }

/* --- Limited spots warning --- */
.sp-spot-warn {
  animation: spotPulse 2s ease-in-out infinite;
}
@keyframes spotPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.15); }
  50% { box-shadow: 0 0 0 6px rgba(220, 38, 38, 0); }
}

/* --- Hot season badge --- */
.sp-hot-badge {
  margin-top: 12px;
  padding: 10px 12px;
  background: linear-gradient(135deg, #fff7ed, #ffedd5);
  border: 1px solid #fed7aa;
  border-radius: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
  color: #c2410c;
  font-weight: 600;
}

/* --- Trending badge on tour cards --- */
@keyframes trendPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.6); }
  50% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
}
.tc-trend {
  position: absolute;
  bottom: 12px;
  left: 12px;
  background: linear-gradient(135deg, #ef4444, #dc2626);
  color: #fff;
  padding: 4px 12px 4px 8px;
  border-radius: 20px;
  font-size: 0.7rem;
  font-weight: 700;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 4px;
  animation: trendPulse 2.5s ease-in-out infinite;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.trend-dot {
  width: 7px; height: 7px;
  background: #fff;
  border-radius: 50%;
  animation: pulse-dot 1.5s ease-in-out infinite;
}
.tc:hover .tc-trend {
  animation: none;
  opacity: 0;
  transition: opacity 0.2s;
}

/* --- Booking toast notifications --- */
.bk-toast {
  position: fixed;
  bottom: 24px;
  left: 24px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-left: 4px solid #22c55e;
  border-radius: 12px;
  padding: 14px 40px 14px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,.12);
  z-index: 9999;
  max-width: 380px;
  transform: translateX(-120%);
  opacity: 0;
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
}
.bk-toast.show {
  transform: translateX(0);
  opacity: 1;
}
.bk-toast-av {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: linear-gradient(135deg, #22c55e, #16a34a);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.9rem;
  flex-shrink: 0;
}
.bk-toast-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.bk-toast-txt {
  font-size: 0.82rem;
  color: #334155;
  font-weight: 500;
  line-height: 1.3;
}
.bk-toast-time {
  font-size: 0.7rem;
  color: #94a3b8;
}
.bk-toast-close {
  position: absolute;
  top: 8px; right: 8px;
  width: 24px; height: 24px;
  border: none;
  background: none;
  color: #94a3b8;
  font-size: 1.1rem;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.bk-toast-close:hover {
  background: #f1f5f9;
  color: #334155;
}

/* --- Fire icon pulse for heat indicator --- */
.ph-fire-icon {
  display: inline-block;
  animation: pulse-dot 2s ease-in-out infinite;
}

/* =============================================
   v3.35 �?Smart Travel Concierge Panel
   ============================================= */
/* Concierge floating button */
.cnc-btn {
  position: fixed; bottom: 100px; right: 24px;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1a5f7a, #0d3b4f);
  color: #fff; border: none;
  font-size: 1.5rem; cursor: pointer;
  box-shadow: 0 4px 20px rgba(26,95,122,.4);
  z-index: 9990;
  display: flex; align-items: center; justify-content: center;
  transition: all .3s cubic-bezier(.34,1.56,.64,1);
  animation: cnc-pulse 3s ease-in-out infinite;
}
.cnc-btn:hover { transform: scale(1.1); box-shadow: 0 6px 28px rgba(26,95,122,.55); }
.cnc-btn:active { transform: scale(.95); }
@keyframes cnc-pulse {
  0%,100% { box-shadow: 0 4px 20px rgba(26,95,122,.4); }
  50% { box-shadow: 0 4px 30px rgba(26,95,122,.7); }
}
.cnc-btn.cnc-open { background: var(--secondary); animation: none; }
.cnc-btn-tip {
  position: absolute; right: 66px;
  background: #fff; color: #334155;
  font-size: .72rem; font-weight: 600;
  padding: 6px 14px; border-radius: 20px;
  white-space: nowrap;
  box-shadow: 0 2px 12px rgba(0,0,0,.12);
  opacity: 0; transform: translateX(8px);
  transition: all .3s ease;
  pointer-events: none;
}
.cnc-btn:hover .cnc-btn-tip { opacity: 1; transform: translateX(0); }

/* Panel overlay */
.cnc-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 9995;
  display: none;
  animation: cnc-fadeIn .25s ease;
}
.cnc-overlay.on { display: block; }
@keyframes cnc-fadeIn { from{opacity:0} to{opacity:1} }

/* Concierge panel */
.cnc-pnl {
  position: fixed; bottom: 0; right: 0;
  width: 420px; max-width: 100vw;
  height: 520px; max-height: 75vh;
  background: #fff; border-radius: 20px 20px 0 0;
  box-shadow: 0 -4px 32px rgba(0,0,0,.18);
  z-index: 9996;
  display: flex; flex-direction: column;
  transform: translateY(100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  overflow: hidden;
}
.cnc-pnl.on { transform: translateY(0); }

/* Panel header */
.cnc-hd {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--g100);
  background: linear-gradient(135deg, #1a5f7a, #0d3b4f);
  color: #fff;
}
.cnc-hd h3 { font-size: 1.05rem; font-weight: 700; margin: 0; display: flex; align-items: center; gap: 8px; }
.cnc-hd h3 i { font-size: 1.1rem; opacity: .9; }
.cnc-hd-close {
  width: 32px; height: 32px; border: none;
  background: rgba(255,255,255,.15); color: #fff;
  border-radius: 50%; cursor: pointer; font-size: 1rem;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s;
}
.cnc-hd-close:hover { background: rgba(255,255,255,.3); }

/* Tabs */
.cnc-tabs {
  display: flex; gap: 0;
  border-bottom: 1px solid var(--g100);
  background: var(--g50);
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.cnc-tabs::-webkit-scrollbar { display: none; }
.cnc-tab {
  flex: 1; min-width: fit-content;
  padding: 12px 8px;
  border: none; background: none;
  font-size: .75rem; font-weight: 600;
  color: var(--g400); cursor: pointer;
  white-space: nowrap; text-align: center;
  transition: all .2s;
  border-bottom: 2px solid transparent;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
}
.cnc-tab i { font-size: 1rem; }
.cnc-tab:hover { color: var(--primary); }
.cnc-tab.ac { color: var(--primary); border-bottom-color: var(--primary); }

/* Panel body */
.cnc-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.cnc-body::-webkit-scrollbar { width: 4px; }
.cnc-body::-webkit-scrollbar-thumb { background: var(--g200); border-radius: 4px; }

/* Trip Calculator */
.cnc-calc-field { margin-bottom: 16px; }
.cnc-calc-field label {
  display: flex; justify-content: space-between; align-items: center;
  font-size: .82rem; font-weight: 600; color: var(--g800); margin-bottom: 6px;
}
.cnc-calc-field label span { font-size: .75rem; color: var(--primary); font-weight: 700; }
.cnc-calc-field input[type=range] {
  width: 100%; -webkit-appearance: none; appearance: none;
  height: 6px; border-radius: 3px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  outline: none;
}
.cnc-calc-field input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; width: 20px; height: 20px;
  border-radius: 50%; background: #fff;
  border: 3px solid var(--primary);
  cursor: pointer; box-shadow: 0 2px 6px rgba(0,0,0,.15);
}
.cnc-calc-results { margin-top: 4px; }
.cnc-calc-cta {
  display: block; width: 100%; margin-top: 12px;
  padding: 10px; border: none; border-radius: 10px;
  background: var(--primary); color: #fff;
  font-size: .85rem; font-weight: 700; cursor: pointer;
  transition: all .2s;
}
.cnc-calc-cta:hover { background: #14506a; }
.cnc-calc-cta:disabled { background: var(--g200); color: var(--g400); cursor: not-allowed; }

.cnc-rec-card {
  display: flex; gap: 10px; padding: 10px;
  border-radius: 10px; background: var(--g50);
  margin-bottom: 8px; cursor: pointer;
  transition: all .2s; align-items: center;
}
.cnc-rec-card:hover { background: var(--g100); transform: translateX(3px); }
.cnc-rec-img {
  width: 55px; height: 55px; border-radius: 8px;
  object-fit: cover; flex-shrink: 0;
}
.cnc-rec-info { flex: 1; min-width: 0; }
.cnc-rec-info h4 { font-size: .8rem; font-weight: 600; margin: 0 0 3px; color: var(--g800); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cnc-rec-info p { font-size: .7rem; color: var(--g400); margin: 0; }
.cnc-rec-price { font-size: .85rem; font-weight: 700; color: var(--secondary); }
.cnc-calc-summary {
  display: flex; gap: 8px; margin-top: 8px;
  padding: 10px; border-radius: 10px;
  background: linear-gradient(135deg, #e8f4f8, #fef3e0);
}
.cnc-calc-summary-item { flex: 1; text-align: center; }
.cnc-calc-summary-item .v { font-size: 1rem; font-weight: 700; color: var(--primary); }
.cnc-calc-summary-item .l { font-size: .65rem; color: var(--g400); margin-top: 2px; }

/* Weather Guide */
.cnc-weather-grid {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 6px;
}
.cnc-wm-card {
  padding: 8px 4px; border-radius: 8px;
  background: var(--g50); text-align: center;
  cursor: default; transition: all .2s;
  border: 1px solid transparent;
}
.cnc-wm-card:hover { border-color: var(--primary); }
.cnc-wm-card.best { background: #ecfdf5; border-color: #6ee7b7; }
.cnc-wm-card.good { background: #fefce8; border-color: #fde047; }
.cnc-wm-card .mon { font-size: .68rem; font-weight: 600; color: var(--g600); }
.cnc-wm-card .tmp { font-size: .78rem; font-weight: 700; color: var(--g800); margin: 2px 0; }
.cnc-wm-card .ico { font-size: 1.1rem; }
.cnc-wm-card .tag { font-size: .6rem; font-weight: 600; padding: 1px 6px; border-radius: 10px; display: inline-block; margin-top: 2px; }
.cnc-wm-card .tag-best { background: #6ee7b7; color: #065f46; }
.cnc-wm-card .tag-good { background: #fde047; color: #854d0e; }
.cnc-wm-card .tag-ok { background: #e2e8f0; color: #64748b; }

/* Currency Tips */
.cnc-curr-converter {
  display: flex; gap: 8px; align-items: center; margin-bottom: 16px;
}
.cnc-curr-input {
  flex: 1; padding: 10px 12px;
  border: 2px solid var(--g100); border-radius: 10px;
  font-size: .95rem; font-weight: 600; color: var(--g800);
  outline: none; transition: border-color .2s;
}
.cnc-curr-input:focus { border-color: var(--primary); }
.cnc-curr-select {
  padding: 10px 12px;
  border: 2px solid var(--g100); border-radius: 10px;
  font-size: .85rem; background: #fff;
  color: var(--g800); cursor: pointer; outline: none;
}
.cnc-curr-result {
  text-align: center; padding: 12px;
  background: linear-gradient(135deg, #1a5f7a, #0d3b4f);
  color: #fff; border-radius: 10px; margin-bottom: 14px;
}
.cnc-curr-result .amt { font-size: 1.3rem; font-weight: 700; }
.cnc-curr-result .rate { font-size: .7rem; opacity: .7; margin-top: 4px; }
.cnc-tips-list { list-style: none; padding: 0; margin: 0; }
.cnc-tips-list li {
  display: flex; gap: 8px; align-items: flex-start;
  padding: 9px 0; border-bottom: 1px solid var(--g50);
  font-size: .78rem; color: var(--g600); line-height: 1.4;
}
.cnc-tips-list li i { color: var(--primary); margin-top: 2px; flex-shrink: 0; }
.cnc-tips-list li:last-child { border-bottom: none; }

/* Essential Tips */
.cnc-tips-section { margin-bottom: 16px; }
.cnc-tips-section h4 {
  font-size: .82rem; font-weight: 700; color: var(--g800);
  margin: 0 0 8px; display: flex; align-items: center; gap: 6px;
}
.cnc-tips-section h4 i { color: var(--primary); font-size: .85rem; }
.cnc-tips-section p { font-size: .76rem; color: var(--g600); margin: 0; line-height: 1.5; }

.cnc-phrase-card {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 12px; background: var(--g50);
  border-radius: 8px; margin-bottom: 6px; font-size: .78rem;
}
.cnc-phrase-cn { font-weight: 600; color: var(--g800); }
.cnc-phrase-py { color: var(--g400); font-size: .7rem; margin-left: 8px; }
.cnc-phrase-en { color: var(--g400); font-size: .7rem; text-align: right; }

/* =============================================
   v3.35 �?Dark mode overrides
   ============================================= */
[data-theme="dark"] .cnc-pnl { background: #1e293b; }
[data-theme="dark"] .cnc-tabs { background: #0f172a; }
[data-theme="dark"] .cnc-tab.ac { color: var(--primary); }
[data-theme="dark"] .cnc-rec-card { background: #0f172a; }
[data-theme="dark"] .cnc-rec-card:hover { background: #1e293b; }
[data-theme="dark"] .cnc-rec-info h4 { color: #e2e8f0; }
[data-theme="dark"] .cnc-calc-summary { background: linear-gradient(135deg, #0c4a6e, #451a03); }
[data-theme="dark"] .cnc-wm-card { background: #0f172a; }
[data-theme="dark"] .cnc-wm-card.best { background: #064e3b; border-color: #065f46; }
[data-theme="dark"] .cnc-wm-card.good { background: #451a03; border-color: #78350f; }
[data-theme="dark"] .cnc-wm-card .mon { color: #94a3b8; }
[data-theme="dark"] .cnc-wm-card .tmp { color: #e2e8f0; }
[data-theme="dark"] .cnc-curr-input { background: #0f172a; border-color: #334155; color: #e2e8f0; }
[data-theme="dark"] .cnc-curr-select { background: #0f172a; border-color: #334155; color: #e2e8f0; }
[data-theme="dark"] .cnc-tips-list li { border-bottom-color: #1e293b; color: #94a3b8; }
[data-theme="dark"] .cnc-tips-section p { color: #94a3b8; }
[data-theme="dark"] .cnc-phrase-card { background: #0f172a; }
[data-theme="dark"] .cnc-phrase-cn { color: #e2e8f0; }
[data-theme="dark"] .cnc-btn-tip { background: #1e293b; color: #e2e8f0; }

/* =============================================
   v3.35 �?Responsive
   ============================================= */
@media (max-width: 767px) {
  .cnc-pnl { width: 100%; height: 460px; border-radius: 16px 16px 0 0; }
  .cnc-btn { bottom: 85px; right: 12px; width: 48px; height: 48px; font-size: 1.3rem; }
  .cnc-weather-grid { grid-template-columns: repeat(3,1fr); }
  .cnc-btn-tip { display: none; }
  .cnc-tab { font-size: .7rem; padding: 10px 4px; }
}

/* =============================================
   v3.34 �?Dark mode overrides
   ============================================= */
[data-theme="dark"] .sp-ic-live { background: #064e3b !important; }
[data-theme="dark"] .sp-live-dot { background: #4ade80; }
[data-theme="dark"] .sp-live-dot::after { border-color: #4ade80; }
[data-theme="dark"] .sp-val-live { color: #4ade80 !important; }
[data-theme="dark"] .sp-live { background: linear-gradient(90deg, #064e3b 0%, transparent 100%); }
[data-theme="dark"] .sp-live + .sp-row { border-top-color: #064e3b; }
[data-theme="dark"] .sp-hot-badge { background: linear-gradient(135deg, #451a03, #78350f); border-color: #92400e; color: #fdba74; }
[data-theme="dark"] .bk-toast { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .bk-toast-txt { color: #e2e8f0; }
[data-theme="dark"] .bk-toast-time { color: #64748b; }
[data-theme="dark"] .bk-toast-close { color: #64748b; }
[data-theme="dark"] .bk-toast-close:hover { background: #334155; color: #e2e8f0; }

/* =============================================
   v3.34 �?Responsive
   ============================================= */
@media (max-width: 767px) {
  .bk-toast {
    left: 12px;
    right: 12px;
    bottom: 80px; /* Above mobile bottom nav */
    max-width: none;
  }
  .tc-trend { font-size: 0.65rem; padding: 3px 10px 3px 6px; }
}

/* =============================================
   v3.36 �?Travel Guide Hub (v2.64)
   ============================================= */

/* --- Guide Hero --- */
.gd-hero {
  position: relative;
  background: linear-gradient(135deg, #1a365d 0%, #2b6cb0 50%, #4299e1 100%);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 40px;
}
.gd-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('https://images.unsplash.com/photo-1508804185872-d7badad00f7d?w=1200&h=500&fit=crop') center/cover;
  opacity: 0.15;
  mix-blend-mode: overlay;
}
.gd-hero-inner {
  position: relative;
  padding: 60px 50px;
  text-align: center;
  z-index: 1;
}
.gd-hero-title {
  font-size: 2.2rem;
  font-weight: 800;
  color: #fff;
  margin: 0 0 14px;
  letter-spacing: -0.5px;
}
.gd-hero-sub {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.85);
  margin: 0 0 32px;
  max-width: 620px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.6;
}
.gd-hero-stats {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
}
.gd-stat {
  text-align: center;
  min-width: 100px;
}
.gd-stat-num {
  display: block;
  font-size: 2rem;
  font-weight: 800;
  color: #fbd38d;
  line-height: 1.2;
}
.gd-stat-lbl {
  display: block;
  font-size: 0.82rem;
  color: rgba(255,255,255,0.7);
  margin-top: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* --- Section Headers --- */
.gd-sec {
  margin-bottom: 44px;
}
.gd-sec-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.gd-sec-title i {
  color: #e53e3e;
  font-size: 1.3rem;
}
.gd-sec-desc {
  font-size: 0.95rem;
  color: var(--text-light);
  margin: 0 0 24px;
  line-height: 1.65;
}

/* --- Seasons Grid --- */
.gd-seasons {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.gd-season-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 24px 20px;
  text-align: center;
  transition: transform 0.2s, box-shadow 0.2s;
  position: relative;
  overflow: hidden;
}
.gd-season-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
}
.gd-season-card.gd-best { border-top: 3px solid #38a169; }
.gd-season-card.gd-good { border-top: 3px solid #d69e2e; }
.gd-season-card.gd-quiet { border-top: 3px solid #718096; }
.gd-season-icon { font-size: 2.5rem; margin-bottom: 8px; }
.gd-season-name { font-size: 1.15rem; font-weight: 700; color: var(--text-dark); margin: 0 0 4px; }
.gd-season-months { font-size: 0.82rem; color: var(--text-light); margin-bottom: 6px; }
.gd-season-temp { font-size: 0.9rem; font-weight: 600; color: var(--text-dark); margin-bottom: 10px; padding: 4px 12px; background: var(--g50); border-radius: 20px; display: inline-block; }
.gd-season-desc { font-size: 0.84rem; color: var(--text-mid); line-height: 1.55; margin: 0 0 12px; }
.gd-season-rating {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  padding: 3px 14px;
  border-radius: 20px;
}
.gd-best .gd-season-rating { background: #c6f6d5; color: #22543d; }
.gd-good .gd-season-rating { background: #fefcbf; color: #744210; }
.gd-quiet .gd-season-rating { background: #e2e8f0; color: #4a5568; }

/* --- Attractions Grid --- */
.gd-attractions {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.gd-att-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
}
.gd-att-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}
.gd-att-img-wrap {
  height: 140px;
  overflow: hidden;
  background: var(--g50);
}
.gd-att-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s;
}
.gd-att-card:hover .gd-att-img { transform: scale(1.08); }
.gd-att-body { padding: 14px 16px; }
.gd-att-name { font-size: 1rem; font-weight: 700; color: var(--text-dark); margin: 0 0 3px; }
.gd-att-sub { font-size: 0.78rem; color: var(--accent); font-weight: 600; display: block; margin-bottom: 8px; }
.gd-att-tip {
  font-size: 0.8rem;
  color: var(--text-mid);
  line-height: 1.5;
  margin: 0;
  padding: 8px 10px;
  background: var(--g50);
  border-radius: 8px;
}
.gd-att-tip i { color: #d69e2e; font-size: 0.75rem; }

/* --- Transport --- */
.gd-transport {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.gd-trans-card {
  display: flex;
  gap: 16px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  transition: box-shadow 0.2s;
}
.gd-trans-card:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.06); }
.gd-trans-icon {
  font-size: 2.2rem;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--g50);
  border-radius: 12px;
  flex-shrink: 0;
}
.gd-trans-body { flex: 1; }
.gd-trans-name { font-size: 1.05rem; font-weight: 700; color: var(--text-dark); margin: 0 0 6px; }
.gd-trans-desc { font-size: 0.88rem; color: var(--text-mid); line-height: 1.55; margin: 0 0 8px; }
.gd-trans-tip {
  font-size: 0.8rem;
  color: #2b6cb0;
  background: #ebf8ff;
  padding: 4px 12px;
  border-radius: 6px;
  display: inline-block;
}
.gd-trans-tip i { margin-right: 4px; }

/* --- Food --- */
.gd-food {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.gd-food-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  transition: box-shadow 0.2s;
}
.gd-food-card:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.06); }
.gd-food-hdr {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
.gd-food-name { font-size: 1.05rem; font-weight: 700; color: var(--text-dark); margin: 0; }
.gd-food-price {
  font-size: 0.8rem;
  font-weight: 600;
  color: #e53e3e;
  background: #fff5f5;
  padding: 2px 10px;
  border-radius: 20px;
  white-space: nowrap;
}
.gd-food-en {
  font-size: 0.82rem;
  color: var(--accent);
  font-style: italic;
  margin-bottom: 10px;
}
.gd-food-desc { font-size: 0.86rem; color: var(--text-mid); line-height: 1.55; margin: 0 0 12px; }
.gd-food-where {
  font-size: 0.78rem;
  color: #2b6cb0;
  background: var(--g50);
  padding: 6px 10px;
  border-radius: 6px;
}
.gd-food-where i { margin-right: 4px; color: #e53e3e; }

/* --- Shopping --- */
.gd-shop {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.gd-shop-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  transition: box-shadow 0.2s;
}
.gd-shop-card:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.06); }
.gd-shop-name { font-size: 1.05rem; font-weight: 700; color: var(--text-dark); margin: 0 0 3px; }
.gd-shop-sub {
  font-size: 0.8rem;
  color: var(--accent);
  font-weight: 600;
  display: block;
  margin-bottom: 10px;
}
.gd-shop-desc { font-size: 0.86rem; color: var(--text-mid); line-height: 1.55; margin: 0 0 12px; }
.gd-shop-tip {
  font-size: 0.8rem;
  color: #744210;
  background: #fffff0;
  padding: 6px 10px;
  border-radius: 6px;
  border-left: 3px solid #d69e2e;
}
.gd-shop-tip i { color: #d69e2e; margin-right: 4px; }

/* --- Cultural Tips --- */
.gd-culture {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.gd-culture-card {
  display: flex;
  gap: 14px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 18px;
  transition: box-shadow 0.2s;
}
.gd-culture-card:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.06); }
.gd-culture-icon {
  font-size: 1.8rem;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--g50);
  border-radius: 12px;
  flex-shrink: 0;
}
.gd-culture-body { flex: 1; }
.gd-culture-title { font-size: 0.95rem; font-weight: 700; color: var(--text-dark); margin: 0 0 5px; }
.gd-culture-desc { font-size: 0.84rem; color: var(--text-mid); line-height: 1.55; margin: 0; }

/* --- Itineraries --- */
.gd-itins {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.gd-itin-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 24px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.gd-itin-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
}
.gd-itin-title {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--text-dark);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid #e53e3e;
}
.gd-itin-day {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
  align-items: flex-start;
}
.gd-itin-dlbl {
  font-size: 0.75rem;
  font-weight: 700;
  color: #fff;
  background: #e53e3e;
  padding: 2px 10px;
  border-radius: 4px;
  white-space: nowrap;
  flex-shrink: 0;
}
.gd-itin-desc {
  font-size: 0.84rem;
  color: var(--text-mid);
  line-height: 1.5;
}
.gd-itin-cta {
  display: block;
  text-align: center;
  margin-top: 16px;
  padding: 10px;
  font-size: 0.85rem;
  font-weight: 600;
  color: #e53e3e;
  text-decoration: none;
  border: 1px solid #e53e3e;
  border-radius: 8px;
  transition: background 0.2s, color 0.2s;
}
.gd-itin-cta:hover { background: #e53e3e; color: #fff; }
.gd-itin-cta i { margin-left: 6px; transition: transform 0.2s; }
.gd-itin-cta:hover i { transform: translateX(4px); }

/* --- Dark Mode Overrides --- */
[data-theme="dark"] .gd-hero { background: linear-gradient(135deg, #0f1b2d 0%, #1a365d 50%, #2b6cb0 100%); }
[data-theme="dark"] .gd-hero-inner { }
[data-theme="dark"] .gd-hero-title { color: #f7fafc; }
[data-theme="dark"] .gd-hero-sub { color: rgba(255,255,255,0.7); }
[data-theme="dark"] .gd-stat-num { color: #fbd38d; }
[data-theme="dark"] .gd-stat-lbl { color: rgba(255,255,255,0.5); }
[data-theme="dark"] .gd-season-card { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gd-season-card:hover { box-shadow: 0 8px 25px rgba(0,0,0,0.3); }
[data-theme="dark"] .gd-season-name { color: #e2e8f0; }
[data-theme="dark"] .gd-season-temp { color: #e2e8f0; background: #334155; }
[data-theme="dark"] .gd-best .gd-season-rating { background: #1a4731; color: #68d391; }
[data-theme="dark"] .gd-good .gd-season-rating { background: #5c4710; color: #faf089; }
[data-theme="dark"] .gd-quiet .gd-season-rating { background: #2d3748; color: #a0aec0; }
[data-theme="dark"] .gd-att-card { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gd-att-card:hover { box-shadow: 0 8px 25px rgba(0,0,0,0.3); }
[data-theme="dark"] .gd-att-name { color: #e2e8f0; }
[data-theme="dark"] .gd-att-tip { background: #334155; }
[data-theme="dark"] .gd-trans-card { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gd-trans-icon { background: #334155; }
[data-theme="dark"] .gd-trans-name { color: #e2e8f0; }
[data-theme="dark"] .gd-trans-tip { background: #1a365d; color: #90cdf4; }
[data-theme="dark"] .gd-food-card { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gd-food-name { color: #e2e8f0; }
[data-theme="dark"] .gd-food-price { background: #4a1a1a; color: #fc8181; }
[data-theme="dark"] .gd-food-where { background: #334155; color: #90cdf4; }
[data-theme="dark"] .gd-shop-card { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gd-shop-name { color: #e2e8f0; }
[data-theme="dark"] .gd-shop-tip { background: #3d3100; color: #faf089; border-left-color: #d69e2e; }
[data-theme="dark"] .gd-culture-card { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gd-culture-icon { background: #334155; }
[data-theme="dark"] .gd-culture-title { color: #e2e8f0; }
[data-theme="dark"] .gd-itin-card { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gd-itin-card:hover { box-shadow: 0 8px 25px rgba(0,0,0,0.3); }
[data-theme="dark"] .gd-itin-title { color: #e2e8f0; }
[data-theme="dark"] .gd-itin-cta { color: #fc8181; border-color: #fc8181; }
[data-theme="dark"] .gd-itin-cta:hover { background: #fc8181; color: #1a202c; }

/* --- Responsive --- */
@media (max-width: 1024px) {
  .gd-seasons { grid-template-columns: repeat(2, 1fr); }
  .gd-attractions { grid-template-columns: repeat(2, 1fr); }
  .gd-food { grid-template-columns: repeat(2, 1fr); }
  .gd-shop { grid-template-columns: repeat(2, 1fr); }
  .gd-itins { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
  .gd-hero-inner { padding: 36px 20px; }
  .gd-hero-title { font-size: 1.5rem; }
  .gd-hero-sub { font-size: 0.92rem; }
  .gd-hero-stats { gap: 16px; }
  .gd-stat-num { font-size: 1.5rem; }
  .gd-stat-lbl { font-size: 0.7rem; }

  .gd-seasons { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .gd-season-card { padding: 16px 14px; }
  .gd-season-icon { font-size: 2rem; }

  .gd-attractions { grid-template-columns: 1fr; }
  .gd-food { grid-template-columns: 1fr; }
  .gd-shop { grid-template-columns: 1fr; }
  .gd-culture { grid-template-columns: 1fr; }
  .gd-itins { grid-template-columns: 1fr; }

  .gd-trans-card { padding: 14px; }
  .gd-trans-icon { width: 44px; height: 44px; font-size: 1.6rem; }

  .gd-sec-title { font-size: 1.25rem; }
  .gd-itin-card { padding: 18px; }
}

/* ================================================================
   v3.37: Photo Gallery / Visual Journey
   ================================================================ */

/* ----- Gallery Hero ----- */
.gl-hero {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 28px;
  position: relative;
}
.gl-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('https://images.unsplash.com/photo-1508804185872-d7badad00f7d?w=1200&q=60') center/cover;
  opacity: 0.25;
}
.gl-hero-inner {
  position: relative;
  padding: 48px 40px;
  text-align: center;
  color: #fff;
}
.gl-hero-title {
  font-size: 2rem;
  font-weight: 800;
  margin: 0 0 10px;
  letter-spacing: -0.02em;
}
.gl-hero-sub {
  font-size: 1.05rem;
  opacity: 0.85;
  max-width: 560px;
  margin: 0 auto 28px;
  line-height: 1.6;
}
.gl-hero-stats {
  display: flex;
  justify-content: center;
  gap: 40px;
}
.gl-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.gl-stat-num {
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
}
.gl-stat-lbl {
  font-size: 0.8rem;
  opacity: 0.7;
  margin-top: 4px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

/* ----- Filter Bar ----- */
.gl-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
  justify-content: center;
}
.gl-filter-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 16px;
  border: 1.5px solid var(--border);
  border-radius: 24px;
  background: var(--bg-card);
  color: var(--text);
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
}
.gl-filter-btn:hover {
  border-color: #e53e3e;
  color: #e53e3e;
}
.gl-filter-btn.active {
  background: #e53e3e;
  border-color: #e53e3e;
  color: #fff;
}
.gl-filter-btn i { font-size: 0.8rem; }

/* ----- Gallery Grid (Masonry-style) ----- */
.gl-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  grid-auto-rows: 220px;
  grid-auto-flow: dense;
}
.gl-card {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  background: var(--bg-card);
  transition: transform 0.3s, box-shadow 0.3s;
}
.gl-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.18);
}
.gl-card:nth-child(5n+1),
.gl-card:nth-child(5n+4) { grid-row: span 2; }
.gl-card:nth-child(7n+3) { grid-row: span 1; }

.gl-card-img {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.gl-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s;
}
.gl-card:hover .gl-img { transform: scale(1.08); }

.gl-card-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(0,0,0,0.75));
  padding: 40px 16px 14px;
  color: #fff;
  font-size: 0.9rem;
  font-weight: 600;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.3s, transform 0.3s;
}
.gl-card:hover .gl-card-overlay {
  opacity: 1;
  transform: translateY(0);
}
.gl-card-loc {
  display: block;
  font-size: 0.72rem;
  font-weight: 400;
  opacity: 0.8;
  margin-top: 3px;
}

/* ----- Lightbox ----- */
.gl-lb {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0,0,0,0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s;
}
.gl-lb.on { opacity: 1; }

.gl-lb-close {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 10;
  background: rgba(255,255,255,0.15);
  border: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  color: #fff;
  font-size: 1.2rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.gl-lb-close:hover { background: rgba(255,255,255,0.25); }

.gl-lb-prev,
.gl-lb-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: rgba(255,255,255,0.12);
  border: none;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  color: #fff;
  font-size: 1.1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.gl-lb-prev { left: 20px; }
.gl-lb-next { right: 20px; }
.gl-lb-prev:hover,
.gl-lb-next:hover { background: rgba(255,255,255,0.25); }

.gl-lb-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 90vw;
  max-height: 90vh;
  gap: 16px;
}
.gl-lb-img {
  max-width: 90vw;
  max-height: 65vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}
.gl-lb-info {
  text-align: center;
  color: #fff;
}
.gl-lb-title {
  font-size: 1.4rem;
  font-weight: 700;
  margin: 0 0 6px;
}
.gl-lb-loc {
  font-size: 0.9rem;
  opacity: 0.7;
  margin: 0 0 16px;
}
.gl-lb-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}
.gl-lb-counter {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255,255,255,0.6);
  font-size: 0.85rem;
  font-weight: 500;
}

/* ----- Gallery Responsive ----- */
@media (max-width: 1023px) {
  .gl-grid { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 200px; }
}
@media (max-width: 767px) {
  .gl-hero-inner { padding: 36px 20px; }
  .gl-hero-title { font-size: 1.5rem; }
  .gl-hero-sub { font-size: 0.92rem; }
  .gl-hero-stats { gap: 20px; }
  .gl-stat-num { font-size: 1.5rem; }
  .gl-stat-lbl { font-size: 0.72rem; }
  .gl-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 180px; gap: 10px; }
  .gl-card:nth-child(5n+1),
  .gl-card:nth-child(5n+4) { grid-row: span 2; }
  .gl-card:nth-child(7n+3) { grid-row: span 1; }
  .gl-filter-btn { padding: 6px 12px; font-size: 0.78rem; }
  .gl-lb-prev { left: 10px; }
  .gl-lb-next { right: 10px; }
  .gl-lb-prev,
  .gl-lb-next { width: 38px; height: 38px; }
  .gl-lb-title { font-size: 1.1rem; }
}
@media (max-width: 480px) {
  .gl-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 160px; gap: 8px; }
  .gl-card:nth-child(5n+1),
  .gl-card:nth-child(5n+4),
  .gl-card:nth-child(7n+3) { grid-row: span 1; }
  .gl-hero-stats { gap: 16px; }
}

/* ----- Gallery Dark Mode ----- */
[data-theme="dark"] .gl-hero {
  background: linear-gradient(135deg, #0a0a14 0%, #0d1a2d 50%, #0a1e3d 100%);
}
[data-theme="dark"] .gl-filter-btn {
  background: #1e1e2e;
  border-color: #2a2a3e;
  color: #c4c4d4;
}
[data-theme="dark"] .gl-filter-btn:hover {
  border-color: #e53e3e;
  color: #e53e3e;
}
[data-theme="dark"] .gl-card { background: #1e1e2e; }
[data-theme="dark"] .gl-lb { background: rgba(0,0,0,0.96); }

/* ================================================================
   v2.66 — Events & Festivals Calendar
   ================================================================ */

/* --- Events Hero --- */
.ev-hero {
  background: linear-gradient(135deg, #c0392b 0%, #e74c3c 30%, #f39c12 70%, #e67e22 100%);
  border-radius: 20px;
  padding: 56px 40px;
  margin-bottom: 32px;
  position: relative;
  overflow: hidden;
  color: #fff;
  text-align: center;
}
.ev-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: url('https://images.unsplash.com/photo-1547981609-4b6bfe67ca0b?w=1200&q=80') center/cover;
  opacity: 0.15;
  pointer-events: none;
}
.ev-hero-inner { position: relative; z-index: 1; }
.ev-hero-title { font-size: 2.4rem; font-weight: 800; margin: 0 0 12px; letter-spacing: -0.5px; }
.ev-hero-sub { font-size: 1.1rem; opacity: 0.92; margin: 0 0 24px; max-width: 600px; margin-left: auto; margin-right: auto; }
.ev-hero-stats { display: flex; justify-content: center; gap: 48px; margin-top: 28px; }
.ev-stat { text-align: center; }
.ev-stat-num { display: block; font-size: 2rem; font-weight: 800; letter-spacing: -1px; }
.ev-stat-lbl { display: block; font-size: .85rem; opacity: 0.85; margin-top: 2px; text-transform: uppercase; letter-spacing: 1px; }

/* --- Month Filter Bar --- */
.ev-filter-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 32px;
  position: sticky;
  top: 68px;
  z-index: 10;
  background: var(--bg, #f8f9fa);
  padding: 12px 0;
}
.ev-filter-btn {
  border: 2px solid #e0e0e0;
  background: #fff;
  color: #555;
  padding: 8px 18px;
  border-radius: 24px;
  cursor: pointer;
  font-size: .88rem;
  font-weight: 600;
  transition: all .2s;
  white-space: nowrap;
}
.ev-filter-btn:hover { border-color: #e74c3c; color: #e74c3c; }
.ev-filter-btn.active { background: #e74c3c; border-color: #e74c3c; color: #fff; }

/* --- Events Grid --- */
.ev-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 24px;
}

/* --- Event Card --- */
.ev-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(0,0,0,0.07);
  transition: transform .25s, box-shadow .25s;
  cursor: pointer;
  position: relative;
  display: flex;
  flex-direction: column;
}
.ev-card:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(0,0,0,0.12); }

/* Date Badge */
.ev-date-badge {
  background: linear-gradient(135deg, #e74c3c, #c0392b);
  color: #fff;
  padding: 14px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ev-date-month { font-size: 1.1rem; font-weight: 800; letter-spacing: 2px; }
.ev-date-emoji { font-size: 1.4rem; }

/* Type Badge */
.ev-type-badge {
  position: absolute;
  top: 56px;
  right: 12px;
  padding: 4px 12px;
  border-radius: 12px;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  z-index: 2;
}
.ev-type-festival { background: #fde8e8; color: #c0392b; }
.ev-type-event { background: #e8f0fe; color: #1a73e8; }
.ev-type-seasonal { background: #e8f5e9; color: #2e7d32; }

/* Body */
.ev-body { padding: 20px 20px 16px; flex: 1; display: flex; flex-direction: column; }
.ev-name { font-size: 1.15rem; font-weight: 700; color: #111; margin: 0 0 8px; line-height: 1.4; }
.ev-name-zh { color: #e74c3c; font-weight: 600; }
.ev-date { font-size: .82rem; color: #888; margin-bottom: 10px; display: flex; align-items: center; gap: 4px; }
.ev-desc { font-size: .9rem; color: #666; line-height: 1.55; margin: 0; flex: 1; }
.ev-action { margin-top: 14px; padding-top: 12px; border-top: 1px solid #f0f0f0; }
.ev-learn-more { font-size: .85rem; font-weight: 600; color: #e74c3c; display: inline-flex; align-items: center; gap: 6px; transition: gap .2s; }
.ev-card:hover .ev-learn-more { gap: 10px; }

/* Highlight Card */
.ev-highlight { border: 2px solid #e74c3c; }
.ev-highlight .ev-date-badge { background: linear-gradient(135deg, #c0392b, #8e1a1a); }

/* --- Empty State --- */
.ev-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 64px 20px;
  color: #999;
}
.ev-empty p { font-size: 1.1rem; margin: 8px 0; }

/* --- Detail Modal --- */
.ev-detail-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  transition: opacity .3s;
  backdrop-filter: blur(4px);
}
.ev-detail-overlay.on { opacity: 1; }

.ev-detail-modal {
  background: #fff;
  border-radius: 20px;
  max-width: 620px;
  width: 100%;
  max-height: 85vh;
  overflow-y: auto;
  position: relative;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  transform: translateY(20px);
  transition: transform .3s;
}
.ev-detail-overlay.on .ev-detail-modal { transform: translateY(0); }

.ev-detail-header {
  background: linear-gradient(135deg, #c0392b, #e74c3c);
  color: #fff;
  padding: 32px 28px;
  border-radius: 20px 20px 0 0;
  text-align: center;
}
.ev-detail-emoji { font-size: 2.5rem; display: block; margin-bottom: 8px; }
.ev-detail-header h2 { font-size: 1.5rem; margin: 0; font-weight: 800; }
.ev-detail-header .ev-name-zh { color: rgba(255,255,255,0.85); font-size: 1rem; display: block; margin-bottom: 4px; }

.ev-detail-meta {
  padding: 16px 28px;
  display: flex;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid #f0f0f0;
  font-size: .88rem;
  color: #666;
  flex-wrap: wrap;
}

.ev-detail-section { padding: 20px 28px; }
.ev-detail-section + .ev-detail-section { border-top: 1px solid #f5f5f5; }
.ev-detail-section h4 { font-size: 1rem; font-weight: 700; color: #111; margin: 0 0 12px; display: flex; align-items: center; gap: 8px; }
.ev-detail-section p { font-size: .92rem; color: #555; line-height: 1.7; margin: 0; }

.ev-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.ev-tag {
  display: inline-block;
  padding: 6px 14px;
  background: #fef3f2;
  color: #c0392b;
  border-radius: 16px;
  font-size: .82rem;
  font-weight: 500;
}

.ev-detail-cta {
  padding: 24px 28px;
  text-align: center;
  background: #fafafa;
  border-radius: 0 0 20px 20px;
  border-top: 1px solid #f0f0f0;
}
.ev-detail-cta p { font-size: .9rem; color: #777; margin: 0 0 16px; }

.ev-detail-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.25);
  color: #fff;
  font-size: 1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .2s;
}
.ev-detail-close:hover { background: rgba(255,255,255,0.4); }

/* --- Responsive --- */
@media (max-width: 1023px) {
  .ev-hero { padding: 40px 24px; }
  .ev-hero-title { font-size: 1.8rem; }
  .ev-hero-stats { gap: 24px; }
  .ev-stat-num { font-size: 1.5rem; }
  .ev-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
  .ev-filter-bar { top: 56px; padding: 10px 0; }
}

@media (max-width: 767px) {
  .ev-hero { padding: 32px 16px; border-radius: 12px; }
  .ev-hero-title { font-size: 1.4rem; }
  .ev-hero-sub { font-size: .9rem; }
  .ev-hero-stats { gap: 16px; }
  .ev-stat-num { font-size: 1.2rem; }
  .ev-grid { grid-template-columns: 1fr; gap: 14px; }
  .ev-filter-bar { top: 48px; gap: 6px; }
  .ev-filter-btn { padding: 6px 12px; font-size: .78rem; }
  .ev-card { border-radius: 12px; }
  .ev-detail-modal { max-height: 90vh; border-radius: 16px; }
  .ev-detail-header { padding: 24px 20px; border-radius: 16px 16px 0 0; }
  .ev-detail-meta { padding: 12px 20px; }
  .ev-detail-section { padding: 16px 20px; }
  .ev-detail-cta { padding: 20px; border-radius: 0 0 16px 16px; }
}

/* --- Dark Mode --- */
[data-theme="dark"] .ev-hero { background: linear-gradient(135deg, #8b1a1a, #a83232, #c07020, #cc7722); }
[data-theme="dark"] .ev-filter-bar { background: var(--bg, #1a1a2e); }
[data-theme="dark"] .ev-filter-btn { background: #1e1e2e; border-color: #2a2a3e; color: #aaa; }
[data-theme="dark"] .ev-filter-btn:hover { border-color: #e74c3c; color: #e74c3c; }
[data-theme="dark"] .ev-filter-btn.active { background: #e74c3c; border-color: #e74c3c; color: #fff; }
[data-theme="dark"] .ev-card { background: #1e1e2e; box-shadow: 0 2px 16px rgba(0,0,0,0.2); }
[data-theme="dark"] .ev-name { color: #e4e4e4; }
[data-theme="dark"] .ev-desc { color: #aaa; }
[data-theme="dark"] .ev-action { border-color: #2a2a3e; }
[data-theme="dark"] .ev-type-festival { background: #3d1a1a; color: #e74c3c; }
[data-theme="dark"] .ev-type-event { background: #1a2a3d; color: #5a9cf5; }
[data-theme="dark"] .ev-type-seasonal { background: #1a3d1a; color: #5ac85a; }
[data-theme="dark"] .ev-detail-modal { background: #1e1e2e; }
[data-theme="dark"] .ev-detail-header { background: linear-gradient(135deg, #8b1a1a, #a83232); }
[data-theme="dark"] .ev-detail-meta { border-color: #2a2a3e; color: #aaa; }
[data-theme="dark"] .ev-detail-section { border-color: #2a2a3e; }
[data-theme="dark"] .ev-detail-section h4 { color: #e4e4e4; }
[data-theme="dark"] .ev-detail-section p { color: #aaa; }
[data-theme="dark"] .ev-tag { background: #3d1a1a; color: #e74c3c; }
[data-theme="dark"] .ev-detail-cta { background: #16162a; border-color: #2a2a3e; }
[data-theme="dark"] .ev-detail-cta p { color: #888; }

/* ================================================================
   v2.67 — Beijing Destination Explorer
   ================================================================ */
/* Hero */
.ds-hero { position: relative; overflow: hidden; border-radius: 20px; margin-bottom: 24px; min-height: 260px; display: flex; align-items: center; background: linear-gradient(135deg, #1a3a5c, #2c5f8a, #1a5c3a, #3a7d44); }
.ds-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.25; }
.ds-hero-inner { position: relative; z-index: 1; padding: 48px 40px; width: 100%; }
.ds-hero-title { font-size: 2rem; font-weight: 800; color: #fff; margin: 0 0 8px; text-shadow: 0 2px 8px rgba(0,0,0,0.3); }
.ds-hero-sub { font-size: 1rem; color: rgba(255,255,255,0.85); margin: 0 0 20px; max-width: 600px; }
.ds-hero-stats { display: flex; gap: 32px; flex-wrap: wrap; }
.ds-stat { display: flex; flex-direction: column; gap: 2px; }
.ds-stat-num { font-size: 1.5rem; font-weight: 700; color: #ffd700; }
.ds-stat-lbl { font-size: .82rem; color: rgba(255,255,255,0.7); text-transform: uppercase; letter-spacing: .5px; }

/* Filter Bar */
.ds-filter-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; position: sticky; top: 72px; z-index: 10; padding: 10px 0; background: var(--bg, #f8f9fb); }
.ds-filter-btn { padding: 8px 18px; border: 1.5px solid #dde; border-radius: 24px; background: #fff; color: #555; font-size: .85rem; font-weight: 500; cursor: pointer; transition: all .2s; white-space: nowrap; display: flex; align-items: center; gap: 6px; }
.ds-filter-btn:hover { border-color: #1a5c3a; color: #1a5c3a; }
.ds-filter-btn.active { background: #1a5c3a; border-color: #1a5c3a; color: #fff; }
.ds-filter-btn i { font-size: .8rem; }

/* Card Grid */
.ds-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; }
.ds-card { background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 2px 16px rgba(0,0,0,0.07); transition: transform .25s, box-shadow .25s; cursor: pointer; }
.ds-card:hover { transform: translateY(-4px); box-shadow: 0 8px 28px rgba(0,0,0,0.12); }
.ds-card-img-wrap { position: relative; height: 200px; overflow: hidden; }
.ds-card-img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.ds-card:hover .ds-card-img { transform: scale(1.06); }
.ds-card-badge { position: absolute; top: 12px; right: 12px; background: rgba(26,92,58,0.9); color: #fff; font-size: .75rem; font-weight: 600; padding: 4px 12px; border-radius: 12px; display: flex; align-items: center; gap: 4px; }
.ds-card-rating { position: absolute; bottom: 12px; left: 12px; background: rgba(0,0,0,0.7); color: #ffd700; font-size: .8rem; font-weight: 600; padding: 4px 10px; border-radius: 8px; }
.ds-card-body { padding: 16px 18px; }
.ds-card-name { font-size: 1.05rem; font-weight: 700; color: #222; margin: 0 0 4px; }
.ds-card-name-zh { color: #d35400; font-size: .85rem; font-weight: 500; }
.ds-card-loc { font-size: .8rem; color: #888; margin: 4px 0 8px; display: flex; align-items: center; gap: 4px; }
.ds-card-facts { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.ds-card-fact { font-size: .75rem; color: #666; display: flex; align-items: center; gap: 3px; background: #f0f4f8; padding: 3px 10px; border-radius: 12px; }
.ds-card-arrow { margin-top: 10px; font-size: .8rem; color: #1a5c3a; font-weight: 600; display: flex; align-items: center; gap: 4px; }

/* Detail Modal */
.ds-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 1001; display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; transition: opacity .3s; }
.ds-overlay.on { opacity: 1; }
.ds-modal { background: #fff; border-radius: 20px; max-width: 680px; width: 100%; max-height: 88vh; overflow-y: auto; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,0.25); }
.ds-modal-header { position: relative; height: 220px; overflow: hidden; border-radius: 20px 20px 0 0; }
.ds-modal-header img { width: 100%; height: 100%; object-fit: cover; }
.ds-modal-header-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.75), rgba(0,0,0,0.15)); display: flex; flex-direction: column; justify-content: flex-end; padding: 24px; }
.ds-modal-header-overlay h2 { color: #fff; font-size: 1.4rem; font-weight: 700; margin: 0 0 4px; text-shadow: 0 1px 4px rgba(0,0,0,0.4); }
.ds-modal-header-overlay .ds-mh-zh { color: #ffd700; font-size: .9rem; font-weight: 500; }
.ds-modal-meta { display: flex; gap: 16px; flex-wrap: wrap; padding: 16px 24px; border-bottom: 1px solid #eee; }
.ds-modal-meta-item { display: flex; align-items: center; gap: 5px; font-size: .82rem; color: #666; }
.ds-modal-meta-item i { color: #1a5c3a; width: 16px; text-align: center; }
.ds-modal-section { padding: 20px 24px; border-bottom: 1px solid #eee; }
.ds-modal-section:last-of-type { border-bottom: none; }
.ds-modal-section h4 { font-size: 1rem; font-weight: 700; color: #222; margin: 0 0 10px; display: flex; align-items: center; gap: 6px; }
.ds-modal-section h4 i { color: #1a5c3a; }
.ds-modal-section p { color: #555; font-size: .9rem; line-height: 1.7; margin: 0; }
.ds-qf-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin-top: 8px; }
.ds-qf-item { background: #f0f7f4; border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 2px; }
.ds-qf-item .ds-qf-label { font-size: .7rem; color: #888; text-transform: uppercase; letter-spacing: .5px; }
.ds-qf-item .ds-qf-val { font-size: .9rem; font-weight: 600; color: #1a5c3a; }
.ds-tips-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.ds-tips-list li { font-size: .88rem; color: #555; padding: 8px 12px; background: #fdf8f0; border-left: 3px solid #d35400; border-radius: 0 8px 8px 0; line-height: 1.5; display: flex; align-items: flex-start; gap: 8px; }
.ds-tips-list li i { color: #d35400; margin-top: 3px; flex-shrink: 0; }
.ds-modal-gallery { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.ds-modal-gallery::-webkit-scrollbar { height: 4px; }
.ds-modal-gallery::-webkit-scrollbar-thumb { background: #ccc; border-radius: 4px; }
.ds-modal-gallery img { width: 140px; height: 100px; object-fit: cover; border-radius: 10px; flex-shrink: 0; scroll-snap-align: start; }
.ds-modal-cta { padding: 20px 24px; background: #f8f9fb; border-radius: 0 0 20px 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ds-modal-cta p { font-size: .85rem; color: #666; margin: 0; }
.ds-cta-btn { background: #1a5c3a; color: #fff; border: none; padding: 10px 28px; border-radius: 8px; font-weight: 600; font-size: .9rem; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; transition: background .2s; }
.ds-cta-btn:hover { background: #145230; }
.ds-modal-close { position: absolute; top: 16px; right: 16px; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.2); backdrop-filter: blur(4px); border: none; color: #fff; font-size: 1rem; cursor: pointer; z-index: 2; display: flex; align-items: center; justify-content: center; transition: background .2s; }
.ds-modal-close:hover { background: rgba(255,255,255,0.35); }

/* Dark Mode */
[data-theme="dark"] .ds-hero { background: linear-gradient(135deg, #0d1f33, #1a3a5c, #0d3320, #1a4d2a); }
[data-theme="dark"] .ds-filter-bar { background: var(--bg, #1a1a2e); }
[data-theme="dark"] .ds-filter-btn { background: #1e1e2e; border-color: #2a2a3e; color: #aaa; }
[data-theme="dark"] .ds-filter-btn:hover { border-color: #2ecc71; color: #2ecc71; }
[data-theme="dark"] .ds-filter-btn.active { background: #1a5c3a; border-color: #1a5c3a; color: #fff; }
[data-theme="dark"] .ds-card { background: #1e1e2e; box-shadow: 0 2px 16px rgba(0,0,0,0.2); }
[data-theme="dark"] .ds-card-name { color: #e4e4e4; }
[data-theme="dark"] .ds-card-fact { background: #252540; color: #aaa; }
[data-theme="dark"] .ds-modal { background: #1e1e2e; }
[data-theme="dark"] .ds-modal-meta { border-color: #2a2a3e; }
[data-theme="dark"] .ds-modal-meta-item { color: #aaa; }
[data-theme="dark"] .ds-modal-section { border-color: #2a2a3e; }
[data-theme="dark"] .ds-modal-section h4 { color: #e4e4e4; }
[data-theme="dark"] .ds-modal-section p { color: #aaa; }
[data-theme="dark"] .ds-qf-item { background: #252540; }
[data-theme="dark"] .ds-qf-item .ds-qf-val { color: #2ecc71; }
[data-theme="dark"] .ds-tips-list li { background: #2a2018; color: #aaa; }
[data-theme="dark"] .ds-modal-cta { background: #16162a; border-color: #2a2a3e; }
[data-theme="dark"] .ds-modal-cta p { color: #888; }

/* Responsive */
@media (max-width: 1023px) {
  .ds-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
  .ds-hero-inner { padding: 36px 28px; }
  .ds-hero-title { font-size: 1.6rem; }
}
@media (max-width: 767px) {
  .ds-hero { border-radius: 12px; min-height: 200px; }
  .ds-hero-inner { padding: 28px 18px; }
  .ds-hero-title { font-size: 1.35rem; }
  .ds-hero-sub { font-size: .85rem; }
  .ds-hero-stats { gap: 18px; }
  .ds-stat-num { font-size: 1.2rem; }
  .ds-grid { grid-template-columns: 1fr; gap: 14px; }
  .ds-filter-bar { top: 48px; gap: 6px; }
  .ds-filter-btn { padding: 6px 12px; font-size: .78rem; }
  .ds-card { border-radius: 12px; }
  .ds-card-img-wrap { height: 160px; }
  .ds-modal { max-height: 90vh; border-radius: 16px; }
  .ds-modal-header { height: 180px; border-radius: 16px 16px 0 0; }
  .ds-modal-header-overlay h2 { font-size: 1.15rem; }
  .ds-modal-meta { padding: 12px 16px; gap: 10px; }
  .ds-modal-section { padding: 16px; }
  .ds-modal-cta { padding: 16px; border-radius: 0 0 16px 16px; flex-direction: column; text-align: center; }
  .ds-qf-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ================================================================
   v3.40: Beijing Food & Culinary Journey (v2.68)
   ================================================================ */

/* Hero */
.fd-hero { position: relative; border-radius: 16px; overflow: hidden; min-height: 260px; margin-bottom: 20px; }
.fd-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fd-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(192,57,43,0.85), rgba(230,126,34,0.7)); }
.fd-hero-inner { position: relative; z-index: 1; padding: 48px 40px; color: #fff; }
.fd-hero-title { font-size: 1.9rem; font-weight: 800; margin: 0 0 8px; }
.fd-hero-sub { font-size: .95rem; opacity: .9; max-width: 600px; margin: 0 0 20px; }
.fd-hero-stats { display: flex; gap: 32px; }
.fd-stat { text-align: center; }
.fd-stat-num { display: block; font-size: 1.45rem; font-weight: 800; }
.fd-stat-lbl { display: block; font-size: .75rem; opacity: .8; }

/* Filter Bar */
.fd-filter-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; position: sticky; top: 60px; z-index: 10; padding: 8px 0; background: var(--white); }
.fd-filter-btn { border: 2px solid #e0e0e0; padding: 8px 16px; border-radius: 50px; cursor: pointer; font-size: .82rem; font-family: inherit; background: var(--white); color: #555; transition: all .2s; white-space: nowrap; }
.fd-filter-btn:hover { border-color: #e74c3c; color: #e74c3c; }
.fd-filter-btn.active { background: #e74c3c; color: #fff; border-color: #e74c3c; }

/* Card Grid */
.fd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.fd-card { background: var(--white); border-radius: 14px; overflow: hidden; box-shadow: 0 2px 12px rgba(0,0,0,.08); cursor: pointer; transition: all .25s; }
.fd-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,.14); }
.fd-card-img-wrap { position: relative; height: 200px; overflow: hidden; }
.fd-card-img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.fd-card:hover .fd-card-img { transform: scale(1.06); }
.fd-card-stars { position: absolute; top: 12px; right: 12px; display: flex; gap: 2px; }
.fd-card-stars i { color: #f39c12; font-size: .75rem; filter: drop-shadow(0 1px 2px rgba(0,0,0,.3)); }
.fd-card-stars i.far { color: rgba(255,255,255,.6); }
.fd-card-badge { position: absolute; top: 12px; left: 12px; background: rgba(0,0,0,.6); color: #fff; padding: 4px 10px; border-radius: 20px; font-size: .72rem; backdrop-filter: blur(4px); }
.fd-card-body { padding: 14px 16px 16px; }
.fd-card-name { font-size: 1.05rem; font-weight: 700; color: #222; margin-bottom: 2px; }
.fd-card-name-zh { font-size: .8rem; color: #e74c3c; font-weight: 600; display: block; margin-bottom: 6px; }
.fd-card-desc { font-size: .8rem; color: #777; line-height: 1.5; margin-bottom: 10px; }
.fd-card-price { font-size: .85rem; color: #e74c3c; font-weight: 700; }
.fd-card-price-label { color: #e74c3c; margin-right: 2px; }

/* Detail Modal */
.fd-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.65); z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; transition: opacity .3s; }
.fd-overlay.on { opacity: 1; }
.fd-modal { background: var(--white); border-radius: 18px; max-width: 620px; width: 100%; max-height: 85vh; overflow-y: auto; position: relative; box-shadow: 0 20px 50px rgba(0,0,0,.3); }
.fd-modal-header { position: relative; height: 220px; overflow: hidden; border-radius: 18px 18px 0 0; }
.fd-modal-header img { width: 100%; height: 100%; object-fit: cover; }
.fd-modal-header::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.7), transparent 60%); }
.fd-modal-header-overlay { position: absolute; bottom: 16px; left: 20px; z-index: 1; color: #fff; }
.fd-modal-header-overlay h2 { font-size: 1.35rem; font-weight: 700; margin: 0 0 2px; }
.fd-mh-zh { font-size: .85rem; opacity: .85; color: #f39c12; }
.fd-modal-close { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,.4); border: none; color: #fff; width: 32px; height: 32px; border-radius: 50%; font-size: 1rem; cursor: pointer; z-index: 2; transition: background .2s; }
.fd-modal-close:hover { background: rgba(0,0,0,.7); }
.fd-modal-meta { display: flex; flex-wrap: wrap; gap: 14px; padding: 14px 20px; border-bottom: 1px solid #eee; background: #fafafa; }
.fd-modal-meta-item { font-size: .82rem; color: #555; display: flex; align-items: center; gap: 6px; }
.fd-modal-meta-item i { color: #e74c3c; font-size: .85rem; }
.fd-modal-section { padding: 20px; }
.fd-modal-section + .fd-modal-section { border-top: 1px solid #eee; }
.fd-modal-section h4 { font-size: .95rem; font-weight: 700; color: #333; margin: 0 0 10px; }
.fd-modal-section h4 i { color: #e74c3c; margin-right: 6px; }
.fd-modal-section p { font-size: .85rem; color: #555; line-height: 1.7; margin: 0; }
.fd-tips-list { list-style: none; padding: 0; margin: 0; }
.fd-tips-list li { padding: 8px 0; font-size: .84rem; color: #555; border-bottom: 1px solid #f5f0eb; display: flex; align-items: flex-start; gap: 8px; }
.fd-tips-list li:last-child { border-bottom: none; }
.fd-tips-list li i { color: #e74c3c; font-size: .75rem; margin-top: 3px; flex-shrink: 0; }
.fd-modal-cta { padding: 18px 20px; border-top: 1px solid #eee; text-align: center; background: #fafafa; border-radius: 0 0 18px 18px; }
.fd-modal-cta p { font-size: .85rem; color: #666; margin: 0 0 12px; }
.fd-cta-btn { display: inline-flex; align-items: center; gap: 8px; background: #e74c3c; color: #fff; padding: 10px 24px; border-radius: 50px; text-decoration: none; font-weight: 700; font-size: .9rem; transition: all .2s; }
.fd-cta-btn:hover { background: #c0392b; transform: translateY(-1px); }

/* Dark mode */
[data-theme="dark"] .fd-hero::after { background: linear-gradient(135deg, rgba(180,50,35,0.9), rgba(200,100,30,0.8)); }
[data-theme="dark"] .fd-filter-bar { background: #1a1a2e; }
[data-theme="dark"] .fd-filter-btn { background: #1a1a2e; border-color: #333; color: #999; }
[data-theme="dark"] .fd-filter-btn:hover { border-color: #e74c3c; }
[data-theme="dark"] .fd-filter-btn.active { background: #e74c3c; }
[data-theme="dark"] .fd-card { background: #1e1e32; box-shadow: 0 2px 12px rgba(0,0,0,.2); }
[data-theme="dark"] .fd-card-name { color: #e4e4e4; }
[data-theme="dark"] .fd-card-desc { color: #888; }
[data-theme="dark"] .fd-modal { background: #1e1e32; }
[data-theme="dark"] .fd-modal-meta { background: #252540; border-color: #333; }
[data-theme="dark"] .fd-modal-meta-item { color: #aaa; }
[data-theme="dark"] .fd-modal-section h4 { color: #e4e4e4; }
[data-theme="dark"] .fd-modal-section p { color: #999; }
[data-theme="dark"] .fd-tips-list li { color: #999; border-color: #2a2a3e; }
[data-theme="dark"] .fd-modal-section + .fd-modal-section { border-color: #2a2a3e; }
[data-theme="dark"] .fd-modal-cta { background: #252540; border-color: #2a2a3e; }
[data-theme="dark"] .fd-modal-cta p { color: #888; }

/* Responsive */
@media (max-width: 1023px) {
  .fd-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
  .fd-hero-inner { padding: 36px 28px; }
  .fd-hero-title { font-size: 1.6rem; }
}
@media (max-width: 767px) {
  .fd-hero { border-radius: 12px; min-height: 200px; }
  .fd-hero-inner { padding: 28px 18px; }
  .fd-hero-title { font-size: 1.35rem; }
  .fd-hero-sub { font-size: .82rem; }
  .fd-hero-stats { gap: 16px; }
  .fd-stat-num { font-size: 1.15rem; }
  .fd-grid { grid-template-columns: 1fr; gap: 12px; }
  .fd-filter-bar { top: 48px; gap: 6px; }
  .fd-filter-btn { padding: 6px 12px; font-size: .76rem; }
  .fd-card { border-radius: 12px; }
  .fd-card-img-wrap { height: 170px; }
  .fd-modal { max-height: 90vh; border-radius: 16px; }
  .fd-modal-header { height: 180px; border-radius: 16px 16px 0 0; }
  .fd-modal-header-overlay h2 { font-size: 1.15rem; }
  .fd-modal-meta { padding: 12px 16px; gap: 10px; }
  .fd-modal-section { padding: 16px; }
  .fd-modal-cta { padding: 16px; border-radius: 0 0 16px 16px; }
}
/* ================================================================
   v3.41: Beijing Shopping & Markets Guide
   ================================================================ */

/* --- Shopping Hero --- */
.sh-hero {
  background: linear-gradient(135deg, #8B0000 0%, #B22222 40%, #DC143C 100%);
  padding: 60px 20px 50px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.sh-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: url('https://images.unsplash.com/photo-1472851294608-062f824d29cc?w=1200') center/cover;
  opacity: 0.15;
}
.sh-hero-inner { position: relative; z-index: 1; max-width: 800px; margin: 0 auto; }
.sh-hero h1 { font-size: 2.2rem; margin: 0 0 10px; font-weight: 700; }
.sh-hero p { font-size: 1.1rem; opacity: 0.9; margin: 0 0 24px; }
.sh-hero-stats { display: flex; justify-content: center; gap: 40px; flex-wrap: wrap; }
.sh-stat { text-align: center; }
.sh-stat-num { display: block; font-size: 1.8rem; font-weight: 800; }
.sh-stat-label { display: block; font-size: 0.85rem; opacity: 0.75; margin-top: 2px; }

/* --- Shopping Filter Bar --- */
.sh-filter-bar {
  display: flex; flex-wrap: wrap; gap: 8px; padding: 18px 20px;
  justify-content: center; max-width: 1200px; margin: 0 auto;
  position: sticky; top: 68px; z-index: 30; background: var(--bg, #fff);
  border-bottom: 1px solid var(--border, #e5e7eb);
}
.sh-filter-btn {
  padding: 7px 16px; border-radius: 20px; border: 1.5px solid var(--border, #d1d5db);
  background: var(--bg, #fff); color: var(--text, #374151);
  font-size: 0.85rem; cursor: pointer; transition: all 0.2s;
  display: flex; align-items: center; gap: 5px; white-space: nowrap;
}
.sh-filter-btn:hover { border-color: #B22222; color: #B22222; }
.sh-filter-btn.ac { background: #B22222; color: #fff; border-color: #B22222; }

/* --- Shopping Card Grid --- */
.sh-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 24px; padding: 24px 20px 40px; max-width: 1200px; margin: 0 auto;
}
.sh-card {
  background: var(--card-bg, #fff); border-radius: 14px;
  overflow: hidden; border: 1px solid var(--border, #e5e7eb);
  transition: transform 0.25s, box-shadow 0.25s;
}
.sh-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.12); }
.sh-card-img-wrap { position: relative; height: 180px; overflow: hidden; }
.sh-card-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.sh-card:hover .sh-card-img-wrap img { transform: scale(1.06); }

.sh-rating {
  position: absolute; top: 10px; right: 10px;
  background: rgba(0,0,0,0.65); color: #FFD700;
  padding: 3px 10px; border-radius: 12px; font-size: 0.8rem;
  font-weight: 600; display: flex; align-items: center; gap: 3px;
}
.sh-cat-badge {
  position: absolute; bottom: 10px; left: 10px;
  background: rgba(0,0,0,0.55); color: #fff;
  padding: 3px 10px; border-radius: 12px; font-size: 0.72rem;
  display: flex; align-items: center; gap: 4px;
}

.sh-card-body { padding: 14px 16px; }
.sh-card-name { font-size: 1rem; margin: 0 0 6px; color: var(--heading, #111827); }
.sh-card-name-cn { color: #B22222; font-size: 0.9rem; font-weight: 600; }
.sh-card-meta { display: flex; gap: 14px; font-size: 0.78rem; color: var(--muted, #6b7280); margin-bottom: 8px; }
.sh-card-meta span { display: flex; align-items: center; gap: 4px; }
.sh-card-desc { font-size: 0.83rem; color: var(--muted, #6b7280); line-height: 1.5; margin: 0 0 12px; }
.sh-card-footer { display: flex; justify-content: flex-end; }
.sh-card-btn {
  background: transparent; color: #B22222; border: 1.5px solid #B22222;
  padding: 6px 16px; border-radius: 20px; font-size: 0.82rem;
  cursor: pointer; transition: all 0.2s;
  display: flex; align-items: center; gap: 5px;
}
.sh-card-btn:hover { background: #B22222; color: #fff; }

/* --- Shopping Detail Modal --- */
.sh-detail-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.65); display: flex;
  align-items: center; justify-content: center; padding: 20px;
  opacity: 0; transition: opacity 0.3s;
}
.sh-detail-overlay.on { opacity: 1; }
.sh-detail-modal {
  background: var(--card-bg, #fff); border-radius: 18px;
  max-width: 700px; width: 100%; max-height: 85vh;
  overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.sh-detail-header {
  position: relative; min-height: 220px; border-radius: 18px 18px 0 0;
}
.sh-detail-header-overlay {
  position: absolute; inset: 0; padding: 24px;
  display: flex; flex-direction: column; justify-content: flex-end;
  background: linear-gradient(transparent 30%, rgba(0,0,0,0.7) 100%);
  border-radius: 18px 18px 0 0;
}
.sh-detail-header-overlay h2 { color: #fff; font-size: 1.5rem; margin: 0 0 4px; }
.sh-detail-header-cn { color: rgba(255,255,255,0.85); font-size: 1rem; margin: 0; }
.sh-detail-close {
  position: absolute; top: 14px; right: 14px;
  background: rgba(0,0,0,0.4); color: #fff; border: none;
  width: 34px; height: 34px; border-radius: 50%;
  font-size: 1.3rem; cursor: pointer; line-height: 34px; text-align: center;
  transition: background 0.2s;
}
.sh-detail-close:hover { background: rgba(0,0,0,0.6); }

.sh-detail-meta {
  display: flex; flex-wrap: wrap; gap: 12px; padding: 16px 20px;
  border-bottom: 1px solid var(--border, #e5e7eb);
}
.sh-detail-meta-item {
  font-size: 0.82rem; color: var(--muted, #6b7280);
  display: flex; align-items: center; gap: 5px;
}
.sh-detail-meta-item i { color: #B22222; width: 14px; }

.sh-detail-section { padding: 16px 20px; border-bottom: 1px solid var(--border, #e5e7eb); }
.sh-detail-section h4 { font-size: 1rem; margin: 0 0 10px; color: var(--heading, #111827); display: flex; align-items: center; gap: 6px; }
.sh-detail-section h4 i { color: #B22222; }
.sh-detail-section p { font-size: 0.88rem; color: var(--muted, #6b7280); line-height: 1.65; margin: 0; }

.sh-tips-list { list-style: none; padding: 0; margin: 0; }
.sh-tips-list li {
  padding: 8px 0 8px 0; font-size: 0.85rem; color: var(--muted, #6b7280);
  display: flex; align-items: flex-start; gap: 8px; line-height: 1.5;
  border-bottom: 1px solid var(--border, #f3f4f6);
}
.sh-tips-list li:last-child { border-bottom: none; }
.sh-tips-list li i { color: #B22222; margin-top: 3px; flex-shrink: 0; }

.sh-detail-gallery { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; }
.sh-detail-gallery img { height: 140px; border-radius: 10px; flex-shrink: 0; object-fit: cover; }

.sh-detail-cta {
  padding: 20px; text-align: center;
  background: linear-gradient(135deg, #FFF5F5, #FFE8E8);
  border-radius: 0 0 18px 18px;
}
.sh-detail-cta p { font-size: 0.85rem; color: #666; margin: 0 0 12px; }
.sh-cta-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: #B22222; color: #fff; padding: 10px 28px;
  border-radius: 25px; text-decoration: none; font-weight: 600;
  font-size: 0.95rem; transition: background 0.2s;
}
.sh-cta-btn:hover { background: #8B0000; }

/* Dark mode */
[data-theme="dark"] .sh-filter-bar { background: #1a1a2e; border-color: #2a2a4a; }
[data-theme="dark"] .sh-filter-btn { background: #1a1a2e; color: #ccc; border-color: #444; }
[data-theme="dark"] .sh-filter-btn:hover { border-color: #FF6B6B; color: #FF6B6B; }
[data-theme="dark"] .sh-filter-btn.ac { background: #B22222; color: #fff; border-color: #B22222; }
[data-theme="dark"] .sh-card { background: #1e1e36; border-color: #2a2a4a; }
[data-theme="dark"] .sh-card-name { color: #eee; }
[data-theme="dark"] .sh-detail-modal { background: #1e1e36; }
[data-theme="dark"] .sh-detail-meta { border-color: #2a2a4a; }
[data-theme="dark"] .sh-detail-section { border-color: #2a2a4a; }
[data-theme="dark"] .sh-detail-section h4 { color: #eee; }
[data-theme="dark"] .sh-tips-list li { border-color: #2a2a4a; }
[data-theme="dark"] .sh-detail-cta { background: linear-gradient(135deg, #2a1a1a, #1a1010); }
[data-theme="dark"] .sh-detail-cta p { color: #aaa; }

/* Responsive */
@media (max-width: 1023px) {
  .sh-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
  .sh-hero h1 { font-size: 1.6rem; }
}
@media (max-width: 767px) {
  .sh-hero { padding: 40px 16px 32px; }
  .sh-hero h1 { font-size: 1.35rem; }
  .sh-hero-stats { gap: 20px; }
  .sh-filter-bar { padding: 12px 12px; top: 56px; gap: 5px; }
  .sh-filter-btn { padding: 5px 12px; font-size: 0.78rem; }
  .sh-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; padding: 16px 12px 100px; }
  .sh-card-img-wrap { height: 150px; }
  .sh-detail-modal { max-height: 90vh; border-radius: 14px; }
  .sh-detail-header { min-height: 160px; border-radius: 14px 14px 0 0; }
  .sh-detail-header-overlay { border-radius: 14px 14px 0 0; padding: 16px; }
  .sh-detail-header-overlay h2 { font-size: 1.2rem; }
  .sh-detail-meta { padding: 12px 14px; gap: 8px; }
  .sh-detail-section { padding: 14px; }
  .sh-detail-cta { padding: 16px; border-radius: 0 0 14px 14px; }
}

/* ================================================================
   v3.42: Beijing Nightlife & Entertainment
   ================================================================ */

/* --- Nightlife Hero --- */
.nl-hero {
  background: linear-gradient(135deg, #1a0033 0%, #2d1b69 40%, #4a0e8f 100%);
  padding: 60px 20px 50px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.nl-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: url('https://images.unsplash.com/photo-1470225620780-dba8ba36b745?w=1200') center/cover;
  opacity: 0.12;
}
.nl-hero-inner { position: relative; z-index: 1; max-width: 800px; margin: 0 auto; }
.nl-hero h1 { font-size: 2.2rem; margin: 0 0 10px; font-weight: 700; }
.nl-hero p { font-size: 1.1rem; opacity: 0.9; margin: 0 0 24px; }
.nl-hero-stats { display: flex; justify-content: center; gap: 40px; flex-wrap: wrap; }
.nl-stat { text-align: center; }
.nl-stat-num { display: block; font-size: 1.8rem; font-weight: 800; }
.nl-stat-label { display: block; font-size: 0.85rem; opacity: 0.75; margin-top: 2px; }

/* --- Nightlife Filter Bar --- */
.nl-filter-bar {
  display: flex; flex-wrap: wrap; gap: 8px; padding: 18px 20px;
  justify-content: center; max-width: 1200px; margin: 0 auto;
  position: sticky; top: 68px; z-index: 30; background: var(--bg, #fff);
  border-bottom: 1px solid var(--border, #e5e7eb);
}
.nl-filter-btn {
  padding: 7px 16px; border-radius: 20px; border: 1.5px solid var(--border, #d1d5db);
  background: var(--bg, #fff); color: var(--text, #374151);
  font-size: 0.85rem; cursor: pointer; transition: all 0.2s;
  display: flex; align-items: center; gap: 5px; white-space: nowrap;
}
.nl-filter-btn:hover { border-color: #7c3aed; color: #7c3aed; }
.nl-filter-btn.ac { background: #7c3aed; color: #fff; border-color: #7c3aed; }

/* --- Nightlife Card Grid --- */
.nl-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 24px; padding: 24px 20px 40px; max-width: 1200px; margin: 0 auto;
}
.nl-card {
  background: var(--card-bg, #fff); border-radius: 14px;
  overflow: hidden; border: 1px solid var(--border, #e5e7eb);
  transition: transform 0.25s, box-shadow 0.25s;
}
.nl-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.12); }
.nl-card-img-wrap { position: relative; height: 180px; overflow: hidden; }
.nl-card-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.nl-card:hover .nl-card-img-wrap img { transform: scale(1.06); }

.nl-rating {
  position: absolute; top: 10px; right: 10px;
  background: rgba(0,0,0,0.65); color: #FFD700;
  padding: 3px 10px; border-radius: 12px; font-size: 0.8rem;
  font-weight: 600; display: flex; align-items: center; gap: 3px;
}
.nl-cat-badge {
  position: absolute; bottom: 10px; left: 10px;
  background: rgba(0,0,0,0.55); color: #fff;
  padding: 3px 10px; border-radius: 12px; font-size: 0.72rem;
  display: flex; align-items: center; gap: 4px;
}

.nl-card-body { padding: 14px 16px; }
.nl-card-name { font-size: 1rem; margin: 0 0 6px; color: var(--heading, #111827); }
.nl-card-name-cn { color: #7c3aed; font-size: 0.9rem; font-weight: 600; }
.nl-card-meta { display: flex; gap: 14px; font-size: 0.78rem; color: var(--muted, #6b7280); margin-bottom: 8px; }
.nl-card-meta span { display: flex; align-items: center; gap: 4px; }
.nl-card-desc { font-size: 0.83rem; color: var(--muted, #6b7280); line-height: 1.5; margin: 0 0 12px; }
.nl-card-footer { display: flex; justify-content: flex-end; }
.nl-card-btn {
  background: transparent; color: #7c3aed; border: 1.5px solid #7c3aed;
  padding: 6px 16px; border-radius: 20px; font-size: 0.82rem;
  cursor: pointer; transition: all 0.2s;
  display: flex; align-items: center; gap: 5px;
}
.nl-card-btn:hover { background: #7c3aed; color: #fff; }

/* --- Nightlife Detail Modal --- */
.nl-detail-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.65); display: flex;
  align-items: center; justify-content: center; padding: 20px;
  opacity: 0; transition: opacity 0.3s;
}
.nl-detail-overlay.on { opacity: 1; }
.nl-detail-modal {
  background: var(--card-bg, #fff); border-radius: 18px;
  max-width: 700px; width: 100%; max-height: 85vh;
  overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.nl-detail-header {
  position: relative; min-height: 220px; border-radius: 18px 18px 0 0;
}
.nl-detail-header-overlay {
  position: absolute; inset: 0; padding: 24px;
  display: flex; flex-direction: column; justify-content: flex-end;
  background: linear-gradient(transparent 30%, rgba(0,0,0,0.7) 100%);
  border-radius: 18px 18px 0 0;
}
.nl-detail-header-overlay h2 { color: #fff; font-size: 1.5rem; margin: 0 0 4px; }
.nl-detail-header-cn { color: rgba(255,255,255,0.85); font-size: 1rem; margin: 0; }
.nl-detail-close {
  position: absolute; top: 14px; right: 14px;
  background: rgba(0,0,0,0.4); color: #fff; border: none;
  width: 34px; height: 34px; border-radius: 50%;
  font-size: 1.3rem; cursor: pointer; line-height: 34px; text-align: center;
  transition: background 0.2s;
}
.nl-detail-close:hover { background: rgba(0,0,0,0.6); }

.nl-detail-meta {
  display: flex; flex-wrap: wrap; gap: 12px; padding: 16px 20px;
  border-bottom: 1px solid var(--border, #e5e7eb);
}
.nl-detail-meta-item {
  font-size: 0.82rem; color: var(--muted, #6b7280);
  display: flex; align-items: center; gap: 5px;
}
.nl-detail-meta-item i { color: #7c3aed; width: 14px; }

.nl-detail-section { padding: 16px 20px; border-bottom: 1px solid var(--border, #e5e7eb); }
.nl-detail-section h4 { font-size: 1rem; margin: 0 0 10px; color: var(--heading, #111827); display: flex; align-items: center; gap: 6px; }
.nl-detail-section h4 i { color: #7c3aed; }
.nl-detail-section p { font-size: 0.88rem; color: var(--muted, #6b7280); line-height: 1.65; margin: 0; }

.nl-tips-list { list-style: none; padding: 0; margin: 0; }
.nl-tips-list li {
  padding: 8px 0 8px 0; font-size: 0.85rem; color: var(--muted, #6b7280);
  display: flex; align-items: flex-start; gap: 8px; line-height: 1.5;
  border-bottom: 1px solid var(--border, #f3f4f6);
}
.nl-tips-list li:last-child { border-bottom: none; }
.nl-tips-list li i { color: #7c3aed; margin-top: 3px; flex-shrink: 0; }

.nl-detail-gallery { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; }
.nl-detail-gallery img { height: 140px; border-radius: 10px; flex-shrink: 0; object-fit: cover; }

.nl-detail-cta {
  padding: 20px; text-align: center;
  background: linear-gradient(135deg, #F5F3FF, #EDE9FE);
  border-radius: 0 0 18px 18px;
}
.nl-detail-cta p { font-size: 0.85rem; color: #666; margin: 0 0 12px; }
.nl-cta-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: #7c3aed; color: #fff; padding: 10px 28px;
  border-radius: 25px; text-decoration: none; font-weight: 600;
  font-size: 0.95rem; transition: background 0.2s;
}
.nl-cta-btn:hover { background: #5b21b6; }

/* Dark mode */
[data-theme="dark"] .nl-filter-bar { background: #1a1a2e; border-color: #2a2a4a; }
[data-theme="dark"] .nl-filter-btn { background: #1a1a2e; color: #ccc; border-color: #444; }
[data-theme="dark"] .nl-filter-btn:hover { border-color: #a78bfa; color: #a78bfa; }
[data-theme="dark"] .nl-filter-btn.ac { background: #7c3aed; color: #fff; border-color: #7c3aed; }
[data-theme="dark"] .nl-card { background: #1e1e36; border-color: #2a2a4a; }
[data-theme="dark"] .nl-card-name { color: #eee; }
[data-theme="dark"] .nl-detail-modal { background: #1e1e36; }
[data-theme="dark"] .nl-detail-meta { border-color: #2a2a4a; }
[data-theme="dark"] .nl-detail-section { border-color: #2a2a4a; }
[data-theme="dark"] .nl-detail-section h4 { color: #eee; }
[data-theme="dark"] .nl-tips-list li { border-color: #2a2a4a; }
[data-theme="dark"] .nl-detail-cta { background: linear-gradient(135deg, #1a1a2e, #121020); }
[data-theme="dark"] .nl-detail-cta p { color: #aaa; }

/* Responsive */
@media (max-width: 1023px) {
  .nl-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
  .nl-hero h1 { font-size: 1.6rem; }
}
@media (max-width: 767px) {
  .nl-hero { padding: 40px 16px 32px; }
  .nl-hero h1 { font-size: 1.35rem; }
  .nl-hero-stats { gap: 20px; }
  .nl-filter-bar { padding: 12px 12px; top: 56px; gap: 5px; }
  .nl-filter-btn { padding: 5px 12px; font-size: 0.78rem; }
  .nl-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; padding: 16px 12px 100px; }
  .nl-card-img-wrap { height: 150px; }
  .nl-detail-modal { max-height: 90vh; border-radius: 14px; }
  .nl-detail-header { min-height: 160px; border-radius: 14px 14px 0 0; }
  .nl-detail-header-overlay { border-radius: 14px 14px 0 0; padding: 16px; }
  .nl-detail-header-overlay h2 { font-size: 1.2rem; }
  .nl-detail-meta { padding: 12px 14px; gap: 8px; }
  .nl-detail-section { padding: 14px; }
  .nl-detail-cta { padding: 16px; border-radius: 0 0 14px 14px; }
}

/* ===============================================================
   v3.43: Beijing Transportation Guide
   =============================================================== */
.tr-hero {
  background: linear-gradient(135deg, #0d3b66 0%, #1a6b8a 40%, #2d9cdb 100%);
  padding: 64px 20px 48px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.tr-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.tr-hero-inner { position: relative; z-index: 1; max-width: 800px; margin: 0 auto; }
.tr-hero-inner h1 { font-size: 2.4rem; font-weight: 800; margin-bottom: 10px; letter-spacing: -0.5px; }
.tr-hero-inner p { font-size: 1.1rem; opacity: 0.85; margin-bottom: 28px; }
.tr-hero-stats { display: flex; justify-content: center; gap: 40px; flex-wrap: wrap; }
.tr-stat { text-align: center; }
.tr-stat-num { display: block; font-size: 2rem; font-weight: 800; }
.tr-stat-label { display: block; font-size: 0.82rem; opacity: 0.75; margin-top: 2px; }

/* Transport filter bar */
.tr-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 16px 20px;
  justify-content: center;
  background: var(--white);
  position: sticky;
  top: 72px;
  z-index: 50;
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(8px);
}
.tr-filter-btn {
  padding: 8px 18px;
  border: 2px solid var(--border);
  border-radius: 50px;
  background: var(--white);
  color: var(--text);
  font-size: 0.88rem;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.tr-filter-btn:hover { border-color: var(--primary); color: var(--primary); }
.tr-filter-btn.ac { background: var(--primary); color: #fff; border-color: var(--primary); }

/* Transport grid */
.tr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 24px;
  padding: 24px 20px 120px;
}
.tr-card {
  background: var(--white);
  border-radius: 14px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  overflow: hidden;
  transition: transform 0.25s, box-shadow 0.25s;
}
.tr-card:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(0,0,0,0.1); }
.tr-card-img-wrap {
  position: relative;
  height: 180px;
  overflow: hidden;
}
.tr-card-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s;
}
.tr-card:hover .tr-card-img-wrap img { transform: scale(1.06); }
.tr-rating {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(0,0,0,0.7);
  color: #fbbf24;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-weight: 700;
}
.tr-cat-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--primary);
  color: #fff;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.78rem;
  font-weight: 600;
}
.tr-card-body { padding: 16px 18px; }
.tr-card-name { font-size: 1.05rem; font-weight: 700; margin: 0 0 6px; color: var(--text-dark); }
.tr-card-name-cn { font-weight: 400; color: var(--text-light); font-size: 0.88rem; }
.tr-card-meta { display: flex; gap: 14px; margin: 6px 0 8px; font-size: 0.82rem; color: var(--text-light); }
.tr-card-desc { font-size: 0.86rem; color: var(--text); line-height: 1.5; margin: 0 0 12px; }
.tr-card-footer { display: flex; justify-content: flex-end; }
.tr-card-btn {
  background: var(--primary);
  color: #fff;
  border: none;
  padding: 7px 18px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.2s;
}
.tr-card-btn:hover { background: var(--primary-dark); transform: scale(1.04); }

/* Transport detail overlay */
.tr-detail-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.65);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s;
  padding: 20px;
}
.tr-detail-overlay.on { opacity: 1; }
.tr-detail-modal {
  background: var(--white);
  border-radius: 18px;
  max-width: 680px;
  width: 100%;
  max-height: 88vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.tr-detail-header {
  min-height: 220px;
  position: relative;
  border-radius: 18px 18px 0 0;
  display: flex;
  align-items: flex-end;
}
.tr-detail-header-overlay {
  background: linear-gradient(transparent, rgba(0,0,0,0.65));
  padding: 50px 24px 20px;
  width: 100%;
  border-radius: 18px 18px 0 0;
  color: #fff;
  position: relative;
}
.tr-detail-header-overlay h2 { font-size: 1.5rem; margin: 0 0 2px; }
.tr-detail-header-cn { margin: 0; opacity: 0.75; font-size: 0.92rem; }
.tr-detail-close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: rgba(255,255,255,0.2);
  border: none;
  color: #fff;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  font-size: 1.4rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.tr-detail-close:hover { background: rgba(255,255,255,0.35); }
.tr-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  padding: 16px 24px;
  border-bottom: 1px solid var(--border);
  font-size: 0.88rem;
  color: var(--text);
}
.tr-detail-meta-item { display: flex; align-items: center; gap: 5px; color: var(--primary); }
.tr-detail-section { padding: 18px 24px; border-bottom: 1px solid var(--border); }
.tr-detail-section:last-of-type { border-bottom: none; }
.tr-detail-section h4 { font-size: 1rem; margin: 0 0 10px; color: var(--text-dark); }
.tr-detail-section p { font-size: 0.9rem; line-height: 1.7; color: var(--text); margin: 0; }
.tr-tips-list { list-style: none; padding: 0; margin: 0; }
.tr-tips-list li { padding: 6px 0; font-size: 0.88rem; color: var(--text); display: flex; align-items: flex-start; gap: 8px; line-height: 1.5; }
.tr-tips-list li i { color: var(--success); margin-top: 3px; flex-shrink: 0; }
.tr-detail-gallery { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 6px; }
.tr-detail-gallery img { width: 140px; height: 100px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.tr-detail-cta {
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  padding: 22px 24px;
  border-radius: 0 0 18px 18px;
  color: #fff;
  text-align: center;
}
.tr-detail-cta p { margin: 0 0 12px; font-size: 0.92rem; opacity: 0.9; }
.tr-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  color: var(--primary);
  padding: 10px 28px;
  border-radius: 30px;
  font-weight: 700;
  font-size: 0.92rem;
  text-decoration: none;
  transition: transform 0.2s;
}
.tr-cta-btn:hover { transform: scale(1.05); }

/* Dark mode overrides */
body.dark .tr-hero { background: linear-gradient(135deg, #0a1f33 0%, #0f2d45 40%, #183d5e 100%); }
body.dark .tr-filter-bar { background: var(--dark-bg); border-color: var(--dark-border); }
body.dark .tr-filter-btn { background: var(--dark-bg); border-color: var(--dark-border); color: var(--dark-text); }
body.dark .tr-card { background: var(--dark-card); }
body.dark .tr-card-name { color: var(--dark-text); }
body.dark .tr-detail-modal { background: var(--dark-card); }
body.dark .tr-detail-meta { border-color: var(--dark-border); }
body.dark .tr-detail-section { border-color: var(--dark-border); }
body.dark .tr-detail-section h4 { color: var(--dark-text); }
body.dark .tr-tips-list li { color: var(--dark-text); }

@media (max-width: 768px) {
  .tr-hero { padding: 44px 16px 32px; }
  .tr-hero-inner h1 { font-size: 1.7rem; }
  .tr-hero-inner p { font-size: 0.92rem; }
  .tr-hero-stats { gap: 24px; }
  .tr-stat-num { font-size: 1.5rem; }
  .tr-filter-bar { padding: 10px 10px; top: 56px; gap: 5px; }
  .tr-filter-btn { padding: 5px 12px; font-size: 0.76rem; }
  .tr-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; padding: 16px 12px 100px; }
  .tr-card-img-wrap { height: 150px; }
  .tr-detail-modal { max-height: 90vh; border-radius: 14px; }
  .tr-detail-header { min-height: 160px; border-radius: 14px 14px 0 0; }
  .tr-detail-header-overlay { border-radius: 14px 14px 0 0; padding: 16px; }
  .tr-detail-header-overlay h2 { font-size: 1.2rem; }
  .tr-detail-meta { padding: 12px 14px; gap: 8px; }
  .tr-detail-section { padding: 14px; }
  .tr-detail-cta { padding: 16px; border-radius: 0 0 14px 14px; }
}

/* ===============================================================
   v3.44: Beijing Hotels & Accommodation Guide
   =============================================================== */

/* --- Hotels Hero --- */
.ht-hero {
  background: linear-gradient(135deg, #0d2137 0%, #1a3a5c 30%, #1e6b8a 70%, #2d8fa8 100%);
  padding: 60px 20px 50px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.ht-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: url('https://images.unsplash.com/photo-1566073771259-6a8506099945?w=1200') center/cover;
  opacity: 0.08;
}
.ht-hero-inner { position: relative; z-index: 1; max-width: 800px; margin: 0 auto; }
.ht-hero h1 { font-size: 2.2rem; margin: 0 0 10px; font-weight: 700; }
.ht-hero p { font-size: 1.1rem; opacity: 0.9; margin: 0 0 24px; }
.ht-hero-stats { display: flex; justify-content: center; gap: 40px; flex-wrap: wrap; }
.ht-stat { text-align: center; }
.ht-stat-num { display: block; font-size: 1.8rem; font-weight: 800; }
.ht-stat-label { display: block; font-size: 0.85rem; opacity: 0.75; margin-top: 2px; }

/* --- Hotels Filter Bar --- */
.ht-filter-bar {
  display: flex; flex-wrap: wrap; gap: 8px; padding: 18px 20px;
  justify-content: center; max-width: 1200px; margin: 0 auto;
  position: sticky; top: 68px; z-index: 30; background: var(--bg, #fff);
  border-bottom: 1px solid var(--border, #e5e7eb);
}
.ht-filter-btn {
  padding: 7px 16px; border-radius: 20px; border: 1.5px solid var(--border, #d1d5db);
  background: var(--bg, #fff); color: var(--text, #374151);
  font-size: 0.85rem; cursor: pointer; transition: all 0.2s;
  display: flex; align-items: center; gap: 5px; white-space: nowrap;
}
.ht-filter-btn:hover { border-color: #1e6b8a; color: #1e6b8a; }
.ht-filter-btn.ac { background: linear-gradient(135deg, #1a5f7a, #1e6b8a); color: #fff; border-color: #1a5f7a; }

/* --- Hotels Card Grid --- */
.ht-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  gap: 24px; padding: 24px 20px 40px; max-width: 1200px; margin: 0 auto;
}
.ht-card {
  background: var(--card-bg, #fff); border-radius: 14px;
  overflow: hidden; border: 1px solid var(--border, #e5e7eb);
  transition: transform 0.25s, box-shadow 0.25s;
}
.ht-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.12); }
.ht-card-img-wrap { position: relative; height: 190px; overflow: hidden; }
.ht-card-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.ht-card:hover .ht-card-img-wrap img { transform: scale(1.06); }
.ht-rating {
  position: absolute; top: 10px; right: 10px;
  background: rgba(0,0,0,0.65); color: #FFD700;
  padding: 3px 10px; border-radius: 12px; font-size: 0.8rem;
  font-weight: 600; display: flex; align-items: center; gap: 3px;
}
.ht-cat-badge {
  position: absolute; bottom: 10px; left: 10px;
  background: rgba(0,0,0,0.55); color: #fff;
  padding: 3px 10px; border-radius: 12px; font-size: 0.72rem;
  display: flex; align-items: center; gap: 4px;
}
.ht-card-body { padding: 14px 16px; }
.ht-card-name { font-size: 1rem; margin: 0 0 6px; color: var(--heading, #111827); }
.ht-card-name-cn { color: #1a5f7a; font-size: 0.85rem; font-weight: 600; }
.ht-card-meta { display: flex; gap: 14px; font-size: 0.78rem; color: var(--muted, #6b7280); margin-bottom: 8px; flex-wrap: wrap; }
.ht-card-meta span { display: flex; align-items: center; gap: 4px; }
.ht-card-desc { font-size: 0.83rem; color: var(--muted, #6b7280); line-height: 1.5; margin: 0 0 12px; }
.ht-card-footer { display: flex; justify-content: flex-end; }
.ht-card-btn {
  background: transparent; color: #1a5f7a; border: 1.5px solid #1a5f7a;
  padding: 6px 16px; border-radius: 20px; font-size: 0.82rem;
  cursor: pointer; transition: all 0.2s;
  display: flex; align-items: center; gap: 5px;
  font-family: inherit;
}
.ht-card-btn:hover { background: #1a5f7a; color: #fff; }

/* --- Hotels Detail Modal --- */
.ht-detail-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.65); display: flex;
  align-items: center; justify-content: center; padding: 20px;
  opacity: 0; transition: opacity 0.3s;
}
.ht-detail-overlay.on { opacity: 1; }
.ht-detail-modal {
  background: var(--card-bg, #fff); border-radius: 18px;
  max-width: 700px; width: 100%; max-height: 85vh;
  overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.ht-detail-header {
  position: relative; min-height: 220px; border-radius: 18px 18px 0 0;
}
.ht-detail-header-overlay {
  position: absolute; inset: 0; padding: 24px;
  display: flex; flex-direction: column; justify-content: flex-end;
  background: linear-gradient(transparent 30%, rgba(0,0,0,0.7) 100%);
  border-radius: 18px 18px 0 0;
}
.ht-detail-header-overlay h2 { color: #fff; font-size: 1.5rem; margin: 0 0 4px; }
.ht-detail-header-cn { color: rgba(255,255,255,0.85); font-size: 1rem; margin: 0; }
.ht-detail-close {
  position: absolute; top: 14px; right: 14px;
  background: rgba(0,0,0,0.4); color: #fff; border: none;
  width: 34px; height: 34px; border-radius: 50%;
  font-size: 1.3rem; cursor: pointer; line-height: 34px; text-align: center;
  transition: background 0.2s;
}
.ht-detail-close:hover { background: rgba(0,0,0,0.6); }
.ht-detail-meta {
  display: flex; flex-wrap: wrap; gap: 12px; padding: 16px 20px;
  border-bottom: 1px solid var(--border, #e5e7eb);
}
.ht-detail-meta-item {
  font-size: 0.82rem; color: var(--muted, #6b7280);
  display: flex; align-items: center; gap: 5px;
}
.ht-detail-meta-item i { color: #1a5f7a; width: 14px; }
.ht-detail-section { padding: 16px 20px; border-bottom: 1px solid var(--border, #e5e7eb); }
.ht-detail-section:last-of-type { border-bottom: none; }
.ht-detail-section h4 { font-size: 1rem; margin: 0 0 10px; color: var(--heading, #111827); display: flex; align-items: center; gap: 6px; }
.ht-detail-section h4 i { color: #1a5f7a; }
.ht-detail-section p { font-size: 0.88rem; color: var(--muted, #6b7280); line-height: 1.65; margin: 0; }

/* Hotels Amenities Grid */
.ht-amenities-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 6px;
}
.ht-amenity-item {
  display: flex; align-items: center; gap: 6px;
  font-size: 0.84rem; color: var(--muted, #6b7280);
  padding: 4px 0;
}
.ht-amenity-item i { color: #1a5f7a; font-size: 0.75rem; flex-shrink: 0; }

.ht-tips-list { list-style: none; padding: 0; margin: 0; }
.ht-tips-list li {
  padding: 8px 0 8px 0; font-size: 0.85rem; color: var(--muted, #6b7280);
  display: flex; align-items: flex-start; gap: 8px; line-height: 1.5;
  border-bottom: 1px solid var(--border, #f3f4f6);
}
.ht-tips-list li:last-child { border-bottom: none; }
.ht-tips-list li i { color: #1a5f7a; margin-top: 3px; flex-shrink: 0; }

.ht-detail-gallery { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; }
.ht-detail-gallery img { height: 140px; border-radius: 10px; flex-shrink: 0; object-fit: cover; }

.ht-detail-cta {
  padding: 20px; text-align: center;
  background: linear-gradient(135deg, #e8f4f8, #d1ecf1);
  border-radius: 0 0 18px 18px;
}
.ht-detail-cta p { font-size: 0.85rem; color: #666; margin: 0 0 12px; }
.ht-cta-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, #1a5f7a, #1e6b8a); color: #fff;
  padding: 10px 28px; border-radius: 25px; text-decoration: none;
  font-weight: 600; font-size: 0.95rem; transition: transform 0.2s;
}
.ht-cta-btn:hover { transform: scale(1.05); }

/* Dark mode */
body.dark .ht-hero { background: linear-gradient(135deg, #071420 0%, #0d2137 50%, #122d42 100%); }
body.dark .ht-filter-bar { background: var(--dark-bg); border-color: var(--dark-border); }
body.dark .ht-filter-btn { background: var(--dark-bg); border-color: var(--dark-border); color: var(--dark-text); }
body.dark .ht-card { background: var(--dark-card); }
body.dark .ht-card-name { color: var(--dark-text); }
body.dark .ht-card-name-cn { color: #5b9bbd; }
body.dark .ht-detail-modal { background: var(--dark-card); }
body.dark .ht-detail-meta { border-color: var(--dark-border); }
body.dark .ht-detail-section { border-color: var(--dark-border); }
body.dark .ht-detail-section h4 { color: var(--dark-text); }
body.dark .ht-tips-list li { border-color: var(--dark-border); color: var(--dark-text); }
body.dark .ht-amenity-item { color: var(--dark-text); }
body.dark .ht-detail-cta { background: linear-gradient(135deg, #0d2137, #122d42); }
body.dark .ht-detail-cta p { color: #aaa; }

/* Responsive */
@media (max-width: 1023px) {
  .ht-grid { grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); }
  .ht-hero h1 { font-size: 1.6rem; }
}
@media (max-width: 767px) {
  .ht-hero { padding: 40px 16px 32px; }
  .ht-hero h1 { font-size: 1.35rem; }
  .ht-hero-stats { gap: 20px; }
  .ht-filter-bar { padding: 12px 12px; top: 56px; gap: 5px; }
  .ht-filter-btn { padding: 5px 12px; font-size: 0.78rem; }
  .ht-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; padding: 16px 12px 100px; }
  .ht-card-img-wrap { height: 150px; }
  .ht-detail-modal { max-height: 90vh; border-radius: 14px; }
  .ht-detail-header { min-height: 160px; border-radius: 14px 14px 0 0; }
  .ht-detail-header-overlay { border-radius: 14px 14px 0 0; padding: 16px; }
  .ht-detail-header-overlay h2 { font-size: 1.2rem; }
  .ht-detail-meta { padding: 12px 14px; gap: 8px; }
  .ht-detail-section { padding: 14px; }
  .ht-detail-cta { padding: 16px; border-radius: 0 0 14px 14px; }
  .ht-amenities-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

/* ================================================================
   v3.45: Travel Tips & Practical Info
   ================================================================ */

/* --- Hero --- */
.tp-hero { background:linear-gradient(135deg, #1a5f7a 0%, #0d4f6b 50%, #0a3d54 100%); padding:60px 20px 50px; text-align:center; position:relative; overflow:hidden; }
.tp-hero::before { content:''; position:absolute; inset:0; background:url('https://images.unsplash.com/photo-1547981609-4b899bf7d4de?w=1200&q=80') center/cover; opacity:0.12; }
.tp-hero-inner { position:relative; max-width:900px; margin:0 auto; }
.tp-hero h1 { color:#fff; font-size:2.2rem; margin:0 0 10px; font-weight:700; }
.tp-hero p { color:rgba(255,255,255,0.8); font-size:1.05rem; max-width:650px; margin:0 auto; line-height:1.6; }
.tp-hero-stats { display:flex; justify-content:center; gap:40px; margin-bottom:24px; }
.tp-stat { display:flex; flex-direction:column; align-items:center; }
.tp-stat-num { font-size:1.8rem; font-weight:800; color:#f9a825; }
.tp-stat-label { font-size:0.85rem; color:rgba(255,255,255,0.7); margin-top:2px; }

/* --- Filter Bar --- */
.tp-filter-bar { background:var(--bg,#fff); border-bottom:1px solid var(--bh,#e2e8f0); padding:12px 0; }
.tp-filter-bar.sticky-fb { position:sticky; top:68px; z-index:50; backdrop-filter:blur(8px); background:rgba(255,255,255,0.92); }
.tp-filter-inner { max-width:1200px; margin:0 auto; display:flex; flex-wrap:wrap; gap:8px; padding:0 20px; justify-content:center; }
.tp-filter-btn { padding:8px 16px; border-radius:20px; border:1.5px solid #cbd5e1; background:#fff; color:#475569; font-size:0.85rem; cursor:pointer; transition:all .2s; white-space:nowrap; display:flex; align-items:center; gap:6px; font-weight:500; }
.tp-filter-btn:hover { border-color:#1a5f7a; color:#1a5f7a; background:#f0f9ff; }
.tp-filter-btn.on { background:#1a5f7a; color:#fff; border-color:#1a5f7a; }
.tp-filter-btn i { font-size:0.8rem; }

/* --- Card Grid --- */
.tp-grid { max-width:1200px; margin:30px auto; padding:0 20px; display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:20px; }
.tp-card { background:var(--bg,#fff); border-radius:12px; padding:24px; border:1px solid var(--bh,#e2e8f0); cursor:pointer; transition:all .25s; display:flex; gap:16px; align-items:flex-start; }
.tp-card:hover { transform:translateY(-3px); box-shadow:0 8px 25px rgba(0,0,0,0.1); border-color:#1a5f7a; }
.tp-card-icon-wrap { flex-shrink:0; width:48px; height:48px; border-radius:12px; background:linear-gradient(135deg,#1a5f7a,#0d4f6b); display:flex; align-items:center; justify-content:center; }
.tp-card-icon-wrap i { color:#fff; font-size:1.2rem; }
.tp-card-body { flex:1; min-width:0; }
.tp-card-cat { display:inline-block; font-size:0.7rem; font-weight:600; text-transform:uppercase; color:#1a5f7a; background:#e0f2fe; padding:2px 10px; border-radius:10px; margin-bottom:8px; letter-spacing:0.5px; }
.tp-card-title { font-size:1.05rem; font-weight:700; color:var(--tc,#1e293b); margin:0 0 8px; line-height:1.3; }
.tp-card-desc { font-size:0.88rem; color:var(--tx,#64748b); line-height:1.5; margin:0 0 12px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.tp-card-cta { font-size:0.82rem; color:#1a5f7a; font-weight:600; }

/* --- Detail Modal --- */
.tp-detail-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:10000; display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; transition:opacity .3s; }
.tp-detail-overlay.on { opacity:1; }
.tp-detail-modal { background:var(--bg,#fff); border-radius:16px; max-width:620px; width:100%; max-height:85vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,0.3); }
.tp-detail-header { position:relative; padding:40px 28px 28px; color:#fff; border-radius:16px 16px 0 0; }
.tp-detail-close { position:absolute; top:12px; right:16px; background:rgba(255,255,255,0.2); border:none; color:#fff; width:32px; height:32px; border-radius:50%; font-size:1.2rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .2s; }
.tp-detail-close:hover { background:rgba(255,255,255,0.35); }
.tp-detail-header-content { }
.tp-detail-cat-badge { display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,0.2); padding:4px 14px; border-radius:20px; font-size:0.8rem; margin-bottom:12px; font-weight:500; }
.tp-detail-header h2 { font-size:1.5rem; margin:0; font-weight:700; }
.tp-detail-sub { display:block; font-size:0.95rem; opacity:0.8; font-weight:400; margin-top:4px; }
.tp-detail-body { padding:24px 28px; }
.tp-detail-about p { font-size:0.95rem; line-height:1.7; color:var(--tx,#475569); margin:0 0 20px; }
.tp-detail-tips h4 { font-size:1rem; font-weight:700; color:var(--tc,#1e293b); margin:0 0 14px; }
.tp-tips-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.tp-tips-list li { }
.tp-tip-item { display:flex; gap:12px; align-items:flex-start; padding:12px 14px; background:var(--bg2,#f8fafc); border-radius:10px; border-left:3px solid #1a5f7a; }
.tp-tip-item i { color:#10b981; font-size:1rem; margin-top:2px; flex-shrink:0; }
.tp-tip-item div { display:flex; flex-direction:column; gap:2px; }
.tp-tip-item strong { font-size:0.9rem; color:var(--tc,#1e293b); }
.tp-tip-item span { font-size:0.82rem; color:var(--tx,#64748b); }
.tp-detail-cta { padding:0 28px 28px; }
.tp-cta-btn { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:14px; background:linear-gradient(135deg,#1a5f7a,#0d4f6b); color:#fff; border:none; border-radius:10px; font-size:1rem; font-weight:600; cursor:pointer; text-decoration:none; transition:all .2s; }
.tp-cta-btn:hover { opacity:0.9; transform:translateY(-1px); }

/* --- Dark Mode --- */
[data-theme="dark"] .tp-hero { background:linear-gradient(135deg, #0a2a3a, #061e2c); }
[data-theme="dark"] .tp-filter-bar.sticky-fb { background:rgba(15,23,42,0.92); border-color:#1e293b; }
[data-theme="dark"] .tp-filter-btn { background:#1e293b; border-color:#334155; color:#94a3b8; }
[data-theme="dark"] .tp-filter-btn:hover { border-color:#38bdf8; color:#38bdf8; background:rgba(56,189,248,0.08); }
[data-theme="dark"] .tp-filter-btn.on { background:#1a5f7a; color:#fff; border-color:#1a5f7a; }
[data-theme="dark"] .tp-card { background:#1e293b; border-color:#334155; }
[data-theme="dark"] .tp-card:hover { border-color:#38bdf8; box-shadow:0 8px 25px rgba(0,0,0,0.4); }
[data-theme="dark"] .tp-card-cat { background:rgba(56,189,248,0.15); color:#38bdf8; }
[data-theme="dark"] .tp-detail-modal { background:#1e293b; }
[data-theme="dark"] .tp-tip-item { background:rgba(15,23,42,0.6); }
[data-theme="dark"] .tp-cta-btn { background:linear-gradient(135deg, #2563eb, #1d4ed8); }

/* --- Responsive --- */
@media (max-width:767px) {
  .tp-hero { padding:40px 16px 32px; }
  .tp-hero h1 { font-size:1.5rem; }
  .tp-hero p { font-size:0.9rem; }
  .tp-hero-stats { gap:24px; }
  .tp-stat-num { font-size:1.4rem; }
  .tp-grid { grid-template-columns:1fr; padding:0 16px; margin:20px auto; }
  .tp-card { padding:18px; }
  .tp-filter-bar.sticky-fb { top:60px; }
  .tp-detail-header { padding:30px 18px 22px; }
  .tp-detail-header h2 { font-size:1.2rem; }
  .tp-detail-body { padding:18px; }
  .tp-detail-cta { padding:0 18px 22px; }
}

/* ================================================================
   v3.44: Deals & Special Offers
   ================================================================ */
/* Hero */
.dl-hero { background:linear-gradient(135deg, #c62828 0%, #b71c1c 40%, #8e0000 100%); padding:60px 20px 50px; text-align:center; position:relative; overflow:hidden; }
.dl-hero::before { content:''; position:absolute; inset:0; background:url('https://images.unsplash.com/photo-1559526324-593bc073d938?w=1200&q=80') center/cover; opacity:0.08; }
.dl-hero-inner { position:relative; max-width:900px; margin:0 auto; }
.dl-hero h1 { color:#fff; font-size:2.2rem; margin:0 0 10px; font-weight:700; }
.dl-hero p { color:rgba(255,255,255,0.8); font-size:1.05rem; max-width:650px; margin:0 auto; line-height:1.6; }
.dl-hero-stats { display:flex; justify-content:center; gap:40px; margin-bottom:24px; }
.dl-stat { text-align:center; }
.dl-stat-num { display:block; font-size:2rem; font-weight:800; color:#ffcc80; }
.dl-stat-label { display:block; font-size:0.8rem; color:rgba(255,255,255,0.7); text-transform:uppercase; letter-spacing:1px; margin-top:2px; }

/* Filter */
.dl-filter-bar { background:var(--bg,#fff); border-bottom:1px solid var(--bh,#e2e8f0); padding:12px 0; }
.dl-filter-bar.sticky-fb { position:sticky; top:68px; z-index:50; backdrop-filter:blur(8px); background:rgba(255,255,255,0.92); }
.dl-filter-inner { max-width:1200px; margin:0 auto; display:flex; flex-wrap:wrap; gap:8px; padding:0 20px; justify-content:center; }
.dl-filter-btn { padding:8px 16px; border-radius:20px; border:1.5px solid #cbd5e1; background:#fff; color:#475569; font-size:0.85rem; cursor:pointer; transition:all .2s; white-space:nowrap; display:flex; align-items:center; gap:6px; font-weight:500; }
.dl-filter-btn:hover { border-color:#c62828; color:#c62828; background:#fef2f2; }
.dl-filter-btn.on { background:#c62828; color:#fff; border-color:#c62828; }
.dl-filter-btn i { font-size:0.8rem; }
.dl-count { background:rgba(198,40,40,0.12); color:#c62828; font-size:0.7rem; padding:1px 7px; border-radius:10px; font-weight:700; margin-left:2px; }
.dl-filter-btn.on .dl-count { background:rgba(255,255,255,0.25); color:#fff; }

/* Grid */
.dl-grid { max-width:1200px; margin:30px auto; padding:0 20px; display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:20px; }
.dl-card { background:var(--bg,#fff); border-radius:14px; overflow:hidden; border:1px solid var(--bh,#e2e8f0); cursor:pointer; transition:all .25s; }
.dl-card:hover { transform:translateY(-4px); box-shadow:0 12px 30px rgba(0,0,0,0.12); }
.dl-card.dl-expiring { border-color:#ff9800; }
.dl-card-img-wrap { position:relative; height:200px; overflow:hidden; }
.dl-card-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.dl-card:hover .dl-card-img-wrap img { transform:scale(1.06); }
.dl-badge { position:absolute; top:12px; right:12px; background:linear-gradient(135deg,#c62828,#b71c1c); color:#fff; padding:5px 14px; border-radius:20px; font-size:0.85rem; font-weight:800; letter-spacing:0.5px; box-shadow:0 2px 8px rgba(198,40,40,0.4); }
.dl-badge-special { background:linear-gradient(135deg,#e65100,#bf360c); font-size:0.75rem; padding:5px 12px; }
.dl-expire-tag { position:absolute; bottom:10px; left:12px; background:rgba(255,152,0,0.92); color:#fff; padding:3px 10px; border-radius:10px; font-size:0.72rem; font-weight:600; display:flex; align-items:center; gap:4px; }
.dl-expire-tag i { font-size:0.65rem; animation:pulse 1.5s infinite; }
.dl-card-body { padding:16px 18px 18px; }
.dl-card-cat { display:inline-block; font-size:0.7rem; font-weight:600; text-transform:uppercase; color:#c62828; background:#fef2f2; padding:2px 10px; border-radius:10px; margin-bottom:8px; letter-spacing:0.5px; }
.dl-card-title { font-size:1rem; font-weight:700; color:var(--tc,#1e293b); margin:0 0 10px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.dl-card-price { display:flex; align-items:baseline; gap:8px; margin-bottom:8px; }
.dl-price-old { font-size:0.85rem; color:#94a3b8; text-decoration:line-through; }
.dl-price-new { font-size:1.2rem; font-weight:800; color:#c62828; }
.dl-card-valid { font-size:0.78rem; color:#64748b; display:flex; align-items:center; gap:5px; }
.dl-card-valid i { font-size:0.72rem; color:#94a3b8; }

/* Detail Modal */
.dl-detail-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.65); z-index:1000; display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; visibility:hidden; transition:all .3s; }
.dl-detail-overlay.on { opacity:1; visibility:visible; }
.dl-detail-modal { background:var(--bg,#fff); border-radius:16px; max-width:680px; width:100%; max-height:90vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,0.3); }
.dl-detail-header { position:relative; height:240px; overflow:hidden; }
.dl-detail-header img { width:100%; height:100%; object-fit:cover; }
.dl-detail-header-overlay { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(transparent,rgba(0,0,0,0.8)); padding:40px 24px 20px; }
.dl-detail-badge { display:inline-block; background:#c62828; color:#fff; padding:4px 14px; border-radius:20px; font-size:0.85rem; font-weight:800; margin-bottom:8px; }
.dl-detail-header h2 { color:#fff; font-size:1.35rem; margin:0; font-weight:700; line-height:1.35; }
.dl-detail-close { position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:50%; background:rgba(0,0,0,0.5); color:#fff; border:none; font-size:1.4rem; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2; transition:background .2s; }
.dl-detail-close:hover { background:rgba(0,0,0,0.7); }
.dl-detail-body { padding:24px; }
.dl-detail-meta { display:flex; flex-wrap:wrap; gap:16px; padding:16px 20px; background:var(--bg,#f8fafc); border:1px solid var(--bh,#e2e8f0); border-radius:12px; margin-bottom:20px; }
.dl-dm-item { display:flex; align-items:flex-start; gap:10px; min-width:140px; flex:1; }
.dl-dm-item i { color:#c62828; font-size:1rem; margin-top:3px; }
.dl-dm-item span { display:block; font-size:0.72rem; color:#94a3b8; text-transform:uppercase; letter-spacing:0.5px; }
.dl-dm-item strong { display:block; font-size:0.92rem; color:var(--tc,#1e293b); }
.dl-price-strike { text-decoration:line-through; color:#94a3b8; }
.dl-price-highlight { color:#c62828; font-size:1.05rem; }
.dl-detail-about h4, .dl-detail-includes h4, .dl-detail-terms h4 { font-size:1rem; color:var(--tc,#1e293b); margin:0 0 10px; font-weight:700; }
.dl-detail-about p { font-size:0.92rem; color:var(--tx,#475569); line-height:1.65; margin:0; }
.dl-detail-includes { margin-top:20px; }
.dl-inc-list { list-style:none; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.dl-inc-list li { font-size:0.88rem; color:#16a34a; display:flex; align-items:flex-start; gap:6px; }
.dl-inc-list li i { font-size:0.85rem; margin-top:2px; flex-shrink:0; }
.dl-detail-terms { margin-top:20px; }
.dl-term-list { list-style:none; padding:0; }
.dl-term-list li { font-size:0.84rem; color:#64748b; padding:6px 0 6px 16px; border-left:3px solid #e2e8f0; margin-bottom:4px; }
.dl-detail-cta { margin-top:24px; text-align:center; padding-top:0; }
.dl-cta-btn { display:inline-flex; align-items:center; gap:8px; background:linear-gradient(135deg,#c62828,#b71c1c); color:#fff; padding:12px 32px; border-radius:26px; font-weight:700; font-size:0.95rem; text-decoration:none; transition:all .25s; box-shadow:0 4px 15px rgba(198,40,40,0.35); }
.dl-cta-btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(198,40,40,0.5); background:linear-gradient(135deg,#d32f2f,#c62828); }

/* Dark mode */
[data-theme="dark"] .dl-hero { background:linear-gradient(135deg, #3e1010, #2a0a0a); }
[data-theme="dark"] .dl-filter-bar.sticky-fb { background:rgba(15,23,42,0.92); border-color:#1e293b; }
[data-theme="dark"] .dl-filter-btn { background:#1e293b; border-color:#334155; color:#94a3b8; }
[data-theme="dark"] .dl-filter-btn:hover { border-color:#ef5350; color:#ef5350; background:rgba(239,83,80,0.08); }
[data-theme="dark"] .dl-filter-btn.on { background:#c62828; color:#fff; border-color:#c62828; }
[data-theme="dark"] .dl-card { background:#1e293b; border-color:#334155; }
[data-theme="dark"] .dl-card:hover { border-color:#ef5350; box-shadow:0 12px 30px rgba(0,0,0,0.5); }
[data-theme="dark"] .dl-card-cat { background:rgba(239,83,80,0.15); color:#ef5350; }
[data-theme="dark"] .dl-detail-body { background:#0f172a; }
[data-theme="dark"] .dl-detail-meta { background:#1e293b; border-color:#334155; }
[data-theme="dark"] .dl-count { background:rgba(239,83,80,0.15); color:#ef5350; }

/* Responsive */
@media (max-width:767px) {
  .dl-hero { padding:40px 16px 32px; }
  .dl-hero h1 { font-size:1.5rem; }
  .dl-hero p { font-size:0.9rem; }
  .dl-hero-stats { gap:24px; }
  .dl-stat-num { font-size:1.4rem; }
  .dl-grid { grid-template-columns:1fr; padding:0 16px; margin:20px auto; }
  .dl-filter-bar.sticky-fb { top:60px; }
  .dl-detail-header { height:180px; }
  .dl-detail-header h2 { font-size:1.1rem; }
  .dl-detail-body { padding:16px; }
  .dl-inc-list { grid-template-columns:1fr; }
  .dl-detail-meta { flex-direction:column; gap:10px; padding:12px 16px; }
  .dl-dm-item { min-width:auto; }
}

/* ================================================================
   v3.46: History & Heritage Page Styles
   ================================================================ */

/* --- History Hero --- */
.hs-hero { position:relative; background:linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); color:#fff; overflow:hidden; }
.hs-hero-bg { position:absolute; inset:0; opacity:0.08; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M10 10h80v80H10z' fill='none' stroke='%23fff' stroke-width='0.5'/%3E%3Ccircle cx='50' cy='50' r='8' fill='none' stroke='%23fff' stroke-width='0.3'/%3E%3C/svg%3E") repeat; }
.hs-hero-inner { position:relative; max-width:1200px; margin:0 auto; padding:60px 24px 48px; text-align:center; }
.hs-hero-stats { display:flex; justify-content:center; gap:48px; margin-bottom:28px; }
.hs-stat { text-align:center; }
.hs-stat-num { display:block; font-size:2.2rem; font-weight:800; color:#f9a825; letter-spacing:-0.02em; line-height:1.1; }
.hs-stat-label { display:block; font-size:0.85rem; opacity:0.75; margin-top:4px; text-transform:uppercase; letter-spacing:0.08em; }
.hs-hero-inner h1 { font-size:2.6rem; font-weight:800; margin:0 0 14px; background:linear-gradient(135deg, #f9a825, #ffd54f); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hs-hero-inner p { font-size:1.1rem; opacity:0.8; max-width:700px; margin:0 auto; line-height:1.6; }

/* --- Section Header --- */
.hs-section-header { text-align:center; padding:40px 24px 8px; }
.hs-section-header h2 { font-size:1.7rem; font-weight:700; color:var(--primary); margin:0 0 6px; }
.hs-section-header p { color:#666; font-size:0.95rem; margin:0; }

/* --- Period Filter Buttons --- */
.hs-period-filter { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; padding:16px 24px 32px; max-width:1100px; margin:0 auto; }
.hs-pf-btn { display:flex; align-items:center; gap:10px; padding:12px 20px; border:2px solid #e8e8e8; border-radius:12px; background:#fff; cursor:pointer; transition:all .25s; text-align:left; min-width:160px; }
.hs-pf-btn:hover { border-color:var(--primary); transform:translateY(-2px); box-shadow:0 4px 12px rgba(26,95,122,0.1); }
.hs-pf-btn.on { border-color:var(--primary); background:linear-gradient(135deg, #1a5f7a, #1a7a9a); color:#fff; }
.hs-pf-btn i { font-size:1.3rem; width:24px; text-align:center; }
.hs-pf-name { display:block; font-weight:600; font-size:0.92rem; }
.hs-pf-years { display:block; font-size:0.75rem; opacity:0.6; margin-top:2px; }
.hs-pf-btn.on .hs-pf-years { opacity:0.8; }

/* --- Timeline Track --- */
.hs-timeline-track { max-width:900px; margin:0 auto 32px; padding:0 24px; }
.hs-tl-header { display:flex; align-items:baseline; gap:12px; padding:16px 24px; background:linear-gradient(135deg, #f0f4f8, #e8eef3); border-radius:10px; margin-bottom:20px; }
.hs-tl-header h3 { font-size:1.2rem; font-weight:700; color:var(--primary); margin:0; }
.hs-tl-header span { font-size:0.85rem; color:#888; }
.hs-tl-events { position:relative; padding-left:32px; }
.hs-tl-events::before { content:''; position:absolute; left:11px; top:0; bottom:0; width:2px; background:linear-gradient(180deg, var(--primary), #ddd); }
.hs-tl-event { position:relative; padding:0 0 24px; }
.hs-tl-dot { position:absolute; left:-25px; top:4px; width:14px; height:14px; border-radius:50%; background:var(--accent); border:3px solid #fff; box-shadow:0 0 0 3px var(--primary); }
.hs-tl-content strong { display:block; font-size:0.95rem; color:var(--primary); }
.hs-tl-content span { font-size:0.8rem; color:#999; }

/* --- Landmarks Grid --- */
.hs-landmarks-section { padding:0 24px 48px; max-width:1200px; margin:0 auto; }
.hs-landmarks-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:24px; }

.hs-card { border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 2px 16px rgba(0,0,0,0.06); cursor:pointer; transition:all .3s; }
.hs-card:hover { transform:translateY(-4px); box-shadow:0 8px 32px rgba(0,0,0,0.12); }
.hs-card-img-wrap { position:relative; height:200px; overflow:hidden; }
.hs-card-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.hs-card:hover .hs-card-img-wrap img { transform:scale(1.05); }
.hs-unesco-badge { position:absolute; top:12px; right:12px; background:rgba(249,168,37,0.92); color:#fff; padding:4px 10px; border-radius:6px; font-size:0.72rem; font-weight:700; letter-spacing:0.04em; }
.hs-unesco-badge i { margin-right:4px; }
.hs-card-period { position:absolute; bottom:12px; left:12px; background:rgba(0,0,0,0.7); color:#fff; padding:3px 10px; border-radius:5px; font-size:0.75rem; }
.hs-card-body { padding:16px; }
.hs-card-type { display:inline-block; padding:2px 8px; background:#f0f4f8; color:var(--primary); border-radius:4px; font-size:0.72rem; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:8px; }
.hs-card-body h3 { font-size:1.05rem; font-weight:700; margin:0 0 8px; color:#1a1a2e; }
.hs-card-year { font-size:0.8rem; color:#999; margin-bottom:8px; }
.hs-card-year i { margin-right:4px; }
.hs-card-story { font-size:0.85rem; color:#666; line-height:1.5; margin:0; }

/* --- History Detail Overlay --- */
.hs-detail-overlay { position:fixed; inset:0; z-index:10000; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0); transition:background .3s; padding:16px; }
.hs-detail-overlay.on { background:rgba(0,0,0,0.7); }
.hs-detail-modal { background:#fff; border-radius:18px; overflow:hidden; max-width:680px; width:100%; max-height:85vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,0.3); transform:translateY(20px); opacity:0; transition:all .3s; }
.hs-detail-overlay.on .hs-detail-modal { transform:translateY(0); opacity:1; }
.hs-detail-header { position:relative; height:260px; }
.hs-detail-header img { width:100%; height:100%; object-fit:cover; }
.hs-detail-close { position:absolute; top:14px; right:14px; width:36px; height:36px; border-radius:50%; background:rgba(0,0,0,0.5); color:#fff; border:none; font-size:1.4rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; z-index:2; }
.hs-detail-close:hover { background:rgba(0,0,0,0.75); }
.hs-detail-header-overlay { position:absolute; bottom:0; left:0; right:0; padding:24px; background:linear-gradient(transparent, rgba(0,0,0,0.75)); }
.hs-detail-unesco { display:inline-block; padding:4px 10px; background:rgba(249,168,37,0.9); color:#fff; border-radius:5px; font-size:0.72rem; font-weight:700; margin-bottom:8px; }
.hs-detail-type { display:inline-block; padding:2px 8px; background:rgba(255,255,255,0.2); color:#fff; border-radius:4px; font-size:0.72rem; margin-left:8px; }
.hs-detail-header-overlay h2 { color:#fff; font-size:1.5rem; font-weight:700; margin:8px 0 0; }
.hs-detail-body { padding:20px 24px; }
.hs-detail-meta { display:flex; gap:16px; flex-wrap:wrap; padding:16px; background:#f8f9fb; border-radius:12px; margin-bottom:20px; }
.hs-dm-item { display:flex; align-items:flex-start; gap:10px; flex:1; min-width:160px; }
.hs-dm-item i { font-size:1.1rem; color:var(--primary); margin-top:2px; }
.hs-dm-item span { display:block; font-size:0.75rem; color:#999; }
.hs-dm-item strong { display:block; font-size:0.92rem; color:#333; margin-top:2px; }
.hs-detail-story { margin-bottom:20px; }
.hs-detail-story h4 { font-size:1.1rem; font-weight:700; color:var(--primary); margin:0 0 10px; }
.hs-detail-story p { font-size:0.95rem; color:#555; line-height:1.65; margin:0; }
.hs-detail-tips { padding:16px; background:#fff8e1; border-radius:10px; border-left:3px solid #f9a825; }
.hs-detail-tips h4 { font-size:0.95rem; font-weight:700; color:#e65100; margin:0 0 8px; }
.hs-detail-tips h4 i { margin-right:6px; }
.hs-detail-tips p { font-size:0.88rem; color:#666; margin:0; line-height:1.55; }
.hs-detail-cta { margin-top:24px; }
.hs-cta-btn { display:block; width:100%; padding:14px; background:linear-gradient(135deg, #1a5f7a, #1a7a9a); color:#fff; text-decoration:none; text-align:center; border-radius:10px; font-weight:700; font-size:1.05rem; transition:all .25s; }
.hs-cta-btn:hover { transform:translateY(-1px); box-shadow:0 6px 20px rgba(26,95,122,0.35); }

/* --- Dark Mode --- */
body.dark .hs-hero { background:linear-gradient(135deg, #0d0d1a 0%, #111827 50%, #0a1628 100%); }
body.dark .hs-card { background:#1e293b; box-shadow:0 2px 16px rgba(0,0,0,0.2); }
body.dark .hs-card-body h3 { color:#e2e8f0; }
body.dark .hs-card-story { color:#94a3b8; }
body.dark .hs-card-year { color:#64748b; }
body.dark .hs-card-type { background:#334155; color:#7dd3fc; }
body.dark .hs-pf-btn { background:#1e293b; border-color:#334155; }
body.dark .hs-pf-btn:hover { border-color:#7dd3fc; }
body.dark .hs-section-header h2 { color:#e2e8f0; }
body.dark .hs-detail-modal { background:#1e293b; }
body.dark .hs-detail-body { color:#e2e8f0; }
body.dark .hs-dm-item strong { color:#e2e8f0; }
body.dark .hs-detail-meta { background:#0f172a; }
body.dark .hs-detail-story p { color:#94a3b8; }
body.dark .hs-detail-story h4 { color:#7dd3fc; }
body.dark .hs-detail-tips { background:#1a2332; border-left-color:#f9a825; }
body.dark .hs-detail-tips p { color:#94a3b8; }
body.dark .hs-tl-header { background:linear-gradient(135deg, #1e293b, #0f172a); }
body.dark .hs-tl-header h3 { color:#7dd3fc; }
body.dark .hs-tl-event::before { background:linear-gradient(180deg, #7dd3fc, #334155); }

/* --- Responsive --- */
@media (max-width:768px) {
  .hs-hero-inner { padding:40px 16px 32px; }
  .hs-hero-stats { gap:28px; }
  .hs-stat-num { font-size:1.6rem; }
  .hs-hero-inner h1 { font-size:1.6rem; }
  .hs-period-filter { gap:8px; }
  .hs-pf-btn { min-width:140px; padding:10px 14px; }
  .hs-landmarks-grid { grid-template-columns:1fr; }
  .hs-detail-header { height:200px; }
  .hs-detail-header-overlay h2 { font-size:1.2rem; }
  .hs-detail-meta { flex-direction:column; gap:10px; }
  .hs-dm-item { min-width:auto; }
}

/* ================================================================
   v2.76 — Weather & Seasons
   ================================================================ */
.wt-hero { position:relative; min-height:360px; display:flex; align-items:flex-end; border-radius:16px; overflow:hidden; margin-bottom:40px; }
.wt-hero-bg { position:absolute; inset:0; background-size:cover; background-position:center; }
.wt-hero-inner { position:relative; z-index:1; padding:48px 32px 32px; color:#fff; max-width:800px; }
.wt-hero-inner h1 { font-size:2.2rem; font-weight:800; margin:0 0 12px; color:#fff; text-shadow:0 2px 8px rgba(0,0,0,0.5); }
.wt-hero-inner p { font-size:1.05rem; margin:0 0 16px; opacity:0.92; }
.wt-hero-best { display:inline-flex; align-items:center; gap:8px; background:linear-gradient(135deg, #f9a825, #f57c00); padding:10px 20px; border-radius:20px; font-weight:700; font-size:0.95rem; color:#fff; }
.wt-hero-best i { font-size:1.1rem; }

/* Season Cards */
.wt-seasons-section { margin-bottom:48px; }
.wt-section-header { text-align:center; margin-bottom:32px; }
.wt-section-header h2 { font-size:1.8rem; font-weight:800; color:var(--text-dark); margin:0 0 8px; }
.wt-section-header p { font-size:1rem; color:var(--text-light); margin:0; }
.wt-seasons-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(340px, 1fr)); gap:24px; }
.wt-season-card { border-radius:16px; overflow:hidden; background:var(--white); box-shadow:var(--shadow); transition:var(--transition); }
.wt-season-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-hover); }
.wt-sc-img { height:200px; overflow:hidden; }
.wt-sc-img img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.wt-season-card:hover .wt-sc-img img { transform:scale(1.05); }
.wt-sc-body { padding:20px; }
.wt-sc-header { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.wt-sc-icon-wrap { width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.3rem; flex-shrink:0; }
.wt-sc-header h3 { font-size:1.25rem; font-weight:700; color:var(--text-dark); margin:0; line-height:1.2; }
.wt-sc-months { font-size:0.82rem; color:var(--text-light); }
.wt-sc-weather { display:flex; gap:16px; margin-bottom:12px; padding:10px 14px; background:var(--g50); border-radius:10px; }
.wt-scw-item { display:flex; align-items:center; gap:6px; font-size:0.88rem; color:var(--text-dark); }
.wt-scw-item i { color:var(--primary); }
.wt-sc-desc { font-size:0.9rem; color:#555; line-height:1.6; margin:0 0 14px; }
.wt-sc-highlights, .wt-sc-tips { font-size:0.84rem; line-height:1.45; margin-bottom:8px; padding:8px 12px; border-radius:8px; display:flex; gap:8px; align-items:flex-start; }
.wt-sc-highlights { background:#e8f5e9; color:#2e7d32; }
.wt-sc-highlights i { color:#4caf50; margin-top:2px; }
.wt-sc-tips { background:#fff3e0; color:#e65100; }
.wt-sc-tips i { color:#ff9800; margin-top:2px; }

/* Monthly Weather Table */
.wt-monthly-section { margin-bottom:48px; }
.wt-monthly-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; margin-bottom:32px; }
.wt-monthly-table { width:100%; border-collapse:collapse; font-size:0.9rem; min-width:750px; }
.wt-monthly-table thead th { background:var(--primary); color:#fff; padding:12px 10px; font-weight:600; font-size:0.85rem; text-align:center; white-space:nowrap; }
.wt-monthly-table thead th:first-child { border-radius:10px 0 0 0; }
.wt-monthly-table thead th:last-child { border-radius:0 10px 0 0; }
.wt-monthly-table tbody td { padding:10px; text-align:center; border-bottom:1px solid var(--g100); color:var(--text-dark); }
.wt-monthly-table tbody tr:nth-child(even) td { background:var(--g50); }
.wt-monthly-table tbody tr:hover td { background:#e8f0f8; }
.wt-month-name strong { display:block; font-size:0.92rem; }
.wt-month-name span { display:block; font-size:0.75rem; color:var(--text-light); }
.wt-temp-hi { color:#e74c3c; font-weight:600; }
.wt-temp-lo { color:#3498db; font-weight:600; }
.wt-monthly-tip { text-align:left!important; font-size:0.82rem; color:#666; max-width:200px; }
.wt-aqi-badge { display:inline-block; padding:3px 10px; border-radius:12px; font-weight:700; font-size:0.82rem; color:#fff; }
.wt-aqi-good { background:#27ae60; }
.wt-aqi-moderate { background:#f39c12; }
.wt-aqi-sensitive { background:#e67e22; }
.wt-aqi-unhealthy { background:#e74c3c; }

/* Temperature Chart */
.wt-chart-section { background:var(--white); border-radius:14px; padding:24px; box-shadow:var(--shadow); }
.wt-chart-section h3 { font-size:1.1rem; font-weight:700; color:var(--text-dark); margin:0 0 20px; text-align:center; }
.wt-temp-chart { display:flex; align-items:flex-end; justify-content:center; gap:8px; height:200px; padding:0 4px; }
.wt-tc-bar-wrap { display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; min-width:36px; }
.wt-tc-bar { width:14px; background:linear-gradient(180deg, #e74c3c, #ff6b6b); border-radius:7px 7px 0 0; position:relative; transition:all .3s; }
.wt-tc-bar:hover { width:20px; filter:brightness(1.1); }
.wt-tc-bar span { position:absolute; top:-20px; left:50%; transform:translateX(-50%); font-size:0.68rem; font-weight:700; color:#e74c3c; white-space:nowrap; }
.wt-tc-lo { width:14px; background:linear-gradient(180deg, #3498db, #5dade2); border-radius:7px 7px 0 0; margin-top:4px; }
.wt-tc-label { font-size:0.7rem; color:var(--text-light); margin-top:6px; }
.wt-tc-legend { text-align:center; margin-top:12px; font-size:0.82rem; color:var(--text-light); }
.wt-tcl-hi { display:inline-block; width:12px; height:12px; background:#e74c3c; border-radius:3px; vertical-align:middle; margin-right:4px; }
.wt-tcl-lo { display:inline-block; width:12px; height:12px; background:#3498db; border-radius:3px; vertical-align:middle; margin:0 4px 0 16px; }

/* Packing Guide */
.wt-packing-section { margin-bottom:48px; }
.wt-packing-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:20px; }
.wt-pack-card { background:var(--white); border-radius:14px; padding:24px; box-shadow:var(--shadow); border-top:4px solid; transition:var(--transition); }
.wt-pack-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-hover); }
.wt-pack-spring { border-top-color:#e91e63; }
.wt-pack-summer { border-top-color:#ff6f00; }
.wt-pack-autumn { border-top-color:#d84315; }
.wt-pack-winter { border-top-color:#1565c0; }
.wt-pack-card h3 { font-size:1.1rem; font-weight:700; color:var(--text-dark); margin:0 0 16px; }
.wt-pack-list { margin-bottom:14px; }
.wt-pack-list h4 { font-size:0.9rem; font-weight:700; color:var(--text-dark); margin:0 0 6px; }
.wt-pack-list h4 i { color:var(--primary); margin-right:6px; }
.wt-pack-list p { font-size:0.85rem; color:#666; line-height:1.5; margin:0; }
.wt-pack-extra { padding:10px 14px; background:var(--g50); border-radius:10px; }
.wt-pack-extra h4 i { color:#f9a825; }

/* AQI Guide */
.wt-aqi-section { margin-bottom:48px; }
.wt-aqi-levels { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:16px; margin-bottom:24px; }
.wt-aqi-level { background:var(--white); border-radius:14px; padding:20px; box-shadow:var(--shadow); text-align:center; transition:var(--transition); }
.wt-aqi-level:hover { transform:translateY(-2px); box-shadow:var(--shadow-hover); }
.wt-aqi-bubble { width:90px; height:90px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; margin:0 auto 14px; color:#fff; }
.wt-aqi-bubble i { font-size:1.4rem; margin-bottom:4px; }
.wt-aqi-bubble span { font-size:0.82rem; font-weight:700; }
.wt-aqi-bubble strong { font-size:0.9rem; font-weight:800; margin-top:2px; }
.wt-aqi-level p { font-size:0.85rem; color:var(--text-light); line-height:1.5; margin:0; }
.wt-aqi-tips { background:linear-gradient(135deg, #e8f0fe, #f0f4ff); padding:18px 22px; border-radius:12px; font-size:0.9rem; color:#1a5f7a; line-height:1.6; display:flex; gap:10px; align-items:flex-start; }
.wt-aqi-tips i { font-size:1.1rem; margin-top:2px; flex-shrink:0; }

/* Tips Grid */
.wt-tips-section { margin-bottom:48px; }
.wt-tips-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:16px; }
.wt-tip-card { background:var(--white); border-radius:14px; padding:20px; box-shadow:var(--shadow); display:flex; gap:14px; align-items:flex-start; transition:var(--transition); }
.wt-tip-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-hover); }
.wt-tip-icon { width:44px; height:44px; border-radius:12px; background:linear-gradient(135deg, #1a5f7a, #2980b9); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.1rem; flex-shrink:0; }
.wt-tip-card p { font-size:0.9rem; color:#555; line-height:1.55; margin:0; }

/* CTA */
.wt-weather-cta { text-align:center; padding:40px 24px; background:linear-gradient(135deg, #1a5f7a, #0d3b4e); border-radius:16px; margin-top:32px; }
.wt-weather-cta h3 { font-size:1.5rem; font-weight:800; color:#fff; margin:0 0 8px; }
.wt-weather-cta p { font-size:1rem; color:rgba(255,255,255,0.85); margin:0 0 24px; }
.wt-cta-btn { display:inline-block; padding:14px 32px; background:linear-gradient(135deg, #f9a825, #f57c00); color:#fff; text-decoration:none; border-radius:28px; font-weight:700; font-size:1rem; transition:all .25s; margin:0 8px; }
.wt-cta-btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(249,168,37,0.4); }
.wt-cta-outline { background:transparent; border:2px solid rgba(255,255,255,0.5); color:#fff; }
.wt-cta-outline:hover { border-color:#fff; background:rgba(255,255,255,0.1); box-shadow:none; }

/* Dark Mode — Weather */
body.dark .wt-hero-inner h1 { color:#fff; }
body.dark .wt-section-header h2 { color:#e2e8f0; }
body.dark .wt-section-header p { color:#94a3b8; }
body.dark .wt-season-card { background:#1e293b; }
body.dark .wt-sc-header h3 { color:#e2e8f0; }
body.dark .wt-sc-desc { color:#94a3b8; }
body.dark .wt-sc-weather { background:#0f172a; }
body.dark .wt-scw-item { color:#e2e8f0; }
body.dark .wt-sc-highlights { background:#1a2e1a; color:#66bb6a; }
body.dark .wt-sc-tips { background:#2a1a0a; color:#ffb74d; }
body.dark .wt-monthly-table tbody td { color:#e2e8f0; }
body.dark .wt-monthly-table tbody tr:nth-child(even) td { background:#1a2332; }
body.dark .wt-monthly-table tbody tr:hover td { background:#253045; }
body.dark .wt-monthly-table tbody td { border-color:#2a3545; }
body.dark .wt-monthly-tip { color:#94a3b8; }
body.dark .wt-chart-section { background:#1e293b; }
body.dark .wt-chart-section h3 { color:#e2e8f0; }
body.dark .wt-pack-card { background:#1e293b; }
body.dark .wt-pack-card h3 { color:#e2e8f0; }
body.dark .wt-pack-list h4 { color:#e2e8f0; }
body.dark .wt-pack-list p { color:#94a3b8; }
body.dark .wt-pack-extra { background:#0f172a; }
body.dark .wt-aqi-level { background:#1e293b; }
body.dark .wt-aqi-level p { color:#94a3b8; }
body.dark .wt-aqi-tips { background:#0f172a; color:#7dd3fc; }
body.dark .wt-tip-card { background:#1e293b; }
body.dark .wt-tip-card p { color:#94a3b8; }
body.dark .wt-monthly-table tbody tr:hover td { background:#253045; }

/* Responsive — Weather */
@media (max-width:768px) {
  .wt-hero { min-height:280px; }
  .wt-hero-inner { padding:32px 16px 24px; }
  .wt-hero-inner h1 { font-size:1.5rem; }
  .wt-hero-inner p { font-size:0.9rem; }
  .wt-hero-best { font-size:0.82rem; padding:8px 14px; }
  .wt-seasons-grid { grid-template-columns:1fr; }
  .wt-packing-grid { grid-template-columns:1fr; }
  .wt-aqi-levels { grid-template-columns:1fr 1fr; }
  .wt-tips-grid { grid-template-columns:1fr; }
  .wt-temp-chart { gap:4px; }
  .wt-tc-bar-wrap { min-width:24px; }
  .wt-tc-bar, .wt-tc-lo { width:10px; }
  .wt-cta-btn { display:block; margin:8px 0; }
}