@font-face {
    font-family: "Montserrat";
    src: url('/assets/fonts/Montserrat-VariableFont_wght.ttf'),
        url('/assets/fonts/Montserrat-Italic-VariableFont_wght.ttf');
}

/*lower*/
@media (max-width: 960px) {
    .custom-title {
        font-size: 24px;
    }

    .custom-header-primary {
        font-size: 16px;
    }

    .custom-header-secondary {
        font-size: 16px;
    }

    .custom-text-center {
        text-align: center;
    }

    .mx-big {
        margin-left: 1rem;
        margin-right: 1rem;
    }

    .custom-shadow-box-primary {
        height: 10rem;
    }

    .custom-shadow-box-secondary {
        height: 22rem;
    }

    .p-big {
        padding: 3rem;
    }

    .separator {
        margin-bottom: 8rem;
    }
}

/*higuer*/
@media (min-width: 960px) {
    .custom-title {
        font-size: 30px;
    }

    .custom-header-primary {
        font-size: 18px;
    }

    .custom-header-secondary {
        font-size: 18px;
    }

    .custom-text-center {
        text-align: start;
    }

    .mx-big {
        margin-left: 5rem;
        margin-right: 5rem;
    }

    .custom-shadow-box-primary {
        height: 14rem;
    }

    .custom-shadow-box-secondary {
        height: 29rem;
    }

    .p-big {
        padding: 5rem;
    }

    .separator {
        margin-bottom: 12rem;
    }
}

.custom-shadow-box-primary {
    box-shadow: 5px 15px 30px -5px rgba(100, 100, 100, 0.5);
    border-radius: 0.8rem;
    background-color: white;
    max-width: 370px;
    padding: 1rem;
}

.custom-shadow-box-secondary {
    box-shadow: 5px 15px 30px -5px rgba(100, 100, 100, 0.5);
    border-radius: 0.8rem;
    background-color: white;
    max-width: 370px;
    padding: 1rem;
}

.custom-title {
    color: #ff6c08;
    font-weight: 700;
}

.custom-header-primary {
    color: #7A7A7A;
    font-weight: 400;
}

.custom-header-secondary {
    color: white;
    font-weight: 400;
}

.text-button-primary {
    font-weight: 700;
    font-size: 1.05rem;
    color: #ff6c08
}

.text-button-primary:hover {
    border-style: solid;
    border-bottom-color: #7a6a6a;
    border-radius: 0;
}

.text-button-secondary {
    font-weight: 600;
    font-size: 1.2rem;
    color: white
}

.text-button-secondary:hover {
    color: lightgray;
}

.primary-button {
    border-radius: 0.25rem;
    padding-left: 2rem;
    padding-right: 2rem;
    height: 40px;
    font-weight: 600;
    font-size: 17px;
    background-color: #ff6c08;
    color: white;
    transition: 10ms;
}

.primary-button:hover {
    background-color: #ff6c08;
    color: white;
    transform: scale(1.03);
}


.secondary-button {
    border-radius: 0.25rem;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    font-weight: 600;
    font-size: 17px;
    background-color: white;
    color: #ff6c08;
    transition: 10ms;
}

.secondary-button:hover {
    background-color: white;
    color: #ff6c08;
    transform: scale(1.03);
}