/*
Block Name: Case Studies
Description: A custom block for BAS Frames for displaying a large case study call to action.
*/

body.wp-admin section.block-columns { border: 1px solid #ccc; }
body.wp-admin section .container .grid:empty:before { font-size: 2rem; color: #e88b39; font-weight: 600; content: "This is an empty *block* - add content"; padding: 2rem 0; display: block;}
body.wp-admin section .container .grid .col:empty:before { color: #e88b39; font-weight: 600; content: "This is an empty *column* - add content"; padding: 2rem 0; display: block;}
section.block-featured-projects { position: relative; }

section.block-case-studies .container.cs-title-area { margin-bottom: 10rem; }
section.block-case-studies .container.cs-title-area p { padding-right: 2rem; }
.cs-featured-section { position: relative; padding-bottom: 5rem; color: #fff; z-index: 1;}
.cs-featured-section:before { content: ""; background: var(--brand-2); top: 0; left: 0; right: 50%; bottom: 10rem; display: block; position: absolute; border-radius: 0 1rem 10rem 0; height: 75%;}
.cs-background{position: absolute; width: 100%; height: 85%; z-index: -1;}

section.block-case-studies .cs-featured-section h3 {font-size: 9rem;line-height: 1;margin: 4rem 0 3rem 0;color: #fff; padding-right: 2rem;}
section.block-case-studies .cs-featured-section a.button { margin-top: 4rem; position: relative; z-index: 4; }
section.block-case-studies .right-col a.button:hover { color: #fff; }
.container.cs-loop-case-studies { margin-top: -10rem; background: #fff; border-radius: 0 1rem 1rem 0;}

section.block-case-studies .right-col { color: var(--text-color); }
section.block-case-studies .right-col h3 { font-size: calc( var(--base-heading-size) / 3 ); color: var(--brand-1); }

@media(max-width: 1024px){
    .block-case-studies .cs-featured-section:before{right: 0; z-index: 0;}
    .block-case-studies .container{position: relative; z-index: 1;}
    section.block-case-studies .container.cs-title-area .grid{grid-template-columns: 1fr !important;}

    section.block-case-studies .container.cs-loop-case-studies{border-radius: 1rem;}
    section.block-case-studies .left-col{min-height: 300px;}
}