@font-face {
    font-family: 'Arial';
    src: url('../../fonts/arial/arial-regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Arial';
    src: url('../../fonts/arial/arial-bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

body {
    background: #FAFAFA;
    font-family: 'Arial', sans-serif;
}

:root {
    --primary-transition-config: ease-in 0.2s;
    --primary-color-1000: #FCA952;
    --primary-color-900: #EE780F;
    --primary-text-1000: #313131;
    --primary-text-900: #666666;
    --primary-text-500: #00000050;
    --primary-border-900: #E1E1E1;
    --primary-gradient: linear-gradient(90deg, #F2A244, #FD9223);
    --primary-gradient-hover: linear-gradient(90deg, #F2A244, #F2A244);
    --primary-box-shadow: 0px 4px 16px 0px rgba(207, 207, 252, 0.2);
    --darken-gradient: linear-gradient(0deg, #000000 28%, #666666 100%);
}

.wrap {
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
    max-width: 1440px;
}

.relative {
    position: relative;
}

.section {
    display: flex;
    flex-flow: column;
    row-gap: 48px;
}

.section__title {
    display: flex;
    align-items: center;
    column-gap: 10px;
    font-size: 26px;
    color: var(--primary-text-1000);
    font-weight: bold;
    line-height: 110%;
}

.section__title::before {
    content: '';
    display: block;
    width: 3px;
    height: 32px;
    background: var(--primary-color-900);
}

@media screen and (max-width: 1439px) and (min-width: 1024px) {
    .wrap {
        max-width: 1024px;
    }

    .section {
        row-gap: 40px;
    }
}
@media screen and (max-width: 1023px) and (min-width: 768px) {
    .wrap {
        max-width: 768px;
    }
}
@media screen and (max-width: 768px) {
    .wrap {
        max-width: 100%;
        padding-right: 16px;
        padding-left: 16px;
    }

    .section {
        row-gap: 32px;
    }
    .section__title {
        font-size: 20px;
    }

    .section__title::before {
        height: 24px;
    }
}