/* =========================================
   SRG BLOG CATEGORY BANNERS
   ========================================= */


/* =========================================
   HIDE SHARED CATEGORY BANNER
   ON MAIN BLOG HOMEPAGE
   ========================================= */

html:has(link[rel="canonical"][href="https://www.srgpros.com/blog"])
.section.banner,

html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/"])
.section.banner {
    display: none !important;
}


/* =========================================
   CATEGORY PAGE BANNER
   ========================================= */

html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"]) .section.banner,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"]) .section.banner,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"]) .section.banner,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"]) .section.banner,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"]) .section.banner,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"]) .section.banner {

    position: relative !important;
    width: 100% !important;

    height: 150px !important;
    min-height: 150px !important;
    max-height: 150px !important;

    margin-top: 0 !important;
    margin-bottom: 30px !important;
    padding: 0 !important;

    overflow: hidden !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}


/* =========================================
   PAGE-SPECIFIC BACKGROUNDS
   ========================================= */


/* Leadership Insights - Page Title 02 */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"])
.section.banner {
    background-image: url("https://www.srgpros.com/Image Library/1fde6a86-70ca-4d6c-97c6-f5123752fc8a/Main Images/Backgrounds for Page Title Attribute/Page-Title-02.webp") !important;
}


/* Candidate - Page Title 03 */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"])
.section.banner {
    background-image: url("https://www.srgpros.com/Image Library/1fde6a86-70ca-4d6c-97c6-f5123752fc8a/Main Images/Backgrounds for Page Title Attribute/Page-Title-03.webp") !important;
}


/* Technology - Page Title 02 */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"])
.section.banner {
    background-image: url("https://www.srgpros.com/Image Library/1fde6a86-70ca-4d6c-97c6-f5123752fc8a/Main Images/Backgrounds for Page Title Attribute/Page-Title-02.webp") !important;
}


/* Professional Services - Page Title 01 */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"])
.section.banner {
    background-image: url("https://www.srgpros.com/Image Library/1fde6a86-70ca-4d6c-97c6-f5123752fc8a/Main Images/Backgrounds for Page Title Attribute/Page-Title-01.webp") !important;
}


/* Engineering - Page Title 04 */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"])
.section.banner {
    background-image: url("https://www.srgpros.com/Image Library/1fde6a86-70ca-4d6c-97c6-f5123752fc8a/Main Images/Backgrounds for Page Title Attribute/Page-Title-04.webp") !important;
}


/* Inside SRG - Page Title 04 */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"])
.section.banner {
    background-image: url("https://www.srgpros.com/Image Library/1fde6a86-70ca-4d6c-97c6-f5123752fc8a/Main Images/Backgrounds for Page Title Attribute/Page-Title-04.webp") !important;
}


/* =========================================
   INNER CMS CONTAINER
   ========================================= */

html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"]) .section.banner .banner-contained,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"]) .section.banner .banner-contained,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"]) .section.banner .banner-contained,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"]) .section.banner .banner-contained,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"]) .section.banner .banner-contained,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"]) .section.banner .banner-contained {

    position: static !important;

    width: 100% !important;

    height: 150px !important;
    min-height: 150px !important;
    max-height: 150px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Prevent CMS wrappers from moving title */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"]) .section.banner .banner-contained > div,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"]) .section.banner .banner-contained > div,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"]) .section.banner .banner-contained > div,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"]) .section.banner .banner-contained > div,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"]) .section.banner .banner-contained > div,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"]) .section.banner .banner-contained > div {

    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================
   H1 POSITIONING
   ========================================= */

html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"]) .section.banner h1,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"]) .section.banner h1,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"]) .section.banner h1,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"]) .section.banner h1,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"]) .section.banner h1,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"]) .section.banner h1 {

    position: absolute !important;

    top: 50% !important;
    left: 50% !important;

    right: auto !important;
    bottom: auto !important;

    transform: translate(-50%, -50%) !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 20px !important;

    box-sizing: border-box !important;

    /* Hide shared CMS title */
    font-size: 0 !important;

    line-height: 1.2 !important;

    color: #ffffff !important;
    text-align: center !important;

    z-index: 10 !important;
}


/* =========================================
   GENERATED TITLE STYLE
   ========================================= */

html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"]) .section.banner h1::after,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"]) .section.banner h1::after,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"]) .section.banner h1::after,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"]) .section.banner h1::after,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"]) .section.banner h1::after,
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"]) .section.banner h1::after {

    display: block !important;

    font-size: 42px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;

    color: #ffffff !important;
    text-align: center !important;
}


/* =========================================
   PAGE-SPECIFIC TITLES
   ========================================= */


/* Leadership Insights */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"])
.section.banner h1::after {
    content: "Leadership Insights";
}


/* Candidate */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"])
.section.banner h1::after {
    content: "Candidate";
}


/* Technology */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"])
.section.banner h1::after {
    content: "Technology";
}


/* Professional Services */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"])
.section.banner h1::after {
    content: "Professional Services";
}


/* Engineering */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"])
.section.banner h1::after {
    content: "Engineering";
}


/* Inside SRG */
html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"])
.section.banner h1::after {
    content: "Inside SRG";
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 768px) {

    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"]) .section.banner,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"]) .section.banner,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"]) .section.banner,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"]) .section.banner,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"]) .section.banner,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"]) .section.banner {

        height: 120px !important;
        min-height: 120px !important;
        max-height: 120px !important;

        margin-bottom: 20px !important;
    }


    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"]) .section.banner .banner-contained,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"]) .section.banner .banner-contained,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"]) .section.banner .banner-contained,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"]) .section.banner .banner-contained,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"]) .section.banner .banner-contained,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"]) .section.banner .banner-contained {

        height: 120px !important;
        min-height: 120px !important;
        max-height: 120px !important;
    }


    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/leadership-insights"]) .section.banner h1::after,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/candidate"]) .section.banner h1::after,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/technology"]) .section.banner h1::after,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/professional-services"]) .section.banner h1::after,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/engineering"]) .section.banner h1::after,
    html:has(link[rel="canonical"][href="https://www.srgpros.com/blog/inside-srg"]) .section.banner h1::after {

        font-size: 32px !important;
        line-height: 1.2 !important;
    }
}