/* Điểm đến — nền xanh lá nhạt (chế độ tối: xanh rừng đậm) */
.dd-sea{--deep:#1c4533;--highlight:#f7b267;--ink-subtle:#a9c0a7;--ink-muted:#cfdccb;--line:#e8f4f633;
  --dd-ink:#f1f3e8;--dd-sub:#a9c0a7;--dd-card:#ffffff10;--dd-card-bd:#e8f4f638;--dd-on:#f8f3e8;--dd-on-ink:#1c4533;--dd-acc:#ff8a50;
  background:radial-gradient(1100px 760px at 78% 38%,#24533f 0%,#183a2c 45%,#0f251c 75%);color:var(--dd-ink)}
html:not(.dark) .dd-sea{--heading:#1c4533;--ink:#1c4533;--ink-muted:#46594c;--ink-subtle:#5d7563;--highlight:#e2560f;--line:#1c453322;
  --dd-ink:#1c4533;--dd-sub:#5d7563;--dd-card:#fff;--dd-card-bd:#c6d9bf;--dd-on:#1c4533;--dd-on-ink:#fff;--dd-acc:#e2560f;
  background:radial-gradient(1000px 720px at 76% 36%,#f6f9f1 0%,#e3eedb 45%,#d2e3c8 88%)}
html:not(.dark) .dd-sea h1{color:#1c4533}
html:not(.dark) .dd-sea h1 em{color:#e2560f}
html:not(.dark) .dd-sea input[data-finder]{background:#fff;box-shadow:0 6px 18px -10px rgba(28,69,51,.4)}
/* bản đồ trên nền sáng */
html:not(.dark) .dd-sea svg[role=img] .vn-n{stroke:#eef4ea;fill:#1c4533}
html:not(.dark) .dd-sea svg[role=img] line{stroke:rgba(28,69,51,.12)}
html:not(.dark) .dd-sea svg[role=img]>g>text{fill:rgba(28,69,51,.5)}
html:not(.dark) .dd-sea svg[role=img]>path:first-of-type{fill:rgba(28,69,51,.06);stroke:rgba(28,69,51,.15)}
html:not(.dark) .dd-sea svg[role=img] rect{stroke:rgba(28,69,51,.35)}
html:not(.dark) .dd-sea svg[role=img] g>text[font-weight="600"]{fill:#1c4533}
html:not(.dark) .dd-sea .ornament-hoivan{filter:invert(1) opacity(.3)}
.dark .dd-sea .vn-n{stroke:#183a2c}
.dd-seaname{font-family:Lora,Georgia,serif;font-style:italic;font-size:22px;fill:#cfe3c9;fill-opacity:.55;letter-spacing:.06em;pointer-events:none}
html:not(.dark) .dd-seaname{fill:#3f6b4f}
/* nút chọn miền */
.dd-regions{display:flex;gap:.6rem;margin-top:1.25rem;overflow-x:auto;scrollbar-width:none;padding:2px}
.dd-regions::-webkit-scrollbar{display:none}
.dd-regions button{flex:0 0 auto;text-align:left;border:1px solid var(--dd-card-bd);border-radius:12px;padding:.6rem 1rem;background:var(--dd-card);color:var(--dd-ink);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.dd-regions button b{display:block;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:1.3rem;line-height:1.1}
.dd-regions button span{font-size:.78rem;color:var(--dd-sub)}
.dd-regions button:hover{border-color:var(--dd-acc)}
.dd-regions button[aria-pressed="true"]{background:var(--dd-on);border-color:var(--dd-on);color:var(--dd-on-ink)}
.dd-regions button[aria-pressed="true"] span{color:inherit;opacity:.7}
.dd-regions button:focus-visible{outline:3px solid var(--dd-acc);outline-offset:2px}
.dd-hint{margin-top:.75rem;font-size:.875rem;color:var(--dd-sub)}
.vnm[data-reg] .dd-hint{display:none}
/* danh sách tỉnh: ẩn khi xem cả nước, chỉ hiện miền đang chọn dạng ô */
.vnm nav[aria-label="Đi tới tỉnh thành"]{grid-template-columns:1fr;align-self:start}
.vnm:not([data-reg]):not([data-q]) nav[aria-label="Đi tới tỉnh thành"]{display:none}
.vnm [data-region]{display:none}
.vnm[data-q] [data-region],.vnm[data-reg="bac"] [data-region="bac"],.vnm[data-reg="trung"] [data-region="trung"],.vnm[data-reg="nam"] [data-region="nam"]{display:block}
.vnm[data-reg]:not([data-q]) [data-region]>p{display:none}
.vnm[data-q] [data-region]>p{color:var(--dd-sub)}
.vnm [data-region] ul{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
@media(max-width:639px){.vnm [data-region] ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
.vnm [data-prov-row]{height:auto!important;display:flex!important;flex-direction:column;align-items:flex-start!important;justify-content:center!important;gap:.1rem!important;
  background:var(--dd-card);border:1px solid var(--dd-card-bd)!important;border-radius:12px;padding:.55rem .8rem;color:var(--dd-ink)!important;font-weight:600;transition:border-color .2s,color .2s,transform .2s}
.vnm [data-prov-row]>span[aria-hidden]{display:none}
.vnm [data-prov-row]::after{content:attr(data-n);font-size:.75rem;font-weight:500;color:var(--dd-sub)}
.vnm [data-prov-row]:hover,.vnm [data-prov-row]:focus-visible{border-color:var(--dd-acc)!important;color:var(--dd-acc)!important;transform:translateY(-1px)}
.vnm[data-q] [data-prov-row].is-dim{display:none!important}
/* bản đồ: làm mờ chấm của miền khác */
.vnm [data-dot]{transition:opacity .25s}
.vnm [data-dot].dd-off{opacity:.2}
/* thẻ mặc định (Huế) chỉ hiện khi xem cả nước hoặc miền Trung */
.vnm[data-reg]:not([data-reg="trung"]):not(:has([data-k]:is(:hover,:focus-visible))) :is([data-card="hue"],[data-lead="hue"],[data-dot="hue"] .vn-ring){display:none!important}
@media(max-width:639px){.dd-regions button{padding:.5rem .8rem}.dd-regions button b{font-size:1.15rem}}
@media(prefers-reduced-motion:reduce){.vnm [data-prov-row],.vnm [data-dot]{transition:none}}
.vnm[data-q] li:has(>.is-dim){display:none}
.vnm[data-q] [data-region]:not(:has([data-prov-row]:not(.is-dim))){display:none}
.vnm[data-q] .dd-hint{display:none}
.dd-sea nav[aria-label="Đường dẫn"] svg{color:var(--dd-sub)}
/* phần đầu gọn hơn */
.dd-sea h1{font-size:clamp(2.4rem,4.6vw,4.25rem)!important;margin-top:.5rem!important}
.dd-sea h1+p{font-size:1.05rem!important;margin-top:.9rem!important}
.dd-sea p.mt-8.uppercase{margin-top:1.25rem!important;font-size:.72rem!important}
.dd-sea form[data-finder-form]{margin-top:1.25rem!important}
.dd-sea input[data-finder]{height:2.9rem!important;font-size:.95rem!important;border-radius:12px!important}
.dd-regions{margin-top:.9rem;gap:.5rem}
.dd-regions button{padding:.45rem .85rem;border-radius:10px}
.dd-regions button b{font-size:1.1rem}
.dd-regions button span{font-size:.72rem}
.dd-hint{font-size:.8rem;margin-top:.55rem}
@media(min-width:1100px){.dd-sea .vnm{grid-template-columns:minmax(0,1fr) minmax(0,29rem)!important;column-gap:3rem!important}}
/* thu hẹp khung: nội dung và bản đồ gần nhau hơn */
@media(min-width:1100px){.dd-sea .vnm{max-width:68rem;margin-left:auto;margin-right:auto;column-gap:2.5rem!important;grid-template-columns:minmax(0,1fr) minmax(0,30rem)!important}}
/* Điểm đến: dải Localis Trip chạy ngang */
.dd-trip-sub{color:var(--ink-muted);font-size:.95rem;max-width:36rem}
.dd-trip-sub a{color:var(--heading);font-weight:600;border-bottom:1.5px solid #fd5100;white-space:nowrap;margin-left:.25rem}
.dd-trip-sub a:hover{color:#c2410c}
.dd-mq{overflow:hidden;margin-top:1.75rem;padding:.5rem 0 1.25rem;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.dd-mq__track{display:flex;gap:1.1rem;width:max-content;margin:0;padding:0;list-style:none;animation:dd-mq 45s linear infinite}
.dd-mq__track>li{flex:none;width:19rem;display:flex}
.dd-mq__track .hp-card{width:100%}
@keyframes dd-mq{to{transform:translateX(calc(-50% - .55rem))}}
@media(max-width:639px){.dd-mq__track>li{width:15rem}.dd-mq__track{animation-duration:32s}}
@media(prefers-reduced-motion:reduce){.dd-mq{overflow-x:auto;-webkit-mask-image:none;mask-image:none}.dd-mq__track{animation:none}}
.dd-trip-more{display:flex;justify-content:flex-end;margin-top:.25rem}
.dd-trip-more a{font-weight:600;color:var(--heading);border-bottom:1.5px solid #fd5100;padding-bottom:.1rem}
.dd-trip-more a:hover{color:#c2410c}
/* khung đầu gọn thêm */
@media(min-width:1100px){.dd-sea .vnm{max-width:60rem;column-gap:2rem!important;grid-template-columns:minmax(0,1fr) minmax(0,25rem)!important}}
.dd-sea h1{font-size:clamp(2.1rem,3.8vw,3.4rem)!important}
.dd-sea h1+p{font-size:.95rem!important}
.dd-sea input[data-finder]{height:2.6rem!important;font-size:.9rem!important}
.dd-regions button{padding:.35rem .7rem}
.dd-regions button b{font-size:1rem}
.vnm [data-region] ul{gap:.4rem}
.vnm [data-prov-row]{padding:.4rem .65rem;font-size:.85rem;border-radius:9px}
.vnm [data-prov-row]::after{font-size:.68rem}
.dd-sea .vnm [data-prov-row]{padding:.35rem .6rem!important;font-size:.82rem!important;min-height:0!important;line-height:1.25}
.dd-sea .vnm [data-region] ul{gap:.35rem!important}
.dd-sea .vnm nav[aria-label="Đi tới tỉnh thành"]{margin-top:-.5rem}
/* chữ phần đầu to hơn */
.dd-sea p.mt-8.uppercase{font-size:.85rem!important}
.dd-sea h1{font-size:clamp(2.6rem,4.8vw,4.3rem)!important}
.dd-sea h1+p{font-size:1.15rem!important;line-height:1.6}
.dd-sea input[data-finder]{height:3rem!important;font-size:1.02rem!important}
.dd-regions button{padding:.5rem .9rem}
.dd-regions button b{font-size:1.25rem}
.dd-regions button span{font-size:.85rem}
.dd-hint{font-size:.92rem}
.dd-sea .vnm [data-prov-row]{font-size:.95rem!important;padding:.45rem .7rem!important}
.dd-sea .vnm [data-prov-row]::after{font-size:.78rem}

/* Căn lề đầu trang Điểm đến theo khung chung của site (thẳng hàng với logo/menu) */
@media(min-width:1100px){.dd-sea .vnm{max-width:none!important;margin-left:0!important;margin-right:0!important;column-gap:3.5rem!important;grid-template-columns:minmax(0,1fr) minmax(0,30rem)!important}}

/* Dải Localis Trip: tự chạy bằng JS + 2 mũi tên trái/phải để người dùng tự xem */
.dd-mq-wrap{position:relative}
.dd-mq.dd-js{overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.dd-mq.dd-js::-webkit-scrollbar{display:none}
.dd-mq.dd-js .dd-mq__track{animation:none}
.dd-mq-arr{position:absolute;top:calc(50% - .375rem);z-index:3;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid var(--line,#1c453329);background:var(--paper,#f1f3e8);color:var(--heading,#1c4533);cursor:pointer;box-shadow:0 10px 24px -10px rgb(28 69 51/.55);transform:translateY(-50%);transition:background-color .25s,color .25s,transform .25s,box-shadow .25s}
.dd-mq-arr:hover{background:var(--deep,#1c4533);color:#f1f3e8;transform:translateY(-50%) scale(1.06)}
.dd-mq-arr:active{transform:translateY(-50%) scale(.94)}
.dd-mq-arr:focus-visible{outline:2px solid var(--brand-orange,#fd5100);outline-offset:3px}
.dd-mq-arr--prev{left:-10px}
.dd-mq-arr--next{right:-10px}
.dd-mq-arr svg{width:20px;height:20px}
@media(max-width:639px){.dd-mq-arr{width:38px;height:38px}.dd-mq-arr--prev{left:-4px}.dd-mq-arr--next{right:-4px}}

/* Căn đều cột trái đầu trang Điểm đến: 3 nút miền chia đều đúng bằng ô tìm kiếm, mép trái thẳng hàng */
.dd-regions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;padding:2px 0;overflow:visible}
.dd-regions button{flex:none;width:100%;padding:.7rem 1rem}
.dd-sea .vnm .text-lede{max-width:none}
@media(max-width:420px){.dd-regions{gap:.5rem}.dd-regions button{padding:.55rem .65rem}.dd-regions button b{font-size:1.15rem}}