/* =======================================================================
   Home Care Page Styles
======================================================================= */
#home-care {
    .home-care__image--large {
        height: 100%;
        width: 100%;

        img {
            height: 100%;
            width: 100%;
            object-fit: cover;
        }
    }

    .home-care__image--grid {
        grid-template-columns: repeat(auto-fill, minmax(min(9.5rem, 100%), 1fr));
        gap: 1rem;
    }

    .home-care__flow {
        gap: 4rem;
        width: 100% !important;
        max-width: 1200px;

        .home-care__flow-item {
            position: relative;

            &:not(:last-child):after {
                content: "\f0d7";
                font-family: 'Font Awesome 7 Free';
                font-weight: 900;
                position: absolute;
                bottom: -28px;
                left: 50%;
                transform: translateX(-50%);
                font-size: 1.5rem;
                color: #E95513;
            }

            .home-care__flow-number {
                background-color: #E95513;
                border-radius: 100vmax;
                color: #FFF;
                display: grid;
                place-items: center;
                font-size: 3rem;
                font-weight: bold;
                margin-left: auto;
                margin-right: auto;
                position: absolute;
                top: -40px;
                left: 50%;
                transform: translateX(-50%);
                width: 80px;
                height: 80px;
            }

            .home-care__flow-title {
                margin: 0 auto;
            }
        }
    }
}




/* =======================================================================
   Media Query
======================================================================= */
@media (min-width: 856px) {
    #home-care {
        .home-care__image--grid {
            grid-template-columns: repeat(auto-fill, minmax(min(12rem, 100%), 1fr));
        }
    }
}

@media (min-width: 769px) {
    #home-care {
    }
}

@media (min-width: 496px) {
    #home-care {
        .home-care__flow {
            gap: 2rem;

            .home-care__flow-item {
                margin-bottom: 2.5rem;

                &:not(:last-child):after {
                    content: "\f0da";
                    font-family: 'Font Awesome 7 Free';
                    font-weight: 900;
                    top: 50%;
                    left: initial;
                    right: -20px;
                    bottom: initial;
                    transform: translateY(-50%);
                }
            }
        }
    }
}