/* Additional CSS của mẫu */
.phongvt-img-hover-effect  {
  position: relative;
  display: inline-block;
  overflow: hidden;
}



.phongvt-img-hover-effect::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.6) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-25deg);
}

.phongvt-img-hover-effect:hover::after {
  animation: shine 0.8s ease;
}

@keyframes shine {
  100% {
    left: 125%;
  }
}


.phong-icon-box {
    display: inline-block;
    transition: transform 0.3s ease;
}

.phong-icon-box:hover {
    transform: scale(1.1); /* Phóng to nhẹ khi hover */
}


.button.phongvt-btn {
    background: #fd5624 !important;  
    color: #fff !important;
    border: 1px solid #062e39!important;
    border-radius: 16px;
    font-weight: 600;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    transition: all 0.3s ease;
}

/* Hover: nền trắng + chữ xanh + shadow xanh */
.button.phongvt-btn:hover,
.button.phongvt-btn:focus {
    background: #fff !important;
    color: #062e39 !important;
    border: 1px solid #2d5ca6 !important;
    box-shadow: 0 4px 12px rgba(45, 92, 166, 0.4); /* shadow xanh */
}




.phongvt-imgbox .box {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    transition: all .4s ease;
    box-shadow: 0 8px 25px rgba(0,0,0,.12);
}

/* Ảnh */
.phongvt-imgbox .box-image {
    overflow: hidden;
    border-radius: 12px;
}

.phongvt-imgbox .box-image img {
    width: 100%;
    transition: transform .6s cubic-bezier(.2,.6,.3,1),
                filter .4s ease;
}

/* Lớp tối trên ảnh */
.phongvt-imgbox .box-image:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(3, 25, 45, .82) 0%,
        rgba(3, 25, 45, .25) 48%,
        rgba(3, 25, 45, .03) 100%
    );
    transition: .4s ease;
    pointer-events: none;
}

/* Ánh sáng chạy */
.phongvt-imgbox .box-image:before {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 55%;
    height: 100%;
    z-index: 3;
    background: linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.28),
        transparent
    );
    transform: skewX(-20deg);
    transition: .7s ease;
    pointer-events: none;
}

/* Nội dung */
.phongvt-imgbox .box-text {
    z-index: 5;
    transition: transform .4s ease;
}

/* Tiêu đề */
.phongvt-imgbox .box-text h5,
.phongvt-imgbox .box-text .uppercase,
.phongvt-imgbox .box-text .image-box-text {
    color: #fff !important;
    font-weight: 700;
    text-shadow: 0 2px 8px rgba(0,0,0,.35);
}

/* Hover cả card */
.phongvt-imgbox:hover .box {
    transform: translateY(-7px);
    box-shadow: 0 18px 40px rgba(0, 48, 76, .25);
}

/* Zoom ảnh */
.phongvt-imgbox:hover .box-image img {
    transform: scale(1.08);
    filter: brightness(1.07);
}

/* Overlay đậm hơn */
.phongvt-imgbox:hover .box-image:after {
    background: linear-gradient(
        to top,
        rgba(0, 44, 67, .9) 0%,
        rgba(0, 85, 105, .32) 55%,
        rgba(0, 85, 105, .06) 100%
    );
}

/* Ánh sáng quét */
.phongvt-imgbox:hover .box-image:before {
    left: 140%;
}

/* Nội dung nhấc nhẹ */
.phongvt-imgbox:hover .box-text {
    transform: translateY(-6px);
}

/* Viền */
.phongvt-imgbox .box:after {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 12px;
    pointer-events: none;
    z-index: 6;
    transition: .4s ease;
}

.phongvt-imgbox:hover .box:after {
    border-color: rgba(255,255,255,.5);
}

/* =========================
   HERO CONTENT - LOGISTICS
   ========================= */

