/* VYR Slideshow v2 - tách riêng để không ảnh hưởng CSS bài viết/TOC và các module ổn định. */
.vyr-showcase-v2{
  position:relative;
  width:100%;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:var(--vyr-showcase-ratio,1.777778);
  overflow:hidden;
  background:var(--vyr-showcase-bg,#0f172a);
  border-radius:var(--vyr-card-radius,12px);
  isolation:isolate;
}
.vyr-showcase-v2.vyr-showcase--bordered{border:1px solid var(--vyr-showcase-border,#e2e8f0)}
.vyr-showcase-v2.vyr-showcase--borderless{border:0}
.vyr-showcase-v2 .vyr-showcase-track{position:absolute;inset:0;height:auto!important;min-height:0!important;overflow:hidden}
.vyr-showcase-v2 .vyr-showcase-slide{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;z-index:1;transition:opacity .58s ease,transform .58s cubic-bezier(.2,.7,.2,1);overflow:hidden}
.vyr-showcase-v2 .vyr-showcase-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;z-index:2}
.vyr-showcase-v2 .vyr-showcase-media{overflow:hidden;background:var(--vyr-showcase-bg,#0f172a)}
.vyr-showcase-v2 .vyr-showcase-media,.vyr-showcase-v2 .vyr-showcase-media img{width:100%;height:100%}
.vyr-showcase-v2 .vyr-showcase-media img{display:block;max-width:none;transform-origin:center center;backface-visibility:hidden}
.vyr-showcase-v2 .vyr-image-fit-contain img{object-fit:var(--vyr-showcase-contain-fit,contain)!important}
.vyr-showcase-v2 .vyr-image-fit-cover img{object-fit:cover!important}
/* V2 không dùng lớp phủ gradient cứng của Slideshow cũ; nền chữ/opacity đã có thiết lập riêng. */
.vyr-showcase-v2.vyr-showcase--cover .vyr-showcase-slide::after{display:none!important;content:none!important}
.vyr-showcase-v2 .vyr-showcase-media img{object-position:center center}

/* Chuyển giữa các slide. */
.vyr-showcase-v2.vyr-showcase--transition-fade .vyr-showcase-slide{transform:none}
.vyr-showcase-v2.vyr-showcase--transition-slide-left .vyr-showcase-slide{transform:translateX(7%)}
.vyr-showcase-v2.vyr-showcase--transition-slide-left .vyr-showcase-slide.is-active{transform:translateX(0)}
.vyr-showcase-v2.vyr-showcase--transition-slide-right .vyr-showcase-slide{transform:translateX(-7%)}
.vyr-showcase-v2.vyr-showcase--transition-slide-right .vyr-showcase-slide.is-active{transform:translateX(0)}
.vyr-showcase-v2.vyr-showcase--transition-zoom .vyr-showcase-slide{transform:scale(1.025)}
.vyr-showcase-v2.vyr-showcase--transition-zoom .vyr-showcase-slide.is-active{transform:scale(1)}

/* Chuyển động ảnh: chỉ transform/opacity để nhẹ GPU. */
.vyr-showcase-v2 .vyr-image-motion-none img{transform:none}
.vyr-showcase-v2 .is-active .vyr-image-motion-kenburns-in img{animation:vyr-img-kenburns-in var(--vyr-motion-duration,8s) ease-out both}
.vyr-showcase-v2 .is-active .vyr-image-motion-kenburns-out img{animation:vyr-img-kenburns-out var(--vyr-motion-duration,8s) ease-out both}
.vyr-showcase-v2 .is-active .vyr-image-motion-pan-left img{animation:vyr-img-pan-left var(--vyr-motion-duration,8s) ease-out both}
.vyr-showcase-v2 .is-active .vyr-image-motion-pan-right img{animation:vyr-img-pan-right var(--vyr-motion-duration,8s) ease-out both}
.vyr-showcase-v2 .is-active .vyr-image-motion-pan-up img{animation:vyr-img-pan-up var(--vyr-motion-duration,8s) ease-out both}
.vyr-showcase-v2 .is-active .vyr-image-motion-pan-down img{animation:vyr-img-pan-down var(--vyr-motion-duration,8s) ease-out both}
.vyr-showcase-v2 .is-active .vyr-image-motion-drift-left img{animation:vyr-img-drift-left var(--vyr-motion-duration,8s) ease-out both}
.vyr-showcase-v2 .is-active .vyr-image-motion-drift-right img{animation:vyr-img-drift-right var(--vyr-motion-duration,8s) ease-out both}
@keyframes vyr-img-kenburns-in{from{transform:scale(1)}to{transform:scale(1.065)}}
@keyframes vyr-img-kenburns-out{from{transform:scale(1.065)}to{transform:scale(1)}}
@keyframes vyr-img-pan-left{from{transform:scale(1.055) translateX(1.8%)}to{transform:scale(1.055) translateX(-1.8%)}}
@keyframes vyr-img-pan-right{from{transform:scale(1.055) translateX(-1.8%)}to{transform:scale(1.055) translateX(1.8%)}}
@keyframes vyr-img-pan-up{from{transform:scale(1.055) translateY(1.8%)}to{transform:scale(1.055) translateY(-1.8%)}}
@keyframes vyr-img-pan-down{from{transform:scale(1.055) translateY(-1.8%)}to{transform:scale(1.055) translateY(1.8%)}}
@keyframes vyr-img-drift-left{from{transform:scale(1.02) translateX(1%)}to{transform:scale(1.075) translateX(-1.5%)}}
@keyframes vyr-img-drift-right{from{transform:scale(1.02) translateX(-1%)}to{transform:scale(1.075) translateX(1.5%)}}

/* Nội dung chữ. */
.vyr-showcase-v2 .vyr-showcase-content{z-index:4;box-sizing:border-box;max-width:min(760px,78%);padding:clamp(18px,4vw,52px);display:flex;flex-direction:column;gap:0}
.vyr-showcase-v2 .vyr-content-align-left{text-align:left;align-items:flex-start;margin-right:auto}
.vyr-showcase-v2 .vyr-content-align-center{text-align:center;align-items:center;margin-inline:auto}
.vyr-showcase-v2 .vyr-content-align-right{text-align:right;align-items:flex-end;margin-left:auto}
.vyr-showcase-v2.vyr-showcase--cover .vyr-content-vertical-top{justify-content:flex-start!important}
.vyr-showcase-v2.vyr-showcase--cover .vyr-content-vertical-center{justify-content:center!important}
.vyr-showcase-v2.vyr-showcase--cover .vyr-content-vertical-bottom{justify-content:flex-end!important}
.vyr-showcase-v2 .vyr-showcase-content h2{display:inline-block;width:auto;max-width:100%;margin:0 0 12px;padding:var(--vyr-title-py,0) var(--vyr-title-px,0);font-size:var(--vyr-title-size,44px);line-height:1.18;color:var(--vyr-title-color,#fff);background:var(--vyr-title-bg,transparent);border-radius:6px}
.vyr-showcase-v2 .vyr-showcase-content p{display:inline-block;width:auto;max-width:100%;margin:0 0 20px;padding:var(--vyr-description-py,0) var(--vyr-description-px,0);font-size:var(--vyr-description-size,18px);line-height:1.55;color:var(--vyr-description-color,#fff);background:var(--vyr-description-bg,transparent);border-radius:6px}
.vyr-showcase-v2 .vyr-showcase-button{display:inline-flex;align-items:center;justify-content:center;width:auto;margin:0;padding:var(--vyr-button-py,10px) var(--vyr-button-px,20px);background:var(--vyr-button-bg,#2563eb);color:var(--vyr-button-color,#fff);border-radius:var(--vyr-button-radius,8px);text-decoration:none}
.vyr-showcase-v2 .vyr-showcase-button:hover{filter:brightness(.96)}

/* Chữ động - bộ nhỏ tuyển chọn, không cần Animate.css/GSAP. */
.vyr-showcase-v2 [class*="vyr-anim-"]{will-change:transform,opacity}
.vyr-showcase-v2 .is-active .vyr-anim-none{animation:none}
.vyr-showcase-v2 .is-active .vyr-anim-fade{animation:vyr-text-fade .58s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-fade-up{animation:vyr-text-fade-up .62s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-fade-down{animation:vyr-text-fade-down .62s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-fade-left{animation:vyr-text-fade-left .62s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-fade-right{animation:vyr-text-fade-right .62s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-zoom-in{animation:vyr-text-zoom-in .58s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-zoom-out{animation:vyr-text-zoom-out .58s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-blur-in{animation:vyr-text-blur-in .68s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-reveal-left{animation:vyr-text-reveal-left .7s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-reveal-right{animation:vyr-text-reveal-right .7s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-flip-up{animation:vyr-text-flip-up .65s ease both;animation-delay:var(--vyr-anim-delay,0ms)}
.vyr-showcase-v2 .is-active .vyr-anim-bounce-in{animation:vyr-text-bounce-in .72s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--vyr-anim-delay,0ms)}
@keyframes vyr-text-fade{from{opacity:0}to{opacity:1}}
@keyframes vyr-text-fade-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes vyr-text-fade-down{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:none}}
@keyframes vyr-text-fade-left{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
@keyframes vyr-text-fade-right{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
@keyframes vyr-text-zoom-in{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes vyr-text-zoom-out{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:none}}
@keyframes vyr-text-blur-in{from{opacity:0;filter:blur(9px);transform:translateY(8px)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes vyr-text-reveal-left{from{opacity:0;clip-path:inset(0 100% 0 0);transform:translateX(-10px)}to{opacity:1;clip-path:inset(0);transform:none}}
@keyframes vyr-text-reveal-right{from{opacity:0;clip-path:inset(0 0 0 100%);transform:translateX(10px)}to{opacity:1;clip-path:inset(0);transform:none}}
@keyframes vyr-text-flip-up{from{opacity:0;transform:perspective(500px) rotateX(26deg) translateY(12px)}to{opacity:1;transform:none}}
@keyframes vyr-text-bounce-in{0%{opacity:0;transform:scale(.92) translateY(12px)}65%{opacity:1;transform:scale(1.025) translateY(-2px)}100%{opacity:1;transform:none}}

/* Nút prev/next: SVG + flex để icon luôn chính giữa hình tròn. */
.vyr-showcase-v2 .vyr-showcase-nav{position:absolute;top:50%;z-index:10;display:flex;align-items:center;justify-content:center;width:var(--vyr-showcase-nav-size,42px);height:var(--vyr-showcase-nav-size,42px);padding:0;transform:translateY(-50%);border:0;border-radius:999px;background:var(--vyr-showcase-nav-bg,rgba(15,23,42,.65));color:var(--vyr-showcase-nav-icon,#fff);cursor:pointer}
.vyr-showcase-v2 .vyr-showcase-nav:hover{filter:brightness(1.12)}
.vyr-showcase-v2 .vyr-showcase-nav svg{display:block;width:48%;height:48%;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.vyr-showcase-v2 .vyr-showcase-prev{left:12px}.vyr-showcase-v2 .vyr-showcase-next{right:12px}

/* 5 kiểu chỉ báo dưới slide. */
.vyr-showcase-v2 .vyr-showcase-dots{position:absolute;z-index:11;left:50%;bottom:4px;display:flex;align-items:center;justify-content:center;gap:2px;max-width:calc(100% - 24px);transform:translateX(-50%)}
.vyr-showcase-v2 .vyr-showcase-dots button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;flex:0 0 32px;width:32px;height:32px;padding:0;border:0;border-radius:4px;background:transparent;cursor:pointer}
.vyr-showcase-v2 .vyr-showcase-dots button::before{content:"";box-sizing:border-box;display:block;width:9px;height:9px;border-radius:999px;background:rgba(255,255,255,.52);transition:background .22s ease,opacity .22s ease,transform .22s ease}
.vyr-showcase-v2 .vyr-showcase-dots button:focus-visible{outline:2px solid #fff;outline-offset:1px}
.vyr-showcase-v2.vyr-showcase--dots-dot .vyr-showcase-dots button.is-active::before{background:#fff;transform:scale(1.2)}
.vyr-showcase-v2.vyr-showcase--dots-ring .vyr-showcase-dots button::before{width:10px;height:10px;border:2px solid rgba(255,255,255,.9);background:transparent}
.vyr-showcase-v2.vyr-showcase--dots-ring .vyr-showcase-dots button.is-active::before{background:#fff}
.vyr-showcase-v2.vyr-showcase--dots-pill .vyr-showcase-dots button::before{width:26px;transform:scaleX(.3462);background:rgba(255,255,255,.55)}
.vyr-showcase-v2.vyr-showcase--dots-pill .vyr-showcase-dots button.is-active::before{transform:scaleX(1);background:#fff}
.vyr-showcase-v2.vyr-showcase--dots-line .vyr-showcase-dots button::before{width:24px;height:3px;border-radius:2px;background:rgba(255,255,255,.4)}
.vyr-showcase-v2.vyr-showcase--dots-line .vyr-showcase-dots button.is-active::before{background:#fff}
.vyr-showcase-v2.vyr-showcase--dots-progress .vyr-showcase-dots{gap:4px;width:min(260px,calc(100% - 24px))}
.vyr-showcase-v2.vyr-showcase--dots-progress .vyr-showcase-dots button{flex:1 1 32px;min-width:32px}
.vyr-showcase-v2.vyr-showcase--dots-progress .vyr-showcase-dots button::before{width:100%;height:3px;border-radius:2px;background:rgba(255,255,255,.32)}
.vyr-showcase-v2.vyr-showcase--dots-progress .vyr-showcase-dots button.is-active::before{background:#fff}

/* Khu Slideshow chính 1/2/3 cột. Chỉ khu này dùng align-start để menu phải/trái không ép méo tỷ lệ ảnh. */
.vyr-home-slideshow-zone{align-items:start}
.vyr-home-slideshow-zone .vyr-home-main-slideshow{min-width:0}
.vyr-home-slideshow-zone .vyr-home-hero-right{min-width:0}
.vyr-home-slideshow-zone.is-columns-1{grid-template-columns:minmax(0,1fr)}
.vyr-home-slideshow-zone.is-columns-2:has(>.vyr-hero-side-menu){grid-template-columns:minmax(220px,280px) minmax(0,1fr)}
.vyr-home-slideshow-zone.is-columns-2:not(:has(>.vyr-hero-side-menu)){grid-template-columns:minmax(0,1fr) minmax(240px,320px)}
.vyr-home-slideshow-zone.is-columns-3{grid-template-columns:minmax(220px,280px) minmax(0,1fr) minmax(240px,320px)}

/* Full trang: không ép bo góc; border tùy chọn vẫn chỉ hữu ích ở container. */
.vyr-home-slideshow-full .vyr-showcase-v2,.vyr-module-slideshow--full .vyr-showcase-v2{border-left:0;border-right:0;border-radius:0}

@media(max-width:980px){
  .vyr-home-slideshow-zone.is-columns-3{grid-template-columns:minmax(210px,250px) minmax(0,1fr)}
  .vyr-home-slideshow-zone.is-columns-3>.vyr-home-hero-right{grid-column:1/-1}
}
@media(max-width:760px){
  .vyr-home-slideshow-zone,.vyr-home-slideshow-zone.is-columns-1,.vyr-home-slideshow-zone.is-columns-2,.vyr-home-slideshow-zone.is-columns-3,.vyr-home-slideshow-zone.is-columns-2:has(>.vyr-hero-side-menu),.vyr-home-slideshow-zone.is-columns-2:not(:has(>.vyr-hero-side-menu)){grid-template-columns:1fr}
  .vyr-home-slideshow-zone.is-columns-3>.vyr-home-hero-right{grid-column:auto}
  .vyr-showcase-v2 .vyr-showcase-content{max-width:86%;padding:20px}
  .vyr-showcase-v2 .vyr-showcase-content h2{font-size:var(--vyr-title-size-mobile,28px)}
  .vyr-showcase-v2 .vyr-showcase-content p{font-size:var(--vyr-description-size-mobile,16px)}
  .vyr-showcase-v2 .vyr-showcase-nav{--vyr-showcase-nav-size:36px}
}
@media(max-width:520px){
  .vyr-showcase-v2 .vyr-showcase-content{max-width:90%;padding:16px}
  .vyr-showcase-v2 .vyr-showcase-content p{display:none}
  .vyr-showcase-v2 .vyr-showcase-prev{left:8px}.vyr-showcase-v2 .vyr-showcase-next{right:8px}
  .vyr-showcase-v2 .vyr-showcase-dots{bottom:0}
}
@media(prefers-reduced-motion:reduce){
  .vyr-showcase-v2 .vyr-showcase-slide,.vyr-showcase-v2 .vyr-showcase-media img,.vyr-showcase-v2 [class*="vyr-anim-"]{transition:none!important;animation:none!important;filter:none!important}
}

/* Chế độ Nguyên ảnh ưu tiên không cắt mép: motion dùng scale <= 1 và dịch chuyển rất nhẹ. */
.vyr-showcase-v2 .is-active .vyr-image-fit-contain.vyr-image-motion-kenburns-in img{animation-name:var(--vyr-showcase-contain-in,vyr-img-contain-in)}
.vyr-showcase-v2 .is-active .vyr-image-fit-contain.vyr-image-motion-kenburns-out img{animation-name:var(--vyr-showcase-contain-out,vyr-img-contain-out)}
.vyr-showcase-v2 .is-active .vyr-image-fit-contain.vyr-image-motion-pan-left img{animation-name:var(--vyr-showcase-contain-pan-left,vyr-img-contain-pan-left)}
.vyr-showcase-v2 .is-active .vyr-image-fit-contain.vyr-image-motion-pan-right img{animation-name:var(--vyr-showcase-contain-pan-right,vyr-img-contain-pan-right)}
.vyr-showcase-v2 .is-active .vyr-image-fit-contain.vyr-image-motion-pan-up img{animation-name:var(--vyr-showcase-contain-pan-up,vyr-img-contain-pan-up)}
.vyr-showcase-v2 .is-active .vyr-image-fit-contain.vyr-image-motion-pan-down img{animation-name:var(--vyr-showcase-contain-pan-down,vyr-img-contain-pan-down)}
.vyr-showcase-v2 .is-active .vyr-image-fit-contain.vyr-image-motion-drift-left img{animation-name:var(--vyr-showcase-contain-drift-left,vyr-img-contain-drift-left)}
.vyr-showcase-v2 .is-active .vyr-image-fit-contain.vyr-image-motion-drift-right img{animation-name:var(--vyr-showcase-contain-drift-right,vyr-img-contain-drift-right)}
@keyframes vyr-img-contain-in{from{transform:scale(.965)}to{transform:scale(1)}}
@keyframes vyr-img-contain-out{from{transform:scale(1)}to{transform:scale(.965)}}
@keyframes vyr-img-contain-pan-left{from{transform:scale(.98) translateX(1%)}to{transform:scale(.98) translateX(-1%)}}
@keyframes vyr-img-contain-pan-right{from{transform:scale(.98) translateX(-1%)}to{transform:scale(.98) translateX(1%)}}
@keyframes vyr-img-contain-pan-up{from{transform:scale(.98) translateY(1%)}to{transform:scale(.98) translateY(-1%)}}
@keyframes vyr-img-contain-pan-down{from{transform:scale(.98) translateY(-1%)}to{transform:scale(.98) translateY(1%)}}
@keyframes vyr-img-contain-drift-left{from{transform:scale(.965) translateX(.6%)}to{transform:scale(1) translateX(-.6%)}}
@keyframes vyr-img-contain-drift-right{from{transform:scale(.965) translateX(-.6%)}to{transform:scale(1) translateX(.6%)}}

/* Split/Minimal dùng nền tối mặc định để màu chữ trắng mặc định luôn đọc được. */
.vyr-showcase-v2.vyr-showcase--split .vyr-showcase-content{background:#0f172a}
.vyr-showcase-v2.vyr-showcase--split .vyr-content-vertical-top{justify-content:flex-start}
.vyr-showcase-v2.vyr-showcase--split .vyr-content-vertical-center{justify-content:center}
.vyr-showcase-v2.vyr-showcase--split .vyr-content-vertical-bottom{justify-content:flex-end}
.vyr-showcase-v2.vyr-showcase--minimal .vyr-showcase-content{background:rgba(15,23,42,.72);color:#fff}

/* <picture> responsive phải chiếm trọn khung Slideshow để object-fit/animation của img giữ nguyên. */
.vyr-showcase-v2 .vyr-showcase-picture{display:block;width:100%;height:100%;max-width:none}
.vyr-showcase-v2 .vyr-showcase-picture>img{width:100%;height:100%}

/* VYR: full-width slideshow has square corners on all screen sizes. */
.vyr-home-slideshow-full .vyr-showcase-v2,
.vyr-home-slideshow-full .vyr-showcase,
.vyr-module-slideshow--full .vyr-showcase-v2,
.vyr-module-slideshow--full .vyr-showcase {
  border-radius:0!important;
}

/* Banner Mobile: tỉ lệ do quản trị chọn; ảnh desktop là fallback. */
@media(max-width:760px){.vyr-showcase-v2{aspect-ratio:var(--vyr-showcase-mobile-ratio,1.777778)}.vyr-showcase-v2 .vyr-mobile-picture{display:block;width:100%;height:100%}.vyr-showcase-v2 .vyr-mobile-picture>picture{display:block;width:100%;height:100%}}

/* Fullwidth: xóa bo góc ở tất cả lớp bao của slideshow. */
.vyr-home-slideshow-full .vyr-showcase-v2,.vyr-home-slideshow-full .vyr-showcase-track,.vyr-home-slideshow-full .vyr-showcase-slide,.vyr-home-slideshow-full .vyr-showcase-media,.vyr-module-slideshow--full .vyr-showcase-v2,.vyr-module-slideshow--full .vyr-showcase-track,.vyr-module-slideshow--full .vyr-showcase-slide,.vyr-module-slideshow--full .vyr-showcase-media{border-radius:0!important}

/* Banner danh mục dùng cách lấp đầy khung như Hero trang chủ. */
.vyr-category-banner-showcase{border-radius:0;--vyr-showcase-contain-fit:cover;--vyr-showcase-contain-in:vyr-img-kenburns-in;--vyr-showcase-contain-out:vyr-img-kenburns-out;--vyr-showcase-contain-pan-left:vyr-img-pan-left;--vyr-showcase-contain-pan-right:vyr-img-pan-right;--vyr-showcase-contain-pan-up:vyr-img-pan-up;--vyr-showcase-contain-pan-down:vyr-img-pan-down;--vyr-showcase-contain-drift-left:vyr-img-drift-left;--vyr-showcase-contain-drift-right:vyr-img-drift-right}
