.banner-wrapper {
    width: 100%;
    position: relative;
}

.banner-background {
    width: 100%;
}

.banner-background>img {
    width: inherit;
}

.banner-background>img.mb {
    display: block;
}

.banner-background>img.pc {
    display: none;
}

.banner-content {
    position: absolute;
    left: 5%;
    top: clamp(25px, 0.5rem + 7vw, 85px);
}

.logo {
    visibility: hidden;
    opacity: 0;
    font-size: clamp(2.25em, 11vw + 0.1rem, 5em);
    font-weight: 300;
    color: var(--company-color3);
}

.logo::before {
    content: "";
    background-image: url(/res/media/icons/yenova-icono.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 0.25em;
}

.logo>.colored {
    font-weight: bold;
    color: var(--company-color1);
}

.subtitle {
    font-size: clamp(1.25em, 5vw + 0.25rem, 3em);
    font-weight: 300;
    color: var(--company-color3);
}

.subtitle>.colored {
    font-weight: bold;
    color: var(--company-color3)
}

.banner-title {
    --_local-company-color: #80a7b9;
    width: 100%;
    padding: 1em 2em;
    background: var(--company-color2);
    background: linear-gradient(90deg, var(--company-color2) 0%, var(--company-color1) 50%, var(--_local-company-color) 100%);
}

.banner-title>h1 {
    margin: 0 auto;
    text-align: center;
    font-size: clamp(2.25em, 11vw + 0.1rem, 5em);
    font-weight: 100;
    color: white;
}

.banner-title>h1>* {
    color: inherit;
}


@media (width>=768px) {
    .banner-background>img.mb {
        display: none;
    }

    .banner-background>img.pc {
        display: block;
    }

    .banner-content {
        top: clamp(200px, 0.5rem + 28vw, 560px);
        transform: translateY(-50%);
    }

    .logo {
        visibility: visible;
        opacity: 1;
        font-size: clamp(3em, 5vw + 1rem, 6em);
    }

    .subtitle {
        font-size: clamp(2em, 3vw + 1rem, 4em);
    }

    .banner-title>h1 {
        font-size: clamp(3em, 5vw + 1rem, 6em);
    }
}