/*=========================================
GET TIMELY UPDATES
=========================================*/

.gjp-newsletter-card{

    background:linear-gradient(135deg,#f8fbff,#eef5ff);

    border:1px solid #dbeafe;

    border-radius:18px;

    box-shadow:0 8px 24px rgba(15,23,42,.05);

    padding:20px;

    height:auto;

}

/*=========================================
Layout
=========================================*/

.gjp-newsletter-content{

    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:28px;

    height:100%;

}

/*=========================================
Left
=========================================*/

.gjp-newsletter-left{

    flex:1;

    padding-right:10px;

}

.gjp-newsletter-left h2{

    margin:0 0 8px;

    font-size:32px;

    font-weight:700;

    line-height:1.15;

    color:#0f172a;

}

.gjp-newsletter-left p{

    margin:0 0 16px;

    color:#64748b;

    font-size:16px;

    line-height:1.8;

    max-width:320px;

}

/*=========================================
Button
=========================================*/

.gjp-notification-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    background:#2563eb;

    color:#fff;

    padding:14px 26px;

    border-radius:12px;

    font-size:15px;

    font-weight:600;

    transition:.3s;

}

.gjp-notification-btn:hover{

    background:#1d4ed8;

    transform:translateY(-2px);

}

/*=========================================
Right
=========================================*/

.gjp-newsletter-right{

    width:170px;

    display:flex;

    align-items:flex-start;

    justify-content:center;

    padding-top:12px;

    flex-shrink:0;

}

/*=========================================
Notification Icon
=========================================*/

.gjp-notification-image{

    width:110px;

    height:110px;

    object-fit:contain;

}

/*=========================================
Responsive
=========================================*/

@media(max-width:992px){

    .gjp-newsletter-content{

        flex-direction:column;

        text-align:center;

        gap:24px;

    }

    .gjp-newsletter-left{

        padding-right:0;

    }

    .gjp-newsletter-left p{

        max-width:100%;

    }

    .gjp-newsletter-right{

        width:100%;

    }

}

@media(max-width:576px){

    .gjp-newsletter-card{

        padding:20px;

    }

    .gjp-newsletter-left h2{

        font-size:26px;

    }

    .gjp-newsletter-left p{

        font-size:15px;

    }

    .gjp-notification-btn{

        width:100%;

    }

    .gjp-notification-image{

        width:90px;

        height:90px;

    }

}