/* ==========================================================
   SECTIONS › IMAGE HERO
   Banner de imagem da home com tagline sobreposta
   ========================================================== */

.image-hero {
    position: relative;
    overflow: hidden;
    background: #fff;
}

.image-hero img {
    width: 100%;
    height: auto;
}

.image-hero picture {
    display: block;
}

.image-hero-link {
    position: relative;
    display: block;
    overflow: hidden;
}

.hero-tagline {
    position: absolute;
    z-index: 1;
    top: 62%;
    left: 4.5%;
    width: min(28%, 560px);
    padding: 3px 8px 32px;
    color: var(--green-700);
    background: #fff9eb;
    font-size: clamp(18px, 1.55vw, 30px);
    font-weight: 800;
    line-height: 1.15;
}

.image-hero-link img {
    transition: transform 0.45s ease, filter 0.45s ease;
}

.image-hero-link:hover img,
.image-hero-link:focus-visible img {
    transform: none;
    filter: saturate(1.04);
}