.fine {
    max-width: 1520px;
    width: 100%;
    
    margin-inline: auto;
    padding-block: 5rem;
}

.fine__title {
    margin-bottom: 2.5rem;
}

.fine__header {
    background-color: var(--blue);
    box-shadow: 0px 3.75px 22.5px 0px rgba(0, 0, 0, 0.16);
    border-radius: 9px;
    
    position: relative;
}

.fine__content--header {
    padding-left: 2.5rem;
    padding-block: 3rem;
    
    color: var(--white);
    
    max-width: 710px;
    width: 100%;
}

.fine__subtitle {
    font-size: 1.75rem;
    text-transform: uppercase;
    font-weight: 500;
    
    margin-top: 0;
    margin-bottom: 1.75rem;
}

.fine__text {
    font-weight: 500;
    
    margin-block: 0;
}

.fine__decor {
    position: absolute;;
}

.fine__decor--header {
    top: 0;
    right: 0;
    
    height: 100%;
}

.fine__decor--header > img {
    height: 100%;
}


.fine__body {
    box-shadow: 0px 3.75px 22.5px 0px rgba(0, 0, 0, 0.16);
    border-radius: 9px;
    
    margin-top: 1.25rem;
    
    position: relative;
}

.fine__content--body {
    margin-left: auto;
    margin-right: 0;
    
    padding-block: 3rem;
    padding-right: 2.5rem;
    
    max-width: 967px;
    width: 100%;
}

.fine__text--body {
    color: var(--black);
    font-size: var(--text5-size);
    font-weight: 500;
    
    margin-bottom: 1.75rem;
}

.fine__decor--body {
    top: 0;
    left: 0;
}

.fine__decor-img--mobile {
    display: none;
}


@media(max-width: 1536px) {
    .fine {
        width: auto;
        
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }
    
    .fine__content--header {
        width: 50%;
    }
    
    .fine__content--body {
        max-width: 55%;
    }
}

@media(max-width: 1024px) {
    .fine__header {
        position: relative;
    }
    
    
    .fine__header:after {
        content: '';
        
        position: absolute;
        top: 0;
        left: 0;
        
        width: 100%;
        height: 100%;
        
        background-color: var(--blue);
        
        opacity: .6;
    }
    
    .fine__content--header {
        position: relative;
        
        width: 100%;
        max-width: 100%;
        
        z-index: 2;
    }
    
    
    .fine__body {
        position: relative;
    }
    
    .fine__body:after {
        content: '';
        
        position: absolute;
        top: 0;
        left: 0;
        
        width: 100%;
        height: 100%;
        
        background-color: var(--white);
        
        opacity: .5;
    }
    
    .fine__content--body {
        position: relative;
        
        width: 62%;
        max-width: 100%;
        
        z-index: 2;
    }
}

@media(max-width: 767px) {
    .fine__decor-img--desktop {
        display: none;
    }
    
    .fine__decor-img--mobile {
        display: block;
        
        width: 100%;
    }
    
    .fine__header:after,
    .fine__body:after {
        display: none;
    }
    
    .fine__content--header {
        padding-inline: 1.5rem;
    }
    
    .fine__body {
        display: grid;
    }
    
    .fine__body > .button {
        font-size: var(--text5-size);
    }
    
    .fine__decor {
        position: relative;
        
        top: auto;
        right: auto;
    }
    
    .fine__decor--body {
        order: 2;
    }
    
    .fine__content--body {
        width: 100%;
        
        padding-block: 2rem;
        padding-inline: 1.5rem;
    }
    
    .fine__text--body {
        font-size: var(--text4-size);
    }
}