/* Homepage Card Image */
.homepage-card-img {
    height: 170px;
    object-fit: cover;
}

/* Homepage Category Icon Container */
.homepage-category-icon {
    width: 80px;
    height: 80px;
}

/* Homepage Category Image */
.homepage-category-img {
    max-width: 48px;
    max-height: 48px;
    object-fit: contain;
}

/* Homepage Blog Image */
.homepage-blog-img {
    height: 200px;
    object-fit: cover;
}

/* Homepage Blog Image Empty State */
.homepage-blog-img-empty {
    height: 200px;
}

/* Promo Banners */
.promo-carousel {
    border-radius: 16px;
    overflow: hidden;
}

.promo-banner-card {
    border-radius: 12px;
    overflow: hidden;
    background: #f8f9fa;
}

.promo-banners {
    --promo-gap: 16px;
    --promo-tile-height: 200px;
    --bs-gutter-y: 0;
    --promo-split-gap: 16px;
}

.promo-banners.row {
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
    margin-left: 0;
    margin-right: 0;
}

.promo-banners.row > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
}

.promo-left,
.promo-right {
    display: flex;
    align-items: stretch;
}

.promo-left {
    padding-right: 0;
}

.promo-right {
    padding-left: 0;
}

.promo-left .promo-carousel {
    margin-right: var(--promo-split-gap);
}

.promo-right .promo-grid {
    margin-left: var(--promo-split-gap);
}

.promo-carousel,
.promo-carousel .carousel-inner,
.promo-carousel .carousel-item {
    height: 100%;
}

.promo-carousel .carousel-item > a,
.promo-banner-card > a {
    display: block;
    height: 100%;
}

.promo-banner-img {
    display: block;
    width: 100%;
    object-fit: cover;
}

.promo-carousel .promo-banner-img {
    height: 100%;
}

.promo-banner-card .promo-banner-img {
    height: var(--promo-tile-height);
}

.promo-right .promo-grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--promo-gap);
    height: calc(2 * var(--promo-tile-height) + var(--promo-gap));
    align-content: stretch;
}

.promo-grid {
    margin: 0;
}

.promo-grid-item {
    height: var(--promo-tile-height);
    display: flex;
}

.promo-banner-card {
    height: 100%;
}

.promo-left {
    height: calc(2 * var(--promo-tile-height) + var(--promo-gap));
    align-self: stretch;
}

@media (max-width: 991.98px) {
    .promo-banners {
        --promo-tile-height: 180px;
        --promo-gap: 12px;
    }
    .promo-left {
        height: calc(2 * var(--promo-tile-height) + var(--promo-gap));
    }
}

@media (max-width: 575.98px) {
    .promo-banners {
        --promo-tile-height: 150px;
        --promo-gap: 10px;
    }
    .promo-left {
        height: auto;
        margin-bottom: 12px;
    }

    .promo-carousel,
    .promo-carousel .carousel-inner,
    .promo-carousel .carousel-item {
        min-height: 200px;
    }

    .promo-right .promo-grid {
        grid-template-columns: 1fr;
        height: auto;
        width: 100%;
    }

    .promo-grid-item {
        height: auto;
        width: 100%;
    }

    .promo-banner-card {
        width: 100%;
    }

    .promo-left .promo-carousel {
        margin-right: 0;
    }

    .promo-right .promo-grid {
        margin-left: 0;
    }
}

/* Homepage category cards */
.category-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    border-radius: 16px;
    padding: 1rem;
    background: #ffffff;
    border: 1px solid var(--outline);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

.category-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.icon-circle {
    width: 78px;
    height: 78px;
}