

:root{
    --theme-color:#EC4346;
    --title-font: "Bai Jamjuree", sans-serif;
    --regular-font: "Lato", sans-serif;
}

.custom-container{
    width: min(1400px, 100%);
    padding-inline: 15px;
    margin-inline: auto;
}

.section-title{
    font-family: var(--title-font);
    font-size: clamp(1.125rem, 1.0556rem + 0.3704vw, 1.5rem);
    color: var(--theme-color);
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
    padding-bottom: 20px;
    margin: 0;
}

.section-semi-title{
    font-family: var(--title-font);
    font-size: clamp(1.25rem, 0.9259rem + 1.7284vw, 3rem);
    color: #000;
    font-weight: 600;
    line-height: 1.1;
    text-transform: capitalize;
    padding-bottom: 15px;
    margin: 0;
}

.primery-btn{
    font-family: var(--regular-font);
    color: #FFFFFF;
    text-decoration: none;
    font-size: 1.1;
    font-size: clamp(1.125rem, 1.0324rem + 0.4938vw, 1.625rem);
    font-weight: 500;
    text-transform: capitalize;
    border-radius: 50px;
    width: fit-content;
    background-color: var(--theme-color);
    padding: 14px 40px;
    margin: 0;
        cursor: pointer;
    position: relative;
    transition: transform 0.2s ease, box-shadow 0.3s ease;
}

.primery-btn:hover {
    color: #fff;
    background-color: #2e2e2e;
    transform: perspective(400px) rotateX(10deg) rotateY(-10deg) scale(1.05);
    box-shadow: 0 10px 20px rgba(236, 67, 70, 0.4),
                0 6px 6px rgba(236, 67, 70, 0.2);
}

/* intrested btn */

.btn-interseted{
    font-family: var(--regular-font);
    color: #FFFFFF;
    text-decoration: none;
    font-size: 1.1;
    font-size: clamp(1.125rem, 1.0324rem + 0.4938vw, 1.625rem);
    font-weight: 500;
    text-transform: capitalize;
    border-radius: 50px;
    width: fit-content;
    background-color: #064eb9;
    padding: 14px 40px;
    margin: 0;
        cursor: pointer;
    position: relative;
    transition: transform 0.2s ease, box-shadow 0.3s ease;
}

.btn-interseted:hover {
    color: #fff;
    background-color: #043c91;
    transform: perspective(400px) rotateX(10deg) rotateY(-10deg) scale(1.05);
    box-shadow: 0 10px 20px rgba(44, 76, 255, 0.4),
                0 6px 6px rgba(44, 47, 255, 0.2);
}