/* SECTION 1 -  Sheet Piles */

section.section__sheet__piles {
    background: url(../../../../assets/images/sheet-piles/section-1-sheet-piles-content-bg.jpg) no-repeat center center / cover;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 700px;
}

section.section__sheet__piles .header {
    margin: auto;
    max-width: 1172px;
}

section.section__sheet__piles .header h1 {
    color: #FFF;
    text-align: center;
    font-family: Inter;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

section.section__sheet__piles .header p {
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 300;
    letter-spacing: 0.5px;
}

section.section__sheet__piles .header p:last-child {
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 300;
    letter-spacing: 0.5px;
}

section.section__sheet__piles .cta-button {
    width: 100%;
    max-width: 200px;
    margin-top: 30px;
    transition: ease 0.5s;
}

section.section__sheet__piles .header {
    width: 100%;
    max-width: 1172px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}


/* SECTION 2 - Types of Sheet Piles Offered by Regan */

.section__types__of__sheet__files__offered .u-pile>a,
.section__types__of__sheet__files__offered .z-pile>a,
.section__types__of__sheet__files__offered .accessories>a {
    text-decoration: none;
}

section.section__types__of__sheet__files__offered {
    background: #F3F3F3;
}

section.section__types__of__sheet__files__offered .content .sheet-piles-container div:not([class="cta-button"]) {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: end;
}

section.section__types__of__sheet__files__offered h2 {
    color: var(--dark-red, #A1102B);
    text-align: center;
    font-family: Inter;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

section.section__types__of__sheet__files__offered .cta-button a {
    color: #F21840;
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    background-color: #FFF;
}

section.section__types__of__sheet__files__offered .content .sheet-piles-container div h3,
section.section__types__of__sheet__files__offered .content .sheet-piles-container div p {
    color: #FFF;
    margin-bottom: 15px;
}

section.section__types__of__sheet__files__offered .content .sheet-piles-container div:hover p {
    color: #000
}

section.section__types__of__sheet__files__offered .content .sheet-piles-container div h3 {
    text-transform: uppercase;
}

section.section__types__of__sheet__files__offered .content .sheet-piles-container :hover a.view_more.cta {
    color: #FFF;
    transition: ease 0.5s;
}

section.section__types__of__sheet__files__offered .content .sheet-piles-container :hover .view_more {
    background: #F21840 !important;
    transition: ease 0.5s;
}

section.section__types__of__sheet__files__offered .content .sheet-piles-container div:hover h3 {
    color: #F21840 !important;
    transition: ease 0.5s;
}

section.section__types__of__sheet__files__offered .content .sheet-piles-container div h3 {
    max-width: 215px;
}

section.section__types__of__sheet__files__offered .header {
    margin: auto;
    max-width: 889px;
}

section.section__types__of__sheet__files__offered .sheet-piles-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(490px, 1fr));
    grid-template-rows: 1fr;
    grid-gap: 30px;
    align-items: stretch;
}


/* U-Type Sheet Piles */

section.section__types__of__sheet__files__offered .u-pile {
    position: relative;
    height: 100%;
    min-height: 305px;
    background: url('../../../../assets/images/sheet-piles/u-type-sheet-piles.jpg')no-repeat top center/cover;
}

section.section__types__of__sheet__files__offered .u-pile:hover {
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.30) 100%), url(../../../../assets/images/sheet-piles/u-type-sheet-piles.jpg) top center / cover, #7e7e7e -300.951px 0px / 167.495% 100% no-repeat;
    background-blend-mode: hard-light, luminosity;
    transition: ease 0.5s;
}


/* Z-Type Sheet Piles */

section.section__types__of__sheet__files__offered .z-pile {
    position: relative;
    height: 100%;
    min-height: 305px;
    background: url('../../../../assets/images/sheet-piles/z-type-sheet-piles.jpg')no-repeat top center/cover;
}

section.section__types__of__sheet__files__offered .z-pile:hover {
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.30) 100%), url(../../../../assets/images/sheet-piles/z-type-sheet-piles.jpg) top center / cover, #7e7e7e -300.951px 0px / 167.495% 100% no-repeat;
    background-blend-mode: hard-light, luminosity;
    transition: ease 0.5s;
}


/* Accessories */

section.section__types__of__sheet__files__offered .accessories {
    position: relative;
    height: 100%;
    min-height: 305px;
    background: url('../../../../assets/images/sheet-piles/accessories.jpg')no-repeat top center/cover;
}

section.section__types__of__sheet__files__offered .accessories:hover {
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.30) 100%), url(../../../../assets/images/sheet-piles/accessories.jpg) top center / cover, #7e7e7e -300.951px 0px / 167.495% 100% no-repeat;
    background-blend-mode: hard-light, luminosity;
    transition: ease 0.5s;
}

@media (max-width:1199px) {
    section.section__types__of__sheet__files__offered .sheet-piles-container {
        display: flex;
        flex-direction: column;
        gap: 30px 0;
    }
    /* section.section__types__of__sheet__files__offered .u-pile{
        background-position: center center;
    }
    section.section__types__of__sheet__files__offered .z-pile{
        background-position: center center;
    }
    section.section__types__of__sheet__files__offered .accessories{
        background-position: center center;
    }
    */
}

@media (max-width:575px) {
    section.section__types__of__sheet__files__offered .content .sheet-piles-container div:not([class="cta-button"]) {
        justify-content: end;
        padding: 20px;
    }
}