/*=========================================================
            TERMS & CONDITIONS
            INTRODUCTION SECTION
            PREMIUM CSS
=========================================================*/

:root{

    --primary-mg:#b83330;
    --primary-light-mg:#fcf3f2;
    --title-mg:#101828;
    --text-mg:#667085;
    --border-mg:#e9edf3;
    --card-mg:#ffffff;
    --shadow-mg:0 15px 45px rgba(15,23,42,.06);
    --shadow-hover-mg:0 25px 60px rgba(15,23,42,.10);
    --radius-mg:18px;

}



/*=========================================
        SECTION
=========================================*/

.terms-section-mg{

    position:relative;

    width:100%;

    padding:5rem 0;

    background:#ffffff;

}



/*=========================================
        MAIN CARD
=========================================*/

.terms-card-mg{

    position:relative;

    background:var(--card-mg);

    border:1px solid var(--border-mg);

    border-radius:var(--radius-mg);

    padding:3rem;

    overflow:hidden;

    box-shadow:var(--shadow-mg);

    transition:.4s;

}

.terms-card-mg:hover{

    transform:translateY(-6px);

    box-shadow:var(--shadow-hover-mg);

}



/*=========================================
        TOP ACCENT
=========================================*/

.terms-card-mg::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:linear-gradient(90deg,#b83330,#dd817f);

}



/*=========================================
        LABEL
=========================================*/

.terms-label-mg{

    display:inline-flex;

    align-items:center;

    gap:.8rem;

    padding:.75rem 1.3rem;

    background:var(--primary-light-mg);

    border-radius:50px;

    margin-bottom:1.8rem;

}

.terms-label-mg i{

    color:var(--primary-mg);

    font-size:1rem;

}

.terms-label-mg span{

    font-size:.82rem;

    font-weight:700;

    color:var(--primary-mg);

    letter-spacing:1px;

    text-transform:uppercase;

}



/*=========================================
        TITLE
=========================================*/

.terms-title-mg{

    font-size:2.7rem;

    font-weight:800;

    color:var(--title-mg);

    line-height:1.2;

    margin-bottom:1rem;

    position:relative;

}



/*=========================================
        DIVIDER
=========================================*/

