:root {
    --font-base: 'Mullish', sans-serif;

    --color-dark-blue: #0A2342;
    --color-primary: #007BFF;
    --color-primary-hover: #0056b3;
    --color-white: #ffffff;

    --shadow-hover: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.h-semi-screen {
    height: calc(100vh/2)
}

.h-third-screen {
    height: calc(100vh/1.33)
}
.h-fourth-screen {
    height:calc(100vh/1.2)
}

.overlay::after {
    content: "";
    width: 100%;
    height: 100%;
    background: #0A2342bb;
    position:absolute;
    inset: 0;
    z-index:1;
}
.bg-hero {
    background-image: url(../assets/img/rig-1.jpg), url(../assets/img/hex-overlay.jpg);
    background-repeat: no-repeat, repeat;
    background-size: cover;
    background-blend-mode: multiply, screen, luminosity;
    position:relative;
    
}

.bg-hero::before{
    content: "";
    width: 100%;
    height: 100%;
    background: #0A234290;
    position:absolute;
    inset: 0;
    z-index:1;
}

.container {
    max-width: 85%;
    margin-inline:auto;
}

button:hover .service {
    color: white;
}