/* Popup ưu đãi khách mới - mọi quy tắc nằm trong .vsw, không tác động phần còn lại của website. */
.vsw { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 16px; font-family: inherit; line-height: 1.5; color: #16133d; }
.vsw[hidden] { display: none; }
.vsw *, .vsw *::before, .vsw *::after { box-sizing: border-box; }
.vsw__backdrop { position: absolute; inset: 0; background: rgba(12, 8, 40, .55); backdrop-filter: blur(2px); animation: vsw-fade .25s ease-out; }
.vsw__dialog { position: relative; width: 100%; max-width: 680px; max-height: calc(100vh - 32px); overflow: auto; background: #f1f0fb; border-radius: 18px; box-shadow: 0 30px 80px rgba(12, 5, 97, .4); animation: vsw-pop .32s cubic-bezier(.2, .9, .3, 1.2); }
.vsw__head { position: relative; padding: 26px 64px 46px; text-align: center; color: #fff; background: radial-gradient(120% 90% at 50% -10%, #3b1fd6 0%, #1800ad 55%, #120a6e 100%); clip-path: ellipse(78% 100% at 50% 0%); }
.vsw__kicker { margin: 0; font-size: clamp(20px, 3.4vw, 27px); font-weight: 800; letter-spacing: -.01em; line-height: 1.25; color: #fff; }
.vsw__close { position: absolute; top: 14px; right: 14px; width: 38px; height: 38px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .85); background: transparent; color: #fff; display: grid; place-items: center; cursor: pointer; padding: 0; transition: background .15s, transform .15s; }
.vsw__close:hover, .vsw__close:focus-visible { background: rgba(255, 255, 255, .18); transform: rotate(90deg); outline: none; }
.vsw__body { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 8px; align-items: center; padding: 6px 28px 26px; }
.vsw__title { margin: 0 0 8px; font-size: clamp(21px, 3vw, 26px); font-weight: 700; line-height: 1.3; color: #16133d; letter-spacing: -.01em; }
.vsw__title span { color: #ff6600; font-weight: 800; }
.vsw__desc { margin: 0 0 18px; font-size: 15px; color: #3b3a52; }
.vsw__label { margin: 0 0 8px; font-size: 14px; font-weight: 600; color: #3b3a52; }
.vsw__code { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 10px 10px 18px; background: #fff; border: 1.5px dashed #b9b3f0; border-radius: 12px; margin-bottom: 14px; }
.vsw__code strong { font-size: 22px; font-weight: 800; letter-spacing: .08em; color: #1800ad; font-variant-numeric: tabular-nums; }
.vsw__copy { display: inline-flex; align-items: center; gap: 6px; border: 0; background: #eef0ff; color: #1800ad; font: inherit; font-size: 15px; font-weight: 700; padding: 8px 12px; border-radius: 9px; cursor: pointer; transition: background .15s; }
.vsw__copy:hover, .vsw__copy:focus-visible { background: #dedaff; outline: none; }
.vsw__copy.is-done { background: #dcfce7; color: #15803d; }
.vsw__cta { display: block; width: 100%; text-align: center; padding: 14px 18px; border-radius: 12px; background: linear-gradient(135deg, #ff6600, #ff8a3d); color: #fff !important; font-size: 16.5px; font-weight: 800; text-decoration: none !important; box-shadow: 0 10px 22px rgba(255, 102, 0, .32); transition: transform .15s, box-shadow .15s; }
.vsw__cta:hover, .vsw__cta:focus-visible { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(255, 102, 0, .38); outline: none; }
.vsw__fine { margin: 10px 0 0; font-size: 12.5px; color: #6b6a80; }
.vsw__art svg { display: block; width: 100%; height: auto; }
@keyframes vsw-fade { from { opacity: 0; } }
@keyframes vsw-pop { from { opacity: 0; transform: translateY(18px) scale(.96); } }
@media (max-width: 640px) {
	.vsw__head { padding: 22px 54px 38px; }
	.vsw__body { grid-template-columns: minmax(0, 1fr); padding: 0 18px 20px; }
	.vsw__art { order: -1; max-width: 190px; margin: -6px auto 0; }
	.vsw__code strong { font-size: 19px; }
}
@media (prefers-reduced-motion: reduce) { .vsw__backdrop, .vsw__dialog { animation: none; } .vsw__close:hover { transform: none; } }