/* ==========================================================
   TrustWeb Gallery Pro — style.css v3.1.3
   ========================================================== */

/* ── WRAPPER ── */
.gp-gallery-wrapper {
    position: relative;
    width: 100%;
    --gp-eco-primary: var(--tw-eco-color-primary, var(--tw-color-primary, #2563EB));
    --gp-eco-radius: var(--tw-eco-radius-card, var(--gp-radius, 16px));
    --gp-eco-shadow: var(--tw-eco-shadow-soft, 0 10px 40px rgba(15,23,42,.10));
    --gp-eco-z-slider: var(--tw-eco-z-slider, 100020);
    --gp-gap-current: var(--gp-gap-d, 20px);
    --gp-h-current: var(--gp-h-d);
}
@media (max-width: 1024px) { .gp-gallery-wrapper { --gp-h-current: var(--gp-h-t); --gp-gap-current: var(--gp-gap-t, 15px); } }
@media (max-width: 767px)  { .gp-gallery-wrapper { --gp-h-current: var(--gp-h-m); --gp-gap-current: var(--gp-gap-m, 10px); } }
.gp-gallery-wrapper.gp-ecosystem-paused { pointer-events: auto; }

/* ── ITEM ── */
.gp-gallery-item {
    position: relative;
    box-sizing: border-box;
    transform: translate3d(0,0,0);
}

/* ── MEDIA ── */
.gp-media {
    width: 100%;
    display: block;
    height: var(--gp-h-current) !important;
    transition: transform 0.3s ease;
}
.gp-video-wrap { width: 100%; height: var(--gp-h-current) !important; }
.gp-video-wrap iframe { width: 100%; height: 100%; border: none; }
.gp-fit-cover   .gp-media { object-fit: cover; }
.gp-fit-contain .gp-media { object-fit: contain; }
.gp-media-video { object-fit: cover; background: #111; }

/* ── GRID ── */
.gp-layout-grid .gp-inner {
    display: grid;
    gap: var(--gp-gap-current);
    grid-template-columns: repeat(var(--gp-col-d), 1fr);
}
@media (max-width: 1024px) { .gp-layout-grid .gp-inner { grid-template-columns: repeat(var(--gp-col-t), 1fr); } }
@media (max-width: 767px)  { .gp-layout-grid .gp-inner { grid-template-columns: repeat(var(--gp-col-m), 1fr); } }

/* ── CAROUSEL NAVIGATION ── */
.gp-swiper { position: relative; }
.gp-swiper .swiper-wrapper { z-index: 1; }
.gp-swiper-button-next,
.gp-swiper-button-prev {
    background-image: none !important;
    margin-top: 0 !important;
    width: 45px !important; height: 45px !important;
    background-color: #fff !important;
    border: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    color: #333 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.15) !important;
    position: absolute !important;
    top: 50% !important;
    z-index: var(--gp-eco-z-slider, 100020) !important;
    display: flex !important;
    align-items: center; justify-content: center;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    opacity: 0; visibility: hidden;
}
.gp-swiper-button-next svg, .gp-swiper-button-prev svg { width: 22px; height: 22px; display: block; }
.gp-swiper-button-next { right: 15px !important; transform: translateX(20px) translateY(-50%) !important; }
.gp-swiper-button-prev { left: 15px !important;  transform: translateX(-20px) translateY(-50%) !important; }
.gp-gallery-wrapper:hover .gp-swiper-button-next { opacity: 1; visibility: visible; transform: translateX(0) translateY(-50%) !important; }
.gp-gallery-wrapper:hover .gp-swiper-button-prev { opacity: 1; visibility: visible; transform: translateX(0) translateY(-50%) !important; }
.gp-swiper-button-disabled,
.gp-swiper-button-next.swiper-button-lock,
.gp-swiper-button-prev.swiper-button-lock { display: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
.gp-swiper .gp-carousel__dots {
    position: absolute !important;
    z-index: var(--gp-eco-z-slider, 100020);
    bottom: 14px !important;
    display: flex;
    align-items: center;
    gap: 8px;
    width: auto !important;
    pointer-events: auto;
}
.gp-swiper .gp-carousel__dots[hidden],
.gp-swiper .gp-carousel__dots.swiper-pagination-lock { display: none !important; }
.gp-carousel__dot {
    appearance: none;
    width: 8px;
    height: 8px;
    min-width: 8px;
    border: 0;
    border-radius: 999px;
    padding: 0;
    margin: 0 !important;
    background: rgba(255,255,255,.55);
    box-shadow: 0 1px 4px rgba(0,0,0,.18);
    cursor: pointer;
    opacity: 1 !important;
    transition: width .25s ease, background .25s ease, transform .25s ease;
}
.gp-carousel__dot.active {
    width: 24px;
    background: var(--gp-carousel-dot-active, #fff);
}
@media (min-width: 768px) {
    .twfs-nav-right .twfs-section .gp-swiper-button-next { right: 44px !important; }
    .twfs-nav-left .twfs-section .gp-swiper-button-prev { left: 44px !important; }
}
.gp-carousel-fallback .swiper { overflow: hidden; }
.gp-carousel-fallback .swiper-wrapper { display: flex; will-change: transform; }
.gp-carousel-fallback .swiper-slide { height: auto; }
.gp-carousel-fallback-fade .swiper-wrapper { display: block; position: relative; min-height: var(--gp-h-current); }
.gp-carousel-fallback-fade .swiper-slide { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity .55s ease; }
.gp-carousel-fallback-fade .swiper-slide.active { opacity: 1; pointer-events: auto; }

/* ── LINK WRAP ── */
.gp-link-wrap { display: block; width: 100%; height: 100%; text-decoration: none; }
.gp-link-wrap:hover { opacity: 0.9; }

/* ── PLAY ICON ── */
.gp-play-icon {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 60px; height: 60px;
    background: rgba(0,0,0,0.6);
    border-radius: 50%; pointer-events: none;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.3s ease;
    border: 2px solid #fff;
}
.gp-play-icon::before {
    content: ''; display: block;
    width: 0; height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 16px solid #fff;
    margin-left: 4px;
}
.gp-gallery-item:hover .gp-play-icon { background: rgba(255,0,0,0.8); transform: translate(-50%,-50%) scale(1.1); }

/* ── TITLE ── */
.gp-item-title {
    margin: 12px 0 0;
    color: var(--gp-t-color, #333);
    text-align: center;
    font-size: var(--gp-t-fs-d, 16px);
    font-weight: var(--gp-t-fw, 600);
    line-height: var(--gp-t-lh, 1.5);
    text-transform: var(--gp-t-tt, none);
    transition: all 0.3s ease;
}
.gp-item-title[data-pos="overlay"] {
    position: absolute; bottom: 0; left: 0;
    width: 100%; margin: 0; padding: 15px;
    background: var(--gp-t-bg, rgba(0,0,0,0.7));
    box-sizing: border-box; z-index: 10;
}
@media (max-width: 1024px) { .gp-item-title { font-size: var(--gp-t-fs-t, 15px); } }
@media (max-width: 767px)  { .gp-item-title { font-size: var(--gp-t-fs-m, 14px); } }


/* ==========================================================
   SLIDESHOW CAO CẤP
   ========================================================== */
.gp-layout-slideshow,
.gp-layout-slideshow .gp-slideshow,
.gp-layout-slideshow .gp-slideshow__track {
    margin: 0;
    padding: 0;
    border: 0 !important;
    box-shadow: none !important;
}
.gp-layout-slideshow .gp-slideshow {
    position: relative;
    display: block;
    width: 100%;
    height: var(--gp-slide-h-d, 560px);
    overflow: hidden;
    border-radius: var(--gp-radius, 0px);
    background: #111;
    isolation: isolate;
    outline: none;
    touch-action: pan-y;
    contain: layout paint;
}
.gp-layout-slideshow .gp-slideshow:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--gp-eco-primary) 55%, transparent) !important;
}
@media (max-width: 1024px) { .gp-layout-slideshow .gp-slideshow { height: var(--gp-slide-h-t, 460px); } }
@media (max-width: 767px)  { .gp-layout-slideshow .gp-slideshow { height: var(--gp-slide-h-m, 360px); min-height: 300px; } }

.gp-slideshow__track,
.gp-slideshow__slide,
.gp-slideshow__media-link {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}
.gp-slideshow__track { overflow: hidden; }
.gp-slideshow__slide {
    opacity: 0;
    pointer-events: none;
    z-index: 1;
    overflow: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    transition:
        opacity var(--gp-slide-speed, 850ms) cubic-bezier(.25,.8,.25,1),
        transform var(--gp-slide-speed, 850ms) cubic-bezier(.16,1,.3,1),
        clip-path var(--gp-slide-speed, 850ms) cubic-bezier(.22,1,.36,1);
}
.gp-slideshow__slide.active { opacity: 1; pointer-events: auto; z-index: 3; }
.gp-slideshow__slide.active,
.gp-slideshow__slide.is-leaving,
.gp-slideshow__slide.is-entering-next,
.gp-slideshow__slide.is-entering-prev { will-change: opacity, transform, clip-path; }
.gp-slideshow__slide.is-leaving { opacity: 1; pointer-events: none; z-index: 2; }
.gp-slideshow__slide.is-entering-next,
.gp-slideshow__slide.is-entering-prev { opacity: 0; }
/* Đặt slide mới về vị trí đầu mà không chạy transition ẩn; ngăn prev/next lệch hướng sau khi wrap. */
.gp-slideshow__slide.is-preparing,
.gp-slideshow__slide.is-preparing .gp-slideshow__img,
.gp-slideshow__slide.is-preparing .gp-slideshow__video,
.gp-slideshow__slide.is-preparing .gp-slideshow__backdrop,
.gp-slideshow__slide.is-preparing .gp-slideshow__wave { transition: none !important; animation: none !important; }

/* Fade: crossfade thật, hai chiều dùng cùng một logic. */
.gp-slideshow--fade .gp-slideshow__slide.is-leaving { opacity: 0; }

/* Trượt ngang: prev/next đối xứng tuyệt đối. */
.gp-slideshow--slide .gp-slideshow__slide { transform: translate3d(100%,0,0); }
.gp-slideshow--slide[data-gp-direction="prev"] .gp-slideshow__slide { transform: translate3d(-100%,0,0); }
.gp-slideshow--slide .gp-slideshow__slide.active { transform: translate3d(0,0,0); }
.gp-slideshow--slide .gp-slideshow__slide.is-entering-next { transform: translate3d(100%,0,0); }
.gp-slideshow--slide .gp-slideshow__slide.is-entering-prev { transform: translate3d(-100%,0,0); }
.gp-slideshow--slide.is-transitioning .gp-slideshow__slide.is-leaving-next { transform: translate3d(-100%,0,0); }
.gp-slideshow--slide.is-transitioning .gp-slideshow__slide.is-leaving-prev { transform: translate3d(100%,0,0); }

/* Zoom nhẹ: không đổi hướng nên prev/next luôn đồng nhất. */
.gp-slideshow--zoom .gp-slideshow__slide { transform: scale(1.065); }
.gp-slideshow--zoom .gp-slideshow__slide.active { transform: scale(1); }
.gp-slideshow--zoom .gp-slideshow__slide.is-leaving { opacity: 0; transform: scale(1.025); }

/* Mở màn mềm: chỉ lớp mới mở từ đúng hướng; lớp cũ ở dưới, không tạo khoảng hở/giật. */
.gp-slideshow--reveal .gp-slideshow__slide.active,
.gp-slideshow--reveal .gp-slideshow__slide.is-leaving { opacity: 1; }
.gp-slideshow--reveal .gp-slideshow__slide.active { clip-path: inset(0 0 0 0); }
.gp-slideshow--reveal .gp-slideshow__slide.active.is-entering-next { clip-path: inset(0 0 0 100%); }
.gp-slideshow--reveal .gp-slideshow__slide.active.is-entering-prev { clip-path: inset(0 100% 0 0); }
.gp-slideshow--reveal .gp-slideshow__slide.is-leaving { transform: scale(1.015); opacity: .86; }

/* Làn sóng điện ảnh: crossfade + parallax nhẹ + dải sáng mềm, không dùng canvas/thư viện nặng. */
.gp-slideshow--cinematic .gp-slideshow__slide.is-leaving { opacity: .24; }
.gp-slideshow--cinematic .gp-slideshow__img,
.gp-slideshow--cinematic .gp-slideshow__video,
.gp-slideshow--cinematic .gp-slideshow__backdrop {
    transition: transform calc(var(--gp-slide-speed, 850ms) + 280ms) cubic-bezier(.16,1,.3,1), opacity var(--gp-slide-speed, 850ms) ease;
}
.gp-slideshow--cinematic .gp-slideshow__slide.active .gp-slideshow__img,
.gp-slideshow--cinematic .gp-slideshow__slide.active .gp-slideshow__video,
.gp-slideshow--cinematic .gp-slideshow__slide.active .gp-slideshow__backdrop { transform: scale(1.018) translate3d(0,0,0); }
.gp-slideshow--cinematic .gp-slideshow__slide.is-entering-next .gp-slideshow__img,
.gp-slideshow--cinematic .gp-slideshow__slide.is-entering-next .gp-slideshow__video,
.gp-slideshow--cinematic .gp-slideshow__slide.is-entering-next .gp-slideshow__backdrop { transform: scale(1.075) translate3d(1.25%,0,0); }
.gp-slideshow--cinematic .gp-slideshow__slide.is-entering-prev .gp-slideshow__img,
.gp-slideshow--cinematic .gp-slideshow__slide.is-entering-prev .gp-slideshow__video,
.gp-slideshow--cinematic .gp-slideshow__slide.is-entering-prev .gp-slideshow__backdrop { transform: scale(1.075) translate3d(-1.25%,0,0); }
.gp-slideshow--cinematic .gp-slideshow__slide.is-leaving-next .gp-slideshow__img,
.gp-slideshow--cinematic .gp-slideshow__slide.is-leaving-next .gp-slideshow__video,
.gp-slideshow--cinematic .gp-slideshow__slide.is-leaving-next .gp-slideshow__backdrop { transform: scale(1.03) translate3d(-.7%,0,0); }
.gp-slideshow--cinematic .gp-slideshow__slide.is-leaving-prev .gp-slideshow__img,
.gp-slideshow--cinematic .gp-slideshow__slide.is-leaving-prev .gp-slideshow__video,
.gp-slideshow--cinematic .gp-slideshow__slide.is-leaving-prev .gp-slideshow__backdrop { transform: scale(1.03) translate3d(.7%,0,0); }
.gp-slideshow__wave {
    position: absolute;
    top: -28%;
    bottom: -28%;
    left: -48%;
    z-index: 3;
    display: block;
    width: 42%;
    border-radius: 48% 52% 44% 56% / 58% 43% 57% 42%;
    background:
        radial-gradient(ellipse at 55% 50%, rgba(255,255,255,.42) 0%, rgba(255,255,255,.18) 34%, rgba(255,255,255,0) 72%),
        linear-gradient(105deg, rgba(255,255,255,0), rgba(255,255,255,.20), rgba(255,255,255,0));
    filter: blur(10px);
    mix-blend-mode: soft-light;
    opacity: 0;
    pointer-events: none;
    transform: translate3d(-15%,0,0) rotate(7deg) scaleX(.72);
    will-change: transform, opacity;
}
.gp-slideshow--cinematic.is-transitioning[data-gp-direction="next"] .gp-slideshow__slide.active .gp-slideshow__wave {
    animation: gp-wave-next calc(var(--gp-slide-speed, 850ms) + 220ms) cubic-bezier(.16,1,.3,1) both;
}
.gp-slideshow--cinematic.is-transitioning[data-gp-direction="prev"] .gp-slideshow__slide.active .gp-slideshow__wave {
    animation: gp-wave-prev calc(var(--gp-slide-speed, 850ms) + 220ms) cubic-bezier(.16,1,.3,1) both;
}
@keyframes gp-wave-next {
    0%   { opacity: 0; transform: translate3d(-20%,0,0) rotate(7deg) scaleX(.70); }
    24%  { opacity: .78; }
    100% { opacity: 0; transform: translate3d(380%,0,0) rotate(7deg) scaleX(1.08); }
}
@keyframes gp-wave-prev {
    0%   { opacity: 0; transform: translate3d(380%,0,0) rotate(-7deg) scaleX(.70); }
    24%  { opacity: .78; }
    100% { opacity: 0; transform: translate3d(-20%,0,0) rotate(-7deg) scaleX(1.08); }
}

/* Media và chế độ giữ trọn ảnh. */
.gp-slideshow__backdrop {
    position: absolute;
    inset: -28px;
    z-index: 0;
    display: block;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: blur(22px) saturate(.92);
    opacity: 0;
    transform: scale(1.08);
    pointer-events: none;
}
.gp-slideshow__img,
.gp-slideshow__video {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100% !important;
    object-fit: var(--gp-object-fit, cover);
    object-position: center;
    box-sizing: border-box;
    background: transparent;
    backface-visibility: hidden;
}
.gp-fit-cover .gp-slideshow { background: transparent; }
.gp-fit-cover .gp-slideshow__backdrop { opacity: 0; }
.gp-fit-cover .gp-slideshow__img,
.gp-fit-cover .gp-slideshow__video {
    width: calc(100% + 2px);
    height: calc(100% + 2px) !important;
    margin: -1px;
    padding: 0;
    object-fit: cover;
}
.gp-fit-contain .gp-slideshow { background: #111; }
.gp-fit-contain .gp-slideshow__slide.active .gp-slideshow__backdrop,
.gp-fit-contain .gp-slideshow__slide.is-leaving .gp-slideshow__backdrop { opacity: .52; }
.gp-fit-contain .gp-slideshow__img,
.gp-fit-contain .gp-slideshow__video {
    width: 100%;
    height: 100% !important;
    margin: 0;
    object-fit: contain;
    padding: clamp(8px, 1.2vw, 18px);
}
.gp-slideshow__media-link { overflow: hidden; z-index: 1; }
.gp-slideshow__video-play {
    position: absolute;
    left: 50%; top: 50%;
    z-index: 5;
    width: 58px; height: 58px;
    border: 1px solid rgba(255,255,255,.72);
    border-radius: 50%;
    background: rgba(8,12,20,.45);
    transform: translate(-50%,-50%);
    backdrop-filter: blur(8px);
    pointer-events: none;
    transition: transform .25s ease, background .25s ease;
}
.gp-slideshow__video-play::after {
    content: '';
    position: absolute;
    left: 52%; top: 50%;
    transform: translate(-50%,-50%);
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 13px solid #fff;
}
.gp-slideshow__media-link:hover .gp-slideshow__video-play { transform: translate(-50%,-50%) scale(1.07); background: rgba(8,12,20,.62); }
.gp-slideshow__shade {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: var(--gp-slide-overlay, linear-gradient(90deg, rgba(0,0,0,.58) 0%, rgba(0,0,0,.22) 48%, rgba(0,0,0,.08) 100%));
    pointer-events: none;
}

/* Vị trí chữ ở lớp ngoài; từng hiệu ứng chỉ chạy trên title/desc/button. */
.gp-slideshow__content {
    position: absolute;
    z-index: 4;
    max-width: min(680px, 90%);
    color: #fff;
    padding: clamp(20px, 4vw, 54px);
    box-sizing: border-box;
    pointer-events: none;
}
.gp-slideshow__content-inner {
    opacity: 1;
    transform: none;
    filter: none;
    transition: opacity .18s ease;
}
.gp-slideshow__slide.is-leaving .gp-slideshow__content-inner { opacity: 0; }
.gp-slideshow__content--center-left { left: 5%; top: 50%; transform: translateY(-50%); }
.gp-slideshow__content--center { left: 50%; top: 50%; transform: translate(-50%,-50%); width: min(800px, 92%); max-width: min(800px, 92%); }
.gp-slideshow__content--center-right { right: 0; top: 50%; transform: translateY(-50%); }
.gp-slideshow__content--bottom-left { left: 0; bottom: 0; }
.gp-slideshow__content--bottom-center { left: 50%; bottom: 0; transform: translateX(-50%); width: min(800px, 92%); max-width: min(800px, 92%); }
.gp-slideshow__align--left { text-align: left; }
.gp-slideshow__align--center { text-align: center; }
.gp-slideshow__align--right { text-align: right; }
.gp-slideshow__title,
.gp-slideshow__desc,
.gp-slideshow__button {
    opacity: 0;
    transition: opacity .58s ease, transform .72s cubic-bezier(.16,1,.3,1), filter .72s cubic-bezier(.16,1,.3,1);
}
.gp-slideshow__slide.active .gp-slideshow__title,
.gp-slideshow__slide.active .gp-slideshow__desc,
.gp-slideshow__slide.active .gp-slideshow__button,
.gp-slideshow__slide.is-leaving .gp-slideshow__title,
.gp-slideshow__slide.is-leaving .gp-slideshow__desc,
.gp-slideshow__slide.is-leaving .gp-slideshow__button { will-change: opacity, transform, filter; }
.gp-slideshow__anim--rise .gp-slideshow__title,
.gp-slideshow__anim--rise .gp-slideshow__desc,
.gp-slideshow__anim--rise .gp-slideshow__button { transform: translate3d(0,34px,0); }
.gp-slideshow__anim--fade .gp-slideshow__title,
.gp-slideshow__anim--fade .gp-slideshow__desc,
.gp-slideshow__anim--fade .gp-slideshow__button { transform: none; }
.gp-slideshow__anim--left .gp-slideshow__title,
.gp-slideshow__anim--left .gp-slideshow__desc,
.gp-slideshow__anim--left .gp-slideshow__button { transform: translate3d(-44px,0,0); }
.gp-slideshow__anim--right .gp-slideshow__title,
.gp-slideshow__anim--right .gp-slideshow__desc,
.gp-slideshow__anim--right .gp-slideshow__button { transform: translate3d(44px,0,0); }
.gp-slideshow__anim--scale .gp-slideshow__title,
.gp-slideshow__anim--scale .gp-slideshow__desc,
.gp-slideshow__anim--scale .gp-slideshow__button { transform: scale(.88); }
.gp-slideshow__anim--blur .gp-slideshow__title,
.gp-slideshow__anim--blur .gp-slideshow__desc,
.gp-slideshow__anim--blur .gp-slideshow__button { transform: translate3d(0,10px,0); filter: blur(12px); }
.gp-slideshow__slide.is-content-ready .gp-slideshow__title,
.gp-slideshow__slide.is-content-ready .gp-slideshow__desc,
.gp-slideshow__slide.is-content-ready .gp-slideshow__button { opacity: 1; transform: none; filter: none; }
.gp-slideshow__slide.is-content-ready .gp-slideshow__title { transition-delay: .10s; }
.gp-slideshow__slide.is-content-ready .gp-slideshow__desc { opacity: .94; transition-delay: .20s; }
.gp-slideshow__slide.is-content-ready .gp-slideshow__button { transition-delay: .30s; pointer-events: auto; }
.gp-slideshow__title { margin: 0 0 14px; color: var(--gp-slide-title-color, inherit); font-family: var(--gp-slide-title-font, inherit); font-size: clamp(28px, 4.15vw, 64px); line-height: 1.04; font-weight: 750; letter-spacing: -.035em; text-wrap: balance; text-shadow: 0 8px 30px rgba(0,0,0,.28); }
.gp-slideshow__desc { color: var(--gp-slide-desc-color, rgba(255,255,255,.94)); font-family: var(--gp-slide-desc-font, inherit); font-size: clamp(15px, 1.22vw, 19px); line-height: 1.62; max-width: 620px; text-wrap: pretty; }
.gp-slideshow__align--center .gp-slideshow__desc { margin-inline: auto; }
.gp-slideshow__align--right .gp-slideshow__desc { margin-left: auto; }
.gp-slideshow__desc p { margin: 0 0 10px; color: inherit; }
.gp-slideshow__button { display: inline-flex; align-items: center; justify-content: center; margin-top: 16px; min-height: 44px; padding: 10px 23px; border-radius: 999px; background: #fff; color: #111; text-decoration: none; font-weight: 700; font-size: 14px; box-shadow: 0 10px 28px rgba(0,0,0,.18); }
.gp-slideshow__slide.is-content-ready .gp-slideshow__button:hover { transform: translate3d(0,-2px,0); box-shadow: 0 14px 34px rgba(0,0,0,.25); color: #111; }

.gp-slideshow__arrow {
    position: absolute;
    top: 50%;
    z-index: var(--gp-eco-z-slider, 100020);
    transform: translateY(-50%);
    width: 46px; height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.46);
    background: rgba(255,255,255,.84);
    color: #111;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 8px 26px rgba(0,0,0,.18);
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    backdrop-filter: blur(8px);
    transition: opacity .25s ease, transform .25s ease, background .25s ease;
}
.gp-slideshow:hover .gp-slideshow__arrow,
.gp-slideshow:focus-within .gp-slideshow__arrow { opacity: 1; }
.gp-slideshow__arrow:hover { transform: translateY(-50%) scale(1.07); background: #fff; }
.gp-slideshow__arrow:focus-visible,
.gp-slideshow__dot:focus-visible,
.gp-carousel__dot:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.gp-slideshow__arrow--prev { left: 16px; }
.gp-slideshow__arrow--next { right: 16px; }
@media (min-width: 768px) {
    .twfs-nav-right .twfs-section .gp-slideshow__arrow--next { right: 84px; }
    .twfs-nav-left .twfs-section .gp-slideshow__arrow--prev { left: 84px; }
}
.gp-arrow-svg { width: 22px; height: 22px; display: block; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.gp-slideshow__dots { position: absolute; z-index: 6; bottom: 20px; display: flex; align-items: center; gap: 8px; }
.gp-slideshow--has-progress .gp-slideshow__dots { bottom: 22px; }
.gp-slideshow__dot { width: 8px; height: 8px; min-width: 8px; border: 0; border-radius: 999px; background: rgba(255,255,255,.55); box-shadow: 0 1px 4px rgba(0,0,0,.18); padding: 0; cursor: pointer; transition: width .28s ease, background .28s ease, transform .28s ease; }
.gp-slideshow__dot.active { width: 26px; background: var(--gp-slide-dot-active, #fff); }
/* Progress được thu gọn, không còn phủ full-width tại mép dưới gây đường kẻ đen. */
.gp-slideshow__progress {
    position: absolute;
    left: 50%;
    bottom: 10px;
    z-index: 7;
    width: min(112px, 24vw);
    height: 2px;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.22);
    box-shadow: none;
    overflow: hidden;
    transform: translateX(-50%);
    pointer-events: none;
}
.gp-slideshow__progress-bar { display: block; width: 100%; height: 100%; border-radius: inherit; background: var(--gp-slide-dot-active, #fff); transform: scaleX(0); transform-origin: left center; will-change: transform; }
.gp-slideshow.is-progress-running .gp-slideshow__progress-bar { animation: gp-slideshow-progress var(--gp-slide-delay, 4500ms) linear forwards; }
@keyframes gp-slideshow-progress { to { transform: scaleX(1); } }
.gp-swiper .gp-carousel__dots.gp-dots--left,
.gp-slideshow__dots.gp-dots--left { left: 16px !important; right: auto !important; transform: none !important; }
.gp-swiper .gp-carousel__dots.gp-dots--center,
.gp-slideshow__dots.gp-dots--center { left: 50% !important; right: auto !important; transform: translateX(-50%) !important; }
.gp-swiper .gp-carousel__dots.gp-dots--right,
.gp-slideshow__dots.gp-dots--right { left: auto !important; right: 16px !important; transform: none !important; }

@media (max-width: 767px) {
    .gp-slideshow__shade { background: var(--gp-slide-overlay-mobile, var(--gp-slide-overlay, linear-gradient(0deg, rgba(0,0,0,.68) 0%, rgba(0,0,0,.08) 100%))); }
    .gp-slideshow__content { max-width: 100%; padding: 24px 22px 50px; }
    .gp-slideshow--has-dots .gp-slideshow__content--bottom-left,
    .gp-slideshow--has-dots .gp-slideshow__content--bottom-center { bottom: 28px; }
    .gp-slideshow__content--center-left { left: 0; }
    .gp-slideshow__content--center-right { right: 0; }
    .gp-slideshow__title { font-size: clamp(25px, 9vw, 42px); margin-bottom: 10px; }
    .gp-slideshow__desc { font-size: 14px; line-height: 1.55; }
    .gp-slideshow__button { min-height: 44px; margin-top: 12px; padding: 9px 19px; }
    .gp-slideshow__arrow { opacity: 1; width: 44px; height: 44px; background: rgba(0,0,0,.38); color: #fff; border-color: rgba(255,255,255,.35); }
    .gp-slideshow__arrow--prev { left: 10px; }
    .gp-slideshow__arrow--next { right: 10px; }
    .gp-slideshow__video-play { width: 50px; height: 50px; }
    .gp-fit-contain .gp-slideshow__img,
    .gp-fit-contain .gp-slideshow__video { padding: 8px; }
    .gp-slideshow__wave { filter: blur(8px); width: 50%; }
}

@media (prefers-reduced-motion: reduce) {
    .gp-slideshow__slide,
    .gp-slideshow__img,
    .gp-slideshow__video,
    .gp-slideshow__backdrop,
    .gp-slideshow__content-inner,
    .gp-slideshow__title,
    .gp-slideshow__desc,
    .gp-slideshow__button,
    .gp-slideshow__arrow,
    .gp-slideshow__dot { transition-duration: .01ms !important; animation-duration: .01ms !important; }
    .gp-slideshow__wave { display: none !important; }
    .gp-slideshow__progress-bar { animation: none !important; transform: scaleX(1); }
}

/* ==========================================================
   SWIPER GALLERY (twtb-gal) — Ảnh lớn + Thumbnail
   ========================================================== */
.gp-gallery-wrapper .twtb-gal {
    display: flex;
    gap: var(--gp-sg-gap, 12px);
    width: 100%;
    user-select: none;
    overflow: hidden;
    padding: 5px;
    box-sizing: border-box;
}

/* ── Bố cục ── */
.gp-gallery-wrapper .twtb-gal--right  { flex-direction: row; align-items: stretch; }
.gp-gallery-wrapper .twtb-gal--right  .twtb-gal__main   { flex: 1 1 auto; min-width: 0; }
.gp-gallery-wrapper .twtb-gal--right  .twtb-gal__thumbs { flex: 0 0 var(--gp-sg-tw, 88px); width: var(--gp-sg-tw, 88px); flex-direction: column; }
.twtb-gal--bottom { flex-direction: column; }
.twtb-gal--bottom .twtb-gal__main   { width: 100%; }
.twtb-gal--bottom .twtb-gal__thumbs { flex-direction: row; }

/* ── Main image area ── */
.twtb-gal__main {
    position: relative;
    height: var(--gp-sg-h, 480px);
    border-radius: var(--gp-sg-r, 12px);
    overflow: hidden;
    background: #111;
}
.twtb-gal__swiper { width: 100%; height: 100%; overflow: hidden; }
.twtb-gal__track  { display: flex; width: 100%; height: 100%; will-change: transform; }
.twtb-gal__slide  { flex: 0 0 100%; width: 100%; height: 100%; overflow: hidden; }
.twtb-gal__slide-link { display: block; width: 100%; height: 100%; text-decoration: none; }
.twtb-gal__slide-img  { width: 100%; height: 100% !important; object-fit: cover; display: block; }
.twtb-gal__slide-video { width: 100%; height: 100%; object-fit: cover; background: #111; display: block; }
.twtb-gal__thumb-video { width: 100%; height: 100%; display: grid; place-items: center; background: linear-gradient(135deg,#1f2937,#0f172a); color: #fff; font-size: 11px; }
.twtb-gal__thumb-video::before { content: '▶'; font-size: 16px; opacity: .9; }

/* ── Play button overlay ── */
.twtb-gal__play {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    width: 56px; height: 56px;
    border-radius: 50%; background: rgba(0,0,0,0.55);
    display: flex; align-items: center; justify-content: center;
    pointer-events: none;
}
.twtb-gal__play::before {
    content: ''; display: block;
    width: 0; height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 18px solid #fff;
    margin-left: 4px;
}

/* ── Arrows ── */
.twtb-gal__arrow {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: var(--gp-eco-z-slider, 100020);
    width: 44px; height: 44px; border-radius: 50%; border: none;
    background: rgba(255,255,255,0.82); color: #222; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 2px 12px rgba(0,0,0,0.18);
    transition: background .2s, transform .2s, box-shadow .2s; padding: 0;
    opacity: 0; visibility: hidden;
}
.twtb-gal__main:hover .twtb-gal__arrow { opacity: 1; visibility: visible; }
.twtb-gal__arrow:hover { background: rgba(255,255,255,1); box-shadow: 0 4px 18px rgba(0,0,0,0.25); transform: translateY(-50%) scale(1.08); }
.twtb-gal__arrow--prev { left: 12px; transform: translateY(-50%) translateX(-8px); }
.twtb-gal__arrow--next { right: 12px; transform: translateY(-50%) translateX(8px); }
.twtb-gal__main:hover .twtb-gal__arrow--prev { transform: translateY(-50%) translateX(0); }
.twtb-gal__main:hover .twtb-gal__arrow--next { transform: translateY(-50%) translateX(0); }
@media (min-width: 768px) {
    .twfs-nav-right .twfs-section .twtb-gal__arrow--next { right: 84px; }
    .twfs-nav-left .twfs-section .twtb-gal__arrow--prev { left: 84px; }
}

/* ── Counter ── */
.twtb-gal__counter {
    position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%);
    background: rgba(0,0,0,0.48); color: #fff;
    font-size: 13px; font-weight: 600;
    padding: 3px 11px; border-radius: 20px;
    pointer-events: none; letter-spacing: .5px; white-space: nowrap;
}

/* ── Dots ── */
.twtb-gal__dots { position: absolute; bottom: 14px; right: 14px; display: flex; gap: 5px; z-index: 10; }
.twtb-gal__dot  { width: 7px; height: 7px; border-radius: 50%; border: none; background: rgba(255,255,255,0.45); cursor: pointer; padding: 0; transition: background .25s, transform .25s; }
.twtb-gal__dot.active { background: #fff; transform: scale(1.4); }
.twtb-gal__arrow svg, .twtb-gal__tnav svg { display: block; fill: none; stroke: currentColor; }

/* ── Thumbnail container ── */
.twtb-gal__thumbs {
    display: flex;
    align-items: center;
    gap: 4px;
}
.twtb-gal--right .twtb-gal__thumbs { flex-direction: column; }

/* ── Thumb nav buttons ── */
.twtb-gal__tnav {
    flex: 0 0 auto;
    background: #f0f0f0; border: none; border-radius: 6px;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    color: #555; transition: background .18s, color .18s; padding: 5px;
}
.twtb-gal--right  .twtb-gal__tnav { width: 100%; height: 28px; }
.twtb-gal--bottom .twtb-gal__tnav { height: 100%; width: 28px; }
.twtb-gal__tnav:hover    { background: #e0e0e0; color: #111; }
.twtb-gal__tnav:disabled { opacity: .3; cursor: default; }

/* ── Viewport & track ── */

.twtb-gal--right .twtb-gal__thumbs-viewport { min-height: 0; }
.twtb-gal__thumbs-track {
    display: flex; flex-direction: column; gap: var(--gp-sg-thumb-gap, 6px);
    transition: transform .38s cubic-bezier(.4,0,.2,1);
    will-change: transform;
}
.twtb-gal--bottom .twtb-gal__thumbs-track { flex-direction: row; }

/* ── Individual thumb ── */
.twtb-gal__thumb {
    position: relative; flex: 0 0 auto;
    border: 3px solid transparent; padding: 0; cursor: pointer;
    border-radius: var(--gp-sg-thumb-r, 8px) !important; overflow: hidden;
    box-sizing: border-box;
    transition: border-color .2s, opacity .2s;
}
.twtb-gal--right .twtb-gal__thumb { width: 100%; }
.twtb-gal__thumb img { width: 100%; display: block; object-fit: cover; }
.twtb-gal--bottom .twtb-gal__thumb img { height: 100%; }
.twtb-gal__thumb.active { border: 3px solid var(--gp-sg-active-color, #e63329); }
.twtb-gal__thumb-overlay {
    position: absolute; inset: 0;
    background: rgba(0,0,0,0.22);
    transition: opacity .2s;
}
.twtb-gal__thumb.active .twtb-gal__thumb-overlay,
.twtb-gal__thumb:hover  .twtb-gal__thumb-overlay { opacity: 0; }

/* ── Tablet: 601–900px — thu nhỏ thumbnail ── */
@media (max-width: 900px) and (min-width: 601px) {
    .twtb-gal--right .twtb-gal__thumbs { flex: 0 0 70px; width: 70px; }
}

/* ── Mobile: ≤600px — ẩn thumbnail, arrows luôn hiện ── */
@media (max-width: 600px) {
    /* Right layout: stack dọc → ngang */
    .twtb-gal--right { flex-direction: column; }
    .twtb-gal--right .twtb-gal__thumbs       { flex-direction: row; width: 100%; height: 60px; flex: 0 0 60px; }
    .twtb-gal--right .twtb-gal__thumbs-track { flex-direction: row; }
    .twtb-gal--right .twtb-gal__thumb        { flex: 0 0 74px; width: 74px; height: 60px; }
    .twtb-gal--right .twtb-gal__thumb img    { width: 74px; height: 60px; }
    .twtb-gal--right .twtb-gal__tnav         { width: 44px; height: 100%; }

    /* Arrows luôn hiện trên mobile (không có hover) */
    .twtb-gal__arrow {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(-50%) !important;
        width: 44px; height: 44px;
        background: rgba(0,0,0,0.45);
        border: none;
    }
    .twtb-gal__arrow--prev { left: 8px; }
    .twtb-gal__arrow--next { right: 8px; }

    /* Dots luôn hiện trên mobile */
    .twtb-gal__dots { right: auto; left: 50%; transform: translateX(-50%); }
}

/* ── Rất nhỏ: ≤400px — ẩn thumbnail, chỉ dùng dots + arrows ── */
@media (max-width: 400px) {
    .twtb-gal--right .twtb-gal__thumbs,
    .twtb-gal--bottom .twtb-gal__thumbs { display: none !important; }
    .twtb-gal--right { flex-direction: column; }
}


/* ── MASONRY LAYOUT (Lưới so le tỷ lệ vàng 2/3) ── */
.gp-layout-masonry .gp-masonry-inner {
    display: grid;
    gap: var(--gp-gap-current);
    grid-template-columns: repeat(var(--gp-col-d), 1fr);
    /* Dùng hàm calc() chia đôi chiều cao để tạo base row chuẩn xác cho tỷ lệ 2/3 */
    grid-auto-rows: calc((var(--gp-mason-row-d, 220px) - var(--gp-gap-current)) / 2);
    grid-auto-flow: row dense;
}
@media (max-width: 1024px) {
    .gp-layout-masonry .gp-masonry-inner {
        grid-template-columns: repeat(var(--gp-col-t), 1fr);
        grid-auto-rows: calc((var(--gp-mason-row-t, 180px) - var(--gp-gap-current)) / 2);
    }
}
@media (max-width: 767px) {
    .gp-layout-masonry .gp-masonry-inner {
        grid-template-columns: repeat(var(--gp-col-m), 1fr);
        grid-auto-rows: calc((var(--gp-mason-row-m, 140px) - var(--gp-gap-current)) / 2);
    }
}

/* Kích hoạt tỷ lệ 2/3 (Ảnh ngắn chiếm 2 ô, Ảnh dài chiếm 3 ô) */
.gp-layout-masonry .gp-gallery-item.gp-tall { grid-row: span 3; }
.gp-layout-masonry .gp-gallery-item.gp-short { grid-row: span 2; }

/* Bắt buộc TẤT CẢ các thẻ bọc bên ngoài phải căng full 100% chiều cao của ô Grid */
.gp-layout-masonry .gp-gallery-item,
.gp-layout-masonry .gp-gallery-item .gp-link-wrap,
.gp-layout-masonry .gp-gallery-item .gp-media-wrap {
    height: 100% !important;
    display: block;
}

/* Ảnh tự động bám sát khung, thừa thì cắt bớt */
.gp-layout-masonry .gp-media {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover !important;
    display: block;
}
