/* =========================================================
   CHỐNG THẤM BUTYL - HOMEPAGE CSS
   File: butyl-home.css

   Chỉ load tại trang chủ.
========================================================= */


/* =========================================================
   1. BUTTON HOMEPAGE
========================================================= */

.btn {
    margin-top: 30px;
}


/* =========================================================
   2. BANNER
========================================================= */

.banner > .banner-bg > .fill {
    height: 100% !important;
}


/* =========================================================
   3. PROJECT LIST
========================================================= */

.project-list .box {
    border-radius: 6px;
}


/* Khung ảnh */
.project-list .box-image {
    padding: 12px;
}


/* Bo góc vùng ảnh zoom */
.project-list .image-zoom {
    border-radius: 4px;
}


/* Tiêu đề project */
.project-list .post-title {
    height: 55px;

    color: #101828;

    font-size: 14px;
    font-weight: 600;
}


/* Ẩn divider mặc định */
.project-list .is-divider {
    display: none;
}


/* Badge */
.project-list .badge .badge-inner {
    border: none;

    background-color: #373A40;

    color: #FFFFFF;
}


/* Nội dung card */
.project-list .box-text {
    border-radius: 4px;
}


/* =========================================================
   4. PROJECT CARD INTERACTION
========================================================= */

.project-col {
    cursor: pointer;
}


.project-col img {
    transition: transform 0.3s ease;
}


.project-col:hover img {
    transform: scale(1.2);
}


/* =========================================================
   5. ACCESSIBILITY - REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .project-col img {
        transition: none;
    }

    .project-col:hover img {
        transform: none;
    }

}