.page-template-home_new {
    .hdp__home_mosaique {
        display: flex;
        flex-direction: column;
        gap: 16px;

        @media (min-width: 768px) {
            height: 560px;
            display: grid;
            grid-template-columns: 3fr 2fr;
            grid-template-rows: 1fr 1fr;
        }

        .hdp__home_mosaique_item {
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;

            &:not(.first) {
                &>a {
                    padding: 20px;
                    height: 100%;
                    display: flex;
                    width: 100%;
                    align-items: end;
                    text-decoration: none !important;
                    position: relative;

                    &:after {
                        content: "";
                        position: absolute;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 100%;
                        background: linear-gradient(180deg, rgba(89, 165, 208, 0.47) 0%, rgba(0, 56, 103, 0.9) 100%);
                        transition: background 0.3s ease;
                    }

                    &:hover {
                        &:after {
                            background: linear-gradient(180deg, rgba(89, 165, 208, 0.7) 0%, rgba(0, 56, 103, 0.9) 0%);
                        }

                        span {
                            &.btnorange {
                                background-color: #fff !important;
                                color: #003867 !important;
                            }
                        }
                    }

                    .hdp__home_mosaique_item_content {
                        * {
                            position: relative;
                            z-index: 2;

                            &:not(.btnorange) {
                                color: #fff;
                            }

                            &.btnorange {
                                padding: 8px 12px;
                            }
                        }

                        h3 {
                            margin: 5px 0 13px 0;
                            font-size: 16px;
                            line-height: 18px;
                        }

                        span {
                            &:not(.btnorange) {
                                font-weight: 300;
                                font-size: 14px;
                                line-height: 16px;
                            }
                        }
                    }
                }
            }

            &.first {
                grid-column: 1;
                grid-row: 1;
                height: fit-content;

                &>h2 {
                    margin: 0;

                    @media (min-width: 768px) {
                        font-size: 32px;
                        line-height: 36px;
                    }
                }
            }

            &:not(.hdp__home_mosaique_item--main) {
                &>a {
                    @media (min-width: 768px) {
                        padding: 32px !important;
                    }
                }
            }

            &.hdp__home_mosaique_item--main {
                grid-row: 1 / span 2;
                position: relative;
                grid-column: 1;

                @media (min-width: 768px) {
                    &>a {
                        margin-top: 90px;
                        padding: 40px;
                    }

                    .hdp__home_mosaique_item_content {
                        h3 {
                            font-size: 24px !important;
                            line-height: 26px !important;
                        }

                        span {
                            &:not(.btnorange) {
                                font-size: 16px !important;
                                line-height: 20px !important;
                            }
                        }
                    }
                }
            }
        }
    }
}