.terms-divider-mg{

    width:90px;

    height:4px;

    border-radius:20px;

    background:linear-gradient(90deg,#b83330,#dd817f);

    margin-bottom:2rem;

}



/*=========================================
        CONTENT
=========================================*/

.terms-content-mg{

    display:flex;

    flex-direction:column;

    gap:1.4rem;

}

.terms-content-mg p{

    font-size:1rem;

    color:var(--text-mg);

    line-height:2;

}

.terms-content-mg strong{

    color:var(--title-mg);

    font-weight:700;

}



/*=========================================
        INFO BOX
=========================================*/

.terms-info-box-mg{

    display:flex;

    gap:1.4rem;

    margin-top:2.5rem;

    padding:1.8rem;

    background:#f8fbff;

    border:1px solid #dbeafe;

    border-radius:16px;

    transition:.35s;

}

.terms-info-box-mg:hover{

    border-color:var(--primary-mg);

}



/*=========================================
        INFO ICON
=========================================*/

.terms-info-icon-mg{

    width:58px;

    height:58px;

    flex-shrink:0;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    background:var(--primary-light-mg);

}

.terms-info-icon-mg i{

    font-size:1.4rem;

    color:var(--primary-mg);

}



/*=========================================
        INFO CONTENT
=========================================*/

.terms-info-content-mg h4{

    font-size:1.25rem;

    color:var(--title-mg);

    margin-bottom:.7rem;

}

.terms-info-content-mg p{

    color:var(--text-mg);

    line-height:1.9;

}



/*=========================================
        HIGHLIGHT GRID
=========================================*/

.terms-highlight-wrapper-mg{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:1.5rem;

    margin-top:3rem;

}



/*=========================================
        CARD
=========================================*/

.terms-highlight-card-mg{

    background:#fff;

    border:1px solid var(--border-mg);

    border-radius:16px;

    padding:2rem 1.6rem;

    transition:.35s;

    text-align:center;

}

.terms-highlight-card-mg:hover{

    transform:translateY(-8px);

    border-color:var(--primary-mg);

    box-shadow:0 18px 45px rgba(184,51,48,.10);

}



/*=========================================
        ICON
=========================================*/

.terms-highlight-card-mg i{

    width:68px;

    height:68px;

    margin:auto;

    margin-bottom:1.2rem;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:var(--primary-light-mg);

    color:var(--primary-mg);

    font-size:1.5rem;

    transition:.35s;

}

.terms-highlight-card-mg:hover i{

    background:var(--primary-mg);

    color:#fff;

}



/*=========================================
        TEXT
=========================================*/

.terms-highlight-card-mg h5{

    font-size:1.15rem;

    color:var(--title-mg);

    margin-bottom:.8rem;

}

.terms-highlight-card-mg p{

    font-size:.95rem;

    color:var(--text-mg);

    line-height:1.8;

}



/*=========================================
        RESPONSIVE
=========================================*/

@media(max-width:992px){

    .terms-card-mg{

        padding:2.3rem;

    }

    .terms-title-mg{

        font-size:2.2rem;

    }

    .terms-highlight-wrapper-mg{

        grid-template-columns:1fr;

    }

}



@media(max-width:768px){

    .terms-section-mg{

        padding:4rem 0;

    }

    .terms-card-mg{

        padding:2rem;

        border-radius:14px;

    }

    .terms-title-mg{

        font-size:2rem;

    }

    .terms-info-box-mg{

        flex-direction:column;

    }

}



@media(max-width:576px){

    .terms-card-mg{

        padding:1.5rem;

    }

    .terms-title-mg{

        font-size:1.75rem;

    }

    .terms-content-mg p{

        font-size:.95rem;

        line-height:1.9;

    }

    .terms-highlight-card-mg{

        padding:1.5rem;

    }

}










/*=========================================================
            TERMS & CONDITIONS
            ACCEPTANCE OF TERMS
            PREMIUM CSS
=========================================================*/


/*=========================================
        WARNING BOX
=========================================*/

.terms-warning-box-mg{

    display:flex;

    align-items:flex-start;

    gap:1.4rem;

    margin-top:2.5rem;

    padding:1.8rem;

    background:#fffaf3;

    border:1px solid #ffe4b8;

    border-left:5px solid #ffb100;

    border-radius:16px;

    transition:.35s;

}

.terms-warning-box-mg:hover{

    transform:translateY(-3px);

    box-shadow:0 15px 35px rgba(255,177,0,.12);

}



/*=========================================
        WARNING ICON
=========================================*/

.terms-warning-icon-mg{

    width:58px;

    height:58px;

    flex-shrink:0;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#fff2d8;

}

.terms-warning-icon-mg i{

    color:#ff9f00;

    font-size:1.4rem;

}



/*=========================================
        WARNING CONTENT
=========================================*/

.terms-warning-content-mg{

    flex:1;

}

.terms-warning-content-mg h4{

    font-size:1.2rem;

    font-weight:700;

    color:#101828;

    margin-bottom:.7rem;

}

.terms-warning-content-mg p{

    color:#667085;

    font-size:1rem;

    line-height:1.9;

}



/*=========================================
        LIST BOX
=========================================*/

.terms-list-box-mg{

    margin-top:2.8rem;

    padding:2rem;

    background:#ffffff;

    border:1px solid #e9edf3;

    border-radius:16px;

    transition:.35s;

}

.terms-list-box-mg:hover{

    border-color:#b83330;

    box-shadow:0 18px 40px rgba(184,51,48,.08);

}



/*=========================================
        LIST TITLE
=========================================*/

.terms-list-box-mg h3{

    font-size:1.35rem;

    color:#101828;

    font-weight:700;

    margin-bottom:1.4rem;

}



/*=========================================
        LIST
=========================================*/

.terms-list-box-mg ul{

    margin:0;

    padding:0;

    list-style:none;

}



/*=========================================
        LIST ITEM
=========================================*/

.terms-list-box-mg li{

    position:relative;

    padding-left:2rem;

    margin-bottom:1.1rem;

    color:#667085;

    font-size:1rem;

    line-height:1.9;

}

.terms-list-box-mg li:last-child{

    margin-bottom:0;

}



/*=========================================
        CUSTOM BULLET
=========================================*/

.terms-list-box-mg li::before{

    content:"";

    position:absolute;

    left:0;

    top:.7rem;

    width:10px;

    height:10px;

    border-radius:50%;

    background:#b83330;

    box-shadow:0 0 0 6px rgba(184,51,48,.10);

}



/*=========================================
        NOTE BOX
=========================================*/

.terms-note-box-mg{

    display:flex;

    align-items:flex-start;

    gap:1rem;

    margin-top:2.5rem;

    padding:1.5rem 1.8rem;

    background:#f6fbff;

    border:1px solid #d7ebff;

    border-radius:16px;

    transition:.35s;

}

.terms-note-box-mg:hover{

    border-color:#4da3ff;

    box-shadow:0 15px 35px rgba(77,163,255,.10);

}



/*=========================================
        NOTE ICON
=========================================*/

.terms-note-box-mg i{

    width:46px;

    height:46px;

    flex-shrink:0;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#eaf5ff;

    color:#2f80ed;

    font-size:1.2rem;

}



/*=========================================
        NOTE TEXT
=========================================*/

.terms-note-box-mg p{

    margin:0;

    color:#667085;

    font-size:1rem;

    line-height:1.9;

}



/*=========================================
        RESPONSIVE
=========================================*/

@media(max-width:992px){

    .terms-warning-box-mg,

    .terms-list-box-mg,

    .terms-note-box-mg{

        padding:1.6rem;

    }

}



@media(max-width:768px){

    .terms-warning-box-mg,

    .terms-note-box-mg{

        flex-direction:column;

        gap:1rem;

    }

    .terms-list-box-mg{

        padding:1.5rem;

    }

    .terms-list-box-mg h3{

        font-size:1.2rem;

    }

}



@media(max-width:576px){

    .terms-warning-box-mg,

    .terms-list-box-mg,

    .terms-note-box-mg{

        padding:1.3rem;

        border-radius:14px;

    }

    .terms-warning-content-mg h4{

        font-size:1.05rem;

    }

    .terms-list-box-mg li{

        font-size:.95rem;

        padding-left:1.8rem;

    }

    .terms-note-box-mg p{

        font-size:.95rem;

    }

}



@media(max-width:420px){

    .terms-warning-icon-mg{

        width:50px;

        height:50px;

    }

    .terms-warning-icon-mg i{

        font-size:1.2rem;

    }

    .terms-note-box-mg i{

        width:42px;

        height:42px;

        font-size:1rem;

    }

}




/*=========================================================
            TERMS & CONDITIONS
            DEFINITIONS
            PREMIUM CSS
=========================================================*/


/*=========================================
        DEFINITIONS GRID
=========================================*/

.terms-definition-grid-mg{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:1.5rem;

    margin-top:2.8rem;

}



/*=========================================
        DEFINITION CARD
=========================================*/

.terms-definition-card-mg{

    position:relative;

    display:flex;

    align-items:flex-start;

    gap:1.3rem;

    padding:1.8rem;

    background:rgba(255,255,255,.88);

    border:1px solid #e9edf3;

    border-radius:18px;

    overflow:hidden;

    transition:.35s;

    backdrop-filter:blur(12px);

}

.terms-definition-card-mg:hover{

    transform:translateY(-6px);

    border-color:#b83330;

    box-shadow:0 20px 45px rgba(184,51,48,.10);

}



/*=========================================
        TOP ACCENT
=========================================*/

.terms-definition-card-mg::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:3px;

    background:linear-gradient(90deg,#b83330,#dd817f);

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.terms-definition-card-mg:hover::before{

    transform:scaleX(1);

}



/*=========================================
        ICON
=========================================*/

.definition-icon-mg{

    width:62px;

    height:62px;

    flex-shrink:0;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:16px;

    background:#fcf3f2;

    transition:.35s;

}

.definition-icon-mg i{

    color:#b83330;

    font-size:1.4rem;

    transition:.35s;

}

.terms-definition-card-mg:hover .definition-icon-mg{

    background:#b83330;

}

.terms-definition-card-mg:hover .definition-icon-mg i{

    color:#ffffff;

}



/*=========================================
        CONTENT
=========================================*/

.definition-content-mg{

    flex:1;

}

.definition-content-mg h4{

    font-size:1.18rem;

    font-weight:700;

    color:#101828;

    margin-bottom:.7rem;

    transition:.35s;

}

.terms-definition-card-mg:hover .definition-content-mg h4{

    color:#b83330;

}

.definition-content-mg p{

    font-size:.96rem;

    color:#667085;

    line-height:1.9;

}



/*=========================================
        RESPONSIVE
=========================================*/

@media(max-width:992px){

    .terms-definition-grid-mg{

        grid-template-columns:1fr;

    }

}



@media(max-width:768px){

    .terms-definition-card-mg{

        padding:1.5rem;

        border-radius:16px;

    }

    .definition-icon-mg{

        width:56px;

        height:56px;

        border-radius:14px;

    }

    .definition-icon-mg i{

        font-size:1.25rem;

    }

    .definition-content-mg h4{

        font-size:1.08rem;

    }

    .definition-content-mg p{

        font-size:.94rem;

    }

}



@media(max-width:576px){

    .terms-definition-card-mg{

        flex-direction:column;

        gap:1rem;

        padding:1.3rem;

    }

    .definition-icon-mg{

        width:52px;

        height:52px;

        border-radius:12px;

    }

    .definition-content-mg h4{

        font-size:1rem;

    }

    .definition-content-mg p{

        font-size:.92rem;

        line-height:1.8;

    }

}



@media(max-width:420px){

    .terms-definition-grid-mg{

        gap:1rem;

    }

    .terms-definition-card-mg{

        padding:1.15rem;

    }

    .definition-icon-mg{

        width:48px;

        height:48px;

    }

    .definition-icon-mg i{

        font-size:1.1rem;

    }

    .definition-content-mg h4{

        font-size:.98rem;

    }

    .definition-content-mg p{

        font-size:.88rem;

    }

}