#vl-phanrang-promo[hidden] { display:none; }
#vl-phanrang-promo { position:fixed; z-index:900; right:24px; bottom:24px; width:min(420px,calc(100vw - 32px)); background:#172d3a; color:#f5f9fc; border:1px solid #35606b; border-radius:22px; overflow:hidden; box-shadow:0 20px 70px #0006; }
#vl-phanrang-promo > img { display:block; width:100%; height:160px; object-fit:cover; object-position:center 65%; }
.vl-phanrang-copy { padding:20px; }
.vl-phanrang-copy small { color:#43d5c6; font-size:11px; font-weight:700; letter-spacing:.06em; }
#vl-phanrang-promo h2 { margin:8px 0 12px; color:#fff; font-size:27px; line-height:1.15; }
#vl-phanrang-promo p { margin:10px 0; color:#d4e3e9; font-size:15px; line-height:1.5; }
.vl-phanrang-copy strong { display:block; color:#fff; font-size:21px; margin-top:6px; }
.vl-phanrang-copy a { display:block; margin-top:16px; padding:13px 20px; border-radius:12px; text-align:center; background:#21c6b4; color:#072d33; font-weight:700; text-decoration:none; }
#vl-phanrang-promo .vl-phanrang-close { position:absolute; right:10px; top:10px; width:36px; height:36px; border:0; border-radius:50%; background:#102b39; color:white; font-size:26px; cursor:pointer; }
#vl-phanrang-promo :focus-visible { outline:3px solid #fff; outline-offset:3px; }
.phanrang-media { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.phanrang-media figure { margin:0; }
.phanrang-media img,.phanrang-media video { width:100%; max-height:480px; object-fit:contain; border-radius:16px; background:#142833; }
@media(max-width:600px) { #vl-phanrang-promo { right:16px; bottom:16px; } #vl-phanrang-promo > img { height:120px; } .vl-phanrang-copy { padding:16px; } .phanrang-media { grid-template-columns:1fr; } }

.phanrang-book { display:inline-flex; align-items:center; padding:14px 22px; border-radius:12px; background:#21c6b4; color:#072d33 !important; font-weight:700; text-decoration:none !important; }

/* Trip media: a compact gallery with natural image proportions. */
body .phanrang-media { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; padding:20px; margin:24px 0 32px; border:1px solid #365363; border-radius:22px; background:#172d3a; }
body .phanrang-media figure { min-width:0; margin:0; }
body .phanrang-media img { display:block; width:100%; height:auto; max-height:none; aspect-ratio:1; object-fit:cover; border-radius:14px; }
body .phanrang-media video { display:block; width:100%; height:auto; max-height:420px; aspect-ratio:4/3; object-fit:contain; border-radius:14px; background:#0e202b; }
body .phanrang-media figcaption { padding:10px 2px 0; color:#c4d8e2; font-size:14px; line-height:1.5; }
@media(max-width:600px) { body .phanrang-media { grid-template-columns:1fr; padding:12px; gap:18px; border-radius:18px; } body .phanrang-media video { max-height:360px; } }
/* Override article-wide image sizing inside this gallery only. */
body .article-body .phanrang-media { align-items:start; }
body .article-body .phanrang-media > figure { width:100%; min-width:0; max-width:none; margin:0 !important; padding:0; clear:none; align-self:start; }
body .article-body .phanrang-media figure > img,
body .article-body .phanrang-media figure > img.article-photo,
body .article-body .phanrang-media figure > video { display:block; width:100% !important; max-width:100% !important; height:auto !important; max-height:none !important; aspect-ratio:4/3; margin:0 !important; float:none !important; box-sizing:border-box; border-radius:14px; object-fit:contain; background:#0e202b; transform:none; }
body .article-body .phanrang-media figcaption { margin:0; padding:10px 2px 0; max-width:none; text-align:left; }
body .article-body .phanrang-media > p:empty { display:none; }
/* Photos fill their cards; video playback retains the complete frame. */
body .article-body .phanrang-media figure > img,
body .article-body .phanrang-media figure > img.article-photo { object-fit:cover !important; }