/* =========================================================
   POLLARD CAD HERO SYSTEM
========================================================= */


/* =========================================================
   BASE HERO
========================================================= */


.hero,
.page-hero {


    min-height:75vh;


    background-position:center;


    background-size:cover;


    background-repeat:no-repeat;


    display:flex;


    align-items:center;


    justify-content:center;


    position:relative;


    text-align:center;


    color:white;


    overflow:hidden;


}




/* =========================================================
   HOMEPAGE HERO
========================================================= */


.hero {


    background-image:
    url('/assets/images/hero-home.png');


}





/* =========================================================
   INTERNAL PAGE HERO
========================================================= */


.page-hero {


    min-height:
    50vh;


}




/* =========================================================
   PROJECT HERO
========================================================= */


.page-hero.projects {


    background-image:
    url('/assets/images/projects/20-minute-lake/hero.jpg');


}





/* =========================================================
   HERO OVERLAY
========================================================= */


.hero::before,
.page-hero::before {


    content:"";


    position:absolute;


    inset:0;


    background:


    linear-gradient(

    rgba(15,23,42,.85),

    rgba(15,23,42,.65)

    );


    z-index:1;


}





/* =========================================================
   HERO CONTENT
========================================================= */


.hero > div,
.page-hero > div {


    position:relative;


    z-index:2;


    max-width:950px;


    padding:30px;


}





/* =========================================================
   HERO TITLE
========================================================= */


.hero h1,
.page-hero h1 {


    color:white;


    font-size:

    clamp(36px,5vw,56px);


    font-weight:900;


    line-height:1.15;


    letter-spacing:-1px;


    margin-bottom:20px;


    text-shadow:


    0 4px 20px rgba(0,0,0,.8);


}





/* =========================================================
   HERO SUBTITLE
========================================================= */


.hero p,
.page-hero p {


    color:white;


    font-size:


    clamp(17px,2vw,22px);


    font-weight:600;


    max-width:850px;


    margin:0 auto;


    line-height:1.6;


    text-shadow:


    0 3px 12px rgba(0,0,0,.8);


}





/* =========================================================
   HERO BUTTON SPACING
========================================================= */


.hero .btn,
.page-hero .btn {


    margin-top:30px;


}





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


@media(max-width:768px){


.hero,
.page-hero {


    min-height:60vh;


}



.hero h1,
.page-hero h1 {


    font-size:34px;


}



.hero p,
.page-hero p {


    font-size:17px;


}


}