.phong-hero-content{
    position: relative;
    max-width: 980px;
    padding: 28px 34px 30px;
    border-left: 4px solid #ff542e;
    background: linear-gradient(
        90deg,
        rgba(0, 25, 45, .68) 0%,
        rgba(0, 25, 45, .34) 65%,
        rgba(0, 25, 45, 0) 100%
    );
    border-radius: 0 16px 16px 0;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

/* Tiêu đề */
.phong-hero-content h1,
.phong-hero-content h2{
    position: relative;
    margin: 0 0 18px !important;
    color: #fff !important;
    font-size: clamp(34px, 4vw, 58px);
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -1.5px;
    text-shadow: 0 4px 18px rgba(0,0,0,.35);
}



/* Đoạn mô tả */
.phong-hero-content p{
    margin: 0 !important;
    max-width: 900px;
    color: rgba(255,255,255,.94) !important;
    font-size: 19px;
    line-height: 1.75;
    font-weight: 400;
    text-shadow: 0 2px 8px rgba(0,0,0,.35);
}

/* Hiệu ứng xuất hiện */
.phong-hero-content{
    animation: phongHeroShow .8s ease both;
}

@keyframes phongHeroShow{
    from{
        opacity: 0;
        transform: translateX(-35px);
    }
    to{
        opacity: 1;
        transform: translateX(0);
    }
}

/* Mobile */
@media(max-width: 849px){
    .phong-hero-content{
        padding: 22px 22px 24px;
        border-left-width: 3px;
        border-radius: 0 12px 12px 0;
    }

    .phong-hero-content h1,
    .phong-hero-content h2{
        font-size: 36px;
        line-height: 1.15;
        letter-spacing: -1px;
    }

    .phong-hero-content p{
        font-size: 16px;
        line-height: 1.65;
    }
}

@media(max-width: 549px){
    .phong-hero-content{
        padding: 18px;
        background: rgba(0, 28, 48, .62);
        border-radius: 10px;
        border-left: 3px solid #ff542e;
    }

    .phong-hero-content h1,
    .phong-hero-content h2{
        font-size: 30px;
    }

    .phong-hero-content h1:after,
    .phong-hero-content h2:after{
        width: 55px;
        height: 3px;
        margin-top: 12px;
    }

    .phong-hero-content p{
        font-size: 15px;
    }
}

/* Nút liên hệ nổi (plugin PhongVT Button Contact của mẫu) */
/* PhongVT Button Contact Pro - Trường Phong / Thememoi.vn */
.pvbc-pc-box{position:fixed;display:flex;flex-direction:column;align-items:flex-end;gap:10px;z-index:99999}
.pvbc-pc-item{width:46px;height:46px;min-width:46px;min-height:46px;padding:0;margin:0;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.2);text-decoration:none;border:0!important;cursor:pointer;position:relative;transition:.22s;color:#fff;line-height:1;-webkit-appearance:none;appearance:none;overflow:visible}
.pvbc-pc-item img{width:27px;height:27px;object-fit:contain;display:block;border-radius:50%;margin:0!important;padding:0!important;max-width:27px!important;max-height:27px!important}
.pvbc-pc-item span{position:absolute;right:56px;top:50%;transform:translateY(-50%);background:#fff;color:#333;padding:8px 13px;border-radius:18px;box-shadow:0 3px 12px rgba(0,0,0,.12);font-weight:600;font-size:13px;white-space:nowrap;opacity:0;visibility:hidden;transition:.22s;line-height:1.2}
.pvbc-pc-item:hover{transform:translateY(-2px) scale(1.04);filter:brightness(.98)}
.pvbc-pc-item:hover span{opacity:1;visibility:visible;right:60px}
.pvbc-pc-call{animation:pvbc-shake .7s infinite}.pvbc-pc-top{display:none}.pvbc-pc-top.show{display:flex}
@keyframes pvbc-shake{0%,100%{transform:rotate(0)}20%{transform:rotate(10deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(8deg)}80%{transform:rotate(-8deg)}}
@media(max-width:850px){.pvbc-pc-box{display:none!important}}

/* ===== Bổ sung khi dựng lại ===== */
/* Nút Zalo dạng chữ (thay ảnh hotlink của plugin gốc) */
.pvbc-pc-item i{font-size:22px;color:#fff;line-height:1}
.pvbc-pc-item .pvbc-zalo-text{color:#fff;font-size:12px;font-weight:700;font-family:Arial,sans-serif}
.pvbc-pc-box{bottom:70px;right:15px}