.hero {
    position: relative;
    height: 884px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url('../images/hero-bg.png') center/cover no-repeat;
    padding: 0 var(--section-padding-x);
    overflow: hidden;
    background-size: 124%;
}

.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
}

.hero__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 60px;
    margin-left: auto;
}

.hero__title-block {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.hero__title {
    font-family: var(--font-heading);
    font-weight: var(--fw-extrabold);
    font-size: var(--fs-h1);
    line-height: var(--lh-h1);
    color: var(--color-white);
}

.hero__subtitle {
    font-size: var(--fs-body-lg);
    font-weight: var(--fw-medium);
    line-height: var(--lh-body-lg);
    color: var(--color-white);
}

.hero__buttons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}

.hero__btn-discuss img {
    width: 20px;
    height: 20px;
    transition: transform var(--transition-fast);
}

.hero__btn-discuss:hover img {
    transform: translateX(4px);
}