/* Detail67: route content only. Shared navigation, consent and price controls keep their own styles. */
.nht67-route-detail {
  --nht67-navy: #10384c;
  --nht67-ink: #173b4c;
  --nht67-teal: #176775;
  --nht67-muted: #4b6470;
  --nht67-gold: #d4ad63;
  --nht67-line: #dce5e6;
  --nht67-paper: #f8f9f6;
}
.nht67-detail { color: var(--nht67-ink); background: #fff; }
.nht67-detail *, .nht67-detail *::before, .nht67-detail *::after { box-sizing: border-box; }
.nht67-detail :is(.wrap, .nht67-main) { width: min(1180px, calc(100% - 64px)); margin-inline: auto; }
.nht67-detail :is(h1, h2, h3, p, figure) { margin-top: 0; }
.nht67-detail :is(h1, h2, h3) { color: var(--nht67-navy); text-wrap: balance; }
.nht67-detail a:focus-visible { outline: 3px solid #a87523; outline-offset: 4px; border-radius: 5px; }
.nht67-detail [id] { scroll-margin-top: 116px; }
.nht67-detail :is(.nht67-kicker, .eyebrow) {
  display: block; color: #77551f; font-size: 12px; font-weight: 750;
  line-height: 1.65; letter-spacing: .09em; text-transform: uppercase; margin-bottom: 12px;
}
.nht67-top { background: linear-gradient(120deg, #faf8f1 10%, #edf4f1); border-bottom: 1px solid #e5eae5; }
.nht67-detail .nh-s-breadcrumb { padding-top: 15px; margin-bottom: 0; gap: 10px; }
.nht67-detail .nh-s-breadcrumb :is(a, span) { font-size: 13px; line-height: 1.7; color: var(--nht67-muted); }
.nht67-detail .nh-s-breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: 4px; }
.nht67-detail .nht67-hero {
  display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .88fr); gap: 56px;
  padding-block: 24px 46px; align-items: center;
}
.nht67-hero-copy { min-width: 0; }
.nht67-detail .nht67-hero h1 {
  font-size: clamp(34px, 3.8vw, 50px); line-height: 1.2; letter-spacing: -.035em;
  font-weight: 700; margin: 0 0 18px; max-width: 650px;
}
.nht67-detail .nht67-intro { font-size: 16px; line-height: 1.8; color: var(--nht67-muted); margin: 0 0 18px; max-width: 650px; }
.nht67-chips { display: flex; flex-wrap: wrap; list-style: none; gap: 7px; margin: 0 0 21px; padding: 0; }
.nht67-detail .nht67-chips li {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 650;
  line-height: 1.5; padding: 6px 10px; border: 1px solid #c9dbd8; border-radius: 7px;
  color: #315c62; background: #ffffffa8;
}
.nht67-chips li::before { content: ""; width: 5px; height: 5px; flex: none; border-radius: 50%; background: #357782; }
.nht67-price-badge {
  display: grid; gap: 3px; width: fit-content; max-width: 100%; padding: 15px 20px;
  border: 1px solid #d7e3e0; border-left: 4px solid var(--nht67-teal); border-radius: 0 13px 13px 0;
  background: #fff; box-shadow: 0 8px 22px #10384c05; margin: 0 0 20px;
}
.nht67-price-badge > span { font-size: 13px; font-weight: 650; color: var(--nht67-muted); }
.nht67-detail .nht67-price-badge strong { display: block; font-size: clamp(28px, 3vw, 36px); line-height: 1.25; color: var(--nht67-teal); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.nht67-price-badge small { display: block; font-size: 12px; line-height: 1.65; color: var(--nht67-muted); }
.nht67-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.nht67-actions .nh-s-cta { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; width: 100%; }
.nht67-detail .nht67-actions :is(.btn, .nh-s-button) {
  display: inline-flex; justify-content: center; align-items: center; gap: 8px;
  min-height: 52px; padding: 13px 20px; border-radius: 10px; font-size: 15px;
  font-weight: 700; line-height: 1.55; text-decoration: none;
}
.nht67-detail .nht67-actions .btn:not(.btn-outline),
.nht67-detail .nht67-actions .nh-s-button-zalo { color: #fff; background: var(--nht67-navy); border-color: var(--nht67-navy); }
.nht67-detail .nht67-actions :is(.btn-outline, .nh-s-button-hotline) { color: var(--nht67-navy); background: #fff; border: 1px solid #aabec1; }
.nht67-detail .nht67-price-link { display: inline-flex; align-items: center; min-height: 46px; margin-top: 5px; font-size: 13px; line-height: 1.7; font-weight: 650; color: var(--nht67-teal); text-decoration: underline; text-underline-offset: 4px; }
.nht67-detail .nht67-hero-copy .ride56-summary { margin-top: 12px; font-size: 12px; }
.nht67-hero-visual {
  position: relative; min-width: 0; padding: 0; margin: 0; overflow: hidden; border-radius: 24px 24px 24px 68px;
  background: #e7efeb; border: 1px solid #c9d8d3; box-shadow: 0 20px 45px #10384c12;
}
.nht67-hero-visual img { display: block; width: 100%; height: 420px; object-fit: cover; }
.nht67-hero-visual figcaption {
  position: absolute; inset: auto 0 0; padding: 30px 28px 22px; margin: 0;
  background: linear-gradient(0deg, #082d3df5, #082d3dd6 70%, transparent);
  color: #fff; font-size: 13px; line-height: 1.65;
}
.nht67-hero-visual figcaption strong { display: block; color: #fff; font-size: 20px; font-weight: 650; line-height: 1.45; margin-bottom: 3px; }
.nht67-hero-visual figcaption small { color: #e3eceb; font-size: 11px; }
.nht67-detail .nht67-jump { display: flex; flex-wrap: wrap; align-items: center; gap: 0 28px; padding-block: 12px; border-bottom: 1px solid var(--nht67-line); }
.nht67-jump a { display: inline-flex; align-items: center; min-height: 46px; font-size: 14px; line-height: 1.6; font-weight: 650; color: var(--nht67-navy); text-decoration: none; }
.nht67-jump a:first-child { color: var(--nht67-teal); }
.nht67-main { padding-bottom: 56px; }
.nht67-detail .nht67-prices { padding-block: 52px 30px; }
.nht67-detail .section-head { display: block; max-width: 840px; margin-bottom: 24px; }
.nht67-detail .section-head h2 { font-size: clamp(27px, 2.8vw, 36px); margin: 0 0 12px; line-height: 1.3; }
.nht67-detail .section-head p { color: var(--nht67-muted); margin: 0; font-size: 16px; line-height: 1.8; }
.nht67-detail .nht62-note { font-size: 14px; background: #f5f8f6; margin: 20px 0; }
.nht67-detail .nht62-note p { font-size: 14px; line-height: 1.8; }
.nht67-reading { display: grid; grid-template-columns: minmax(0, 1fr) 292px; gap: 28px; align-items: start; padding-block: 24px 12px; }
.nht67-prose { min-width: 0; max-width: none; }
.nht67-detail .nht67-prose :is(p, li) { color: var(--nht67-muted); font-size: 16px; line-height: 1.85; }
.nht67-detail .nht67-prose p { margin: 0 0 16px; }
.nht67-detail .nht67-prose > p:first-child { padding: 22px 26px; border-left: 3px solid var(--nht67-gold); background: #fbf8ef; border-radius: 0 12px 12px 0; }
.nht67-detail .nht67-prose h2 { font-size: 25px; line-height: 1.4; margin: 0 0 18px; }
.nht67-detail .nht67-prose h3 { font-size: 18px; line-height: 1.5; margin: 25px 0 9px; }
.nht67-prose-section { padding: 27px; border: 1px solid var(--nht67-line); border-radius: 16px; margin-bottom: 20px; background: #fff; }
.nht67-prose-section h2::before { content: ""; display: block; height: 3px; width: 34px; background: var(--nht67-gold); border-radius: 3px; margin-bottom: 16px; }
.nht67-prose-section > :last-child { margin-bottom: 0; }
.nht67-prose-section ul { padding-left: 21px; margin: 16px 0; }
.nht67-prose-section li { padding-left: 4px; margin-bottom: 11px; }
.nht67-prose-section li::marker { color: var(--nht67-teal); }
.nht67-prose-section a { color: var(--nht67-teal); text-decoration: underline; text-underline-offset: 4px; }
.nht67-help { min-width: 0; padding: 25px; border-radius: 16px; background: #eff5f2; border: 1px solid #d7e5de; }
.nht67-detail .nht67-help h2 { font-size: 22px; margin: 0 0 12px; line-height: 1.4; }
.nht67-detail .nht67-help :is(p, li) { color: #3d5d62; font-size: 14px; line-height: 1.8; }
.nht67-help ul { list-style: none; margin: 18px 0; padding: 0; }
.nht67-help li { position: relative; padding: 12px 0 12px 20px; border-top: 1px solid #d1dfd9; }
.nht67-help li::before { content: "✓"; position: absolute; left: 0; color: #296b62; font-size: 12px; font-weight: 700; }
.nht67-help > a { display: flex; align-items: center; min-height: 48px; font-size: 14px; font-weight: 700; color: var(--nht67-navy); text-underline-offset: 4px; }
.nht67-help .nht67-actions .nh-s-cta { flex-direction: column; }
.nht67-help .nht67-actions :is(.btn, .nh-s-button) { width: 100%; padding-inline: 10px; font-size: 14px; }
.nht67-detail .ride56 { width: 100%; margin-block: 34px 42px; }
.nht67-detail .ride56 .ride56-grid { gap: 16px; }
.nht67-detail .ride56 .ride56-card { border-radius: 16px; }
.nht67-booking { padding: 32px; border: 1px solid #d7e1db; border-radius: 22px; background: linear-gradient(120deg, #f2f6f2, #fbf8ef); margin-block: 28px 44px; }
.nht67-detail .nht67-booking h2 { font-size: clamp(27px, 2.8vw, 36px); margin: 0 0 14px; }
.nht67-detail .nht67-booking > p,
.nht67-detail .nht67-booking > div > p { font-size: 16px; color: var(--nht67-muted); max-width: 840px; }
.nht67-booking ol { list-style: none; counter-reset: nht67-step; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding: 24px 0; margin: 0; }
.nht67-booking ol li { counter-increment: nht67-step; min-width: 0; padding-top: 15px; border-top: 1px solid #c7d6ce; }
.nht67-booking ol li::before { content: "0" counter(nht67-step); display: block; color: #7a5923; font-size: 13px; font-weight: 750; letter-spacing: .08em; margin-bottom: 11px; }
.nht67-booking li > strong { font-size: 17px; line-height: 1.55; color: var(--nht67-navy); }
.nht67-detail .nht67-booking li p { font-size: 14px; color: var(--nht67-muted); line-height: 1.8; margin: 8px 0 0; }
.nht67-booking li > span { display: block; font-size: 14px; color: var(--nht67-muted); line-height: 1.8; margin-top: 8px; }
.nht67-detail .nht67-related h2 { font-size: clamp(27px, 2.8vw, 36px); margin-bottom: 14px; }
.nht67-related .nht62-directory { margin: 24px 0; gap: 14px; }
.nht67-related .nht62-directory a { min-height: 178px; padding: 22px; border-radius: 15px; border-top: 3px solid #d0b16e; box-shadow: 0 4px 18px #10384c04; }
.nht67-related .nht62-directory strong { font-size: 18px; line-height: 1.5; }
.nht67-related .nht62-directory span { font-size: 14px; line-height: 1.7; color: var(--nht67-muted); }
.nht67-related .nht62-directory small { font-size: 12px; font-weight: 700; color: var(--nht67-teal); padding-top: 14px; margin-top: auto; }
.nht67-related > p { display: flex; gap: 10px 22px; flex-wrap: wrap; }
.nht67-related > p a { display: inline-flex; align-items: center; min-height: 46px; font-size: 14px; color: var(--nht67-teal); text-underline-offset: 4px; }

/* Existing route templates share the same restrained card and section treatment. */
.nht67-route-detail .nht-landing .nh-l-top { background: linear-gradient(120deg, #faf8f1, #edf4f1); }
.nht67-route-detail .nht-landing .nh-l-hero { padding-bottom: 44px; gap: 44px; }
.nht67-route-detail .nht-landing .nh-l-hero-image,
.nht67-route-detail .nht-landing .nh-l-route-art { border-radius: 24px 24px 24px 68px; }
.nht67-route-detail .nht-landing .nh-l-price-pair { background: #fff; border-color: #ccdcd7; box-shadow: 0 6px 22px #10384c05; }
.nht67-route-detail .nht-landing .nh-l-section-nav { border-top: 1px solid #d9e5df; }
.nht67-route-detail .nht-landing .nh-l-section { padding-block: 56px; }
.nht67-route-detail .nht-landing .nh-l-benefit { padding: 24px; border: 1px solid #dce5e2; border-top: 3px solid #c4a568; border-radius: 15px; background: #fbfcfa; }
.nht67-route-detail .nht-landing .nh-l-benefits { gap: 20px; }
.nht67-route-detail .nht-landing .nh-l-group-links a { border-radius: 12px; background: #f9fbf8; }
.nht67-route-detail .vp53-top { background: radial-gradient(ellipse at 100% 0, #266276 0, transparent 65%), #10384c; border-bottom: 1px solid #285466; }
.nht67-route-detail .vp53-hero { gap: 44px; padding-block: 30px; }
.nht67-route-detail .vp53 h1 { font-size: clamp(33px, 3.7vw, 49px); line-height: 1.23; }
.nht67-route-detail .vp53-price-focus { border: 1px solid #dce6e3; box-shadow: 0 18px 44px #00101d2b; border-radius: 20px; position: relative; }
.nht67-route-detail .vp53-price-focus::before { content: ""; display: block; width: 38px; height: 4px; background: #bd9650; border-radius: 3px; margin-bottom: 20px; }
.nht67-route-detail .vp53-highlights { gap: 20px; border: 0; padding-block: 32px; }
.nht67-route-detail .vp53-highlights article { border: 1px solid #dce5e2; background: #fff; padding: 24px; border-radius: 15px; }
.nht67-route-detail .vp53-highlights h2 { font-size: 20px; }
.nht67-route-detail .vp53-section { padding-block: 40px; }
.nht67-route-detail .vp53-editorial-grid { gap: 20px; }
.nht67-route-detail .vp53-editorial-grid article { padding: 26px; background: #fff; border: 1px solid #dce5e2; border-radius: 16px; }
.nht67-route-detail .vp53-editorial-grid h3 { font-size: 22px; }
.nht67-route-detail .vp53-booking { padding: 32px; border: 1px solid #d5e1d9; background: linear-gradient(120deg, #eef5ef, #faf6eb); margin-bottom: 12px; }
.nht67-route-detail .vp53-related-grid > a { border-top: 3px solid #c4a568; }

@media (hover: hover) and (pointer: fine) {
  .nht67-jump a:hover, .nht67-help > a:hover { color: #77551f; }
  .nht67-related .nht62-directory a:hover { background: #faf8ef; border-color: #c3a15f; box-shadow: 0 8px 22px #10384c08; }
  .nht67-detail .nht67-actions :is(.btn, .nh-s-button):hover { transform: translateY(-1px); }
}
@media (max-width: 1000px) {
  .nht67-detail :is(.wrap, .nht67-main) { width: calc(100% - 48px); }
  .nht67-detail .nht67-hero { gap: 30px; grid-template-columns: minmax(0, 1.15fr) minmax(0, .9fr); }
  .nht67-hero-visual img { height: 390px; }
  .nht67-reading { grid-template-columns: minmax(0, 1fr) 255px; gap: 22px; }
  .nht67-help, .nht67-prose-section { padding: 22px; }
  .nht67-related .nht62-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nht67-route-detail .vp53-highlights article { padding: 20px; }
}
@media (max-width: 760px) {
  .nht67-detail :is(.wrap, .nht67-main) { width: calc(100% - 32px); }
  .nht67-detail [id] { scroll-margin-top: 94px; }
  .nht67-detail .nh-s-breadcrumb { padding-top: 6px; gap: 7px; }
  .nht67-detail .nh-s-breadcrumb :is(a, span) { font-size: 12px; }
  .nht67-detail .nht67-hero { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-block: 16px 28px; }
  .nht67-detail .nht67-hero h1 { font-size: clamp(31px, 7vw, 39px); margin-bottom: 15px; line-height: 1.23; }
  .nht67-detail .nht67-intro { font-size: 15px; line-height: 1.8; margin-bottom: 16px; }
  .nht67-detail .nht67-kicker { font-size: 11px; margin-bottom: 10px; }
  .nht67-chips { gap: 6px; margin-bottom: 17px; }
  .nht67-detail .nht67-chips li { font-size: 11px; padding: 6px 8px; }
  .nht67-price-badge { width: 100%; padding: 14px 17px; margin-bottom: 18px; }
  .nht67-detail .nht67-price-badge strong { font-size: 31px; }
  .nht67-price-badge small { font-size: 12px; }
  .nht67-detail .nht67-actions :is(.btn, .nh-s-button) { flex: 1 1 0; padding-inline: 12px; font-size: 14px; min-height: 52px; }
  .nht67-detail .nht67-actions .nh-s-cta { display: flex; gap: 8px; }
  .nht67-hero-visual { border-radius: 17px 17px 17px 42px; }
  .nht67-hero-visual img { height: 235px; }
  .nht67-hero-visual figcaption { padding: 25px 20px 18px; font-size: 12px; }
  .nht67-hero-visual figcaption strong { font-size: 18px; }
  .nht67-detail .nht67-jump { gap: 0 22px; padding-block: 8px; }
  .nht67-jump a { min-height: 44px; font-size: 13px; }
  .nht67-main { padding-bottom: 36px; }
  .nht67-detail .nht67-prices { padding-block: 34px 16px; }
  .nht67-detail .section-head { margin-bottom: 20px; }
  .nht67-detail .section-head h2 { font-size: 27px; line-height: 1.35; }
  .nht67-detail .section-head p { font-size: 15px; }
  .nht67-reading { grid-template-columns: minmax(0, 1fr); gap: 0; padding-top: 16px; }
  .nht67-prose-section { padding: 22px 20px; margin-bottom: 16px; border-radius: 13px; }
  .nht67-detail .nht67-prose :is(p, li) { font-size: 15px; line-height: 1.85; }
  .nht67-detail .nht67-prose h2 { font-size: 23px; }
  .nht67-detail .nht67-prose h3 { font-size: 18px; }
  .nht67-detail .nht67-prose > p:first-child { padding: 19px; }
  .nht67-help { padding: 23px 20px; margin-top: 4px; }
  .nht67-help .nht67-actions .nh-s-cta { flex-direction: row; }
  .nht67-detail .ride56 { margin-block: 32px; }
  .nht67-booking { padding: 25px 20px; margin-block: 24px 34px; border-radius: 16px; }
  .nht67-detail .nht67-booking h2 { font-size: 28px; }
  .nht67-detail .nht67-booking > p,
  .nht67-detail .nht67-booking > div > p { font-size: 15px; }
  .nht67-booking ol { grid-template-columns: minmax(0, 1fr); gap: 18px; padding-block: 18px 24px; }
  .nht67-booking ol li { position: relative; padding: 16px 0 0 36px; }
  .nht67-booking ol li::before { position: absolute; top: 18px; left: 0; margin: 0; }
  .nht67-detail .nht67-related h2 { font-size: 27px; }
  .nht67-related .nht62-directory { gap: 12px; }
  .nht67-related .nht62-directory a { padding: 18px; min-height: 160px; }
  .nht67-related .nht62-directory strong { font-size: 16px; }
  .nht67-related .nht62-directory span { font-size: 13px; }
  .nht67-related > p { gap: 6px 14px; }
  .nht67-route-detail .nht-landing .nh-l-hero { gap: 25px; padding-bottom: 28px; }
  .nht67-route-detail .nht-landing .nh-l-hero-image,
  .nht67-route-detail .nht-landing .nh-l-route-art { border-radius: 17px 17px 17px 42px; }
  .nht67-route-detail .nht-landing .nh-l-section { padding-block: 38px; }
  .nht67-route-detail .nht-landing .nh-l-benefit { padding: 22px; }
  .nht67-route-detail .nht-landing .nh-l-count { position: static; display: block; margin-bottom: 12px; }
  .nht67-route-detail .vp53-hero { padding-block: 22px; gap: 24px; }
  .nht67-route-detail .vp53 h1 { font-size: 34px; }
  .nht67-route-detail .vp53-price-focus { padding: 23px; border-radius: 16px; }
  .nht67-route-detail .vp53-highlights { padding-block: 25px; gap: 12px; }
  .nht67-route-detail .vp53-highlights article { padding: 20px; }
  .nht67-route-detail .vp53-highlights article > span { grid-row: 1 / 3; }
  .nht67-route-detail .vp53-section { padding-block: 30px; }
  .nht67-route-detail .vp53-editorial-grid article { padding: 22px 20px; }
  .nht67-route-detail .vp53-booking { padding: 26px 20px; }
}
@media (max-width: 380px) {
  .nht67-detail :is(.wrap, .nht67-main) { width: calc(100% - 28px); }
  .nht67-detail .nht67-hero h1 { font-size: 31px; }
  .nht67-detail .nht67-actions :is(.btn, .nh-s-button) { font-size: 13px; padding-inline: 10px; }
  .nht67-hero-visual img { height: 205px; }
  .nht67-related .nht62-directory { grid-template-columns: minmax(0, 1fr); }
  .nht67-related .nht62-directory a { min-height: 138px; }
  .nht67-prose-section { padding: 21px 17px; }
  .nht67-route-detail .vp53 h1 { font-size: 31px; }
}
@media (prefers-reduced-motion: reduce) {
  .nht67-detail *, .nht67-detail *::before, .nht67-detail *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
  .nht67-detail .nht67-actions :is(.btn, .nh-s-button):hover { transform: none; }
}