.hero{

    position:relative;

    min-height:100vh;

    display:flex;

    align-items:center;

    background-image:url("../images/hero/backgrount_temp.jpeg");

    background-size:cover;

    background-position:center;

    background-repeat:no-repeat;
    padding-top: 120px;

}

.hero-overlay{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.55);

}

.hero .container{

    position:relative;

    z-index:2;

}

.hero-content{

    max-width:700px;

    color:white;

}

.hero-content h1{

    color:white;

    font-size:clamp(2.8rem,6vw,5rem);

    line-height:1.1;

    margin-bottom:1.5rem;

}

.hero-content h1 span{

    color:var(--primary);

}

.hero-content p{

    font-size:1.2rem;

    margin-bottom:2rem;

    color:rgba(255,255,255,.9);

}

.hero-buttons{

    display:flex;

    gap:1rem;

    flex-wrap:wrap;

}

.btn-outline-light{

    border-radius:50px;

    padding:14px 28px;

}