/*
==================================================
GovtJobPreparation.com
Latest Articles
Part-1 : Base + Hero + Filters
==================================================
*/


/*================================================
Main Page
================================================*/

.gjp-latest-articles-page{

    min-height:100vh;

    padding:40px 0 70px;

    background:#f8fafc;

}


.gjp-latest-articles-container{

    width:100%;

    max-width:1120px;

    margin:0 auto;

    padding:0 20px;

}


/*================================================
Breadcrumb
================================================*/

.gjp-latest-articles-page
.gjp-breadcrumb{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:9px;

    margin-bottom:28px;

    font-size:13px;

}


.gjp-latest-articles-page
.gjp-breadcrumb a{

    color:#2563eb;

    text-decoration:none;

    font-weight:650;

}


.gjp-latest-articles-page
.gjp-breadcrumb a:hover{

    text-decoration:underline;

}


.gjp-latest-articles-page
.gjp-breadcrumb-separator{

    color:#94a3b8;

    font-size:17px;

}


.gjp-latest-articles-page
.gjp-breadcrumb-current{

    color:#64748b;

    font-weight:550;

}


/*================================================
Premium Hero
================================================*/

.gjp-latest-articles-hero{

    position:relative;

    overflow:hidden;

    margin-bottom:25px;

    padding:42px 45px;

    border:1px solid #dbeafe;

    border-radius:22px;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f8fbff 55%,
            #eff6ff 100%
        );

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

}


.gjp-latest-articles-hero::after{

    content:"";

    position:absolute;

    width:230px;

    height:230px;

    right:-85px;

    top:-105px;

    border-radius:50%;

    background:rgba(37,99,235,.06);

}


.gjp-latest-articles-hero-content{

    position:relative;

    z-index:1;

    max-width:780px;

}


.gjp-latest-articles-hero-badge{

    display:inline-flex;

    align-items:center;

    padding:7px 14px;

    margin-bottom:13px;

    border-radius:30px;

    background:#dbeafe;

    color:#2563eb;

    font-size:11px;

    line-height:1.3;

    font-weight:750;

}


.gjp-latest-articles-hero h1{

    margin:0 0 12px;

    color:#0f172a;

    font-size:36px;

    line-height:1.3;

    font-weight:780;

    letter-spacing:-.4px;

}


.gjp-latest-articles-hero p{

    max-width:720px;

    margin:0;

    color:#64748b;

    font-size:15px;

    line-height:1.8;

}


/*================================================
Filter Section
================================================*/

.gjp-latest-articles-filter-section{

    margin-bottom:32px;

}


.gjp-latest-articles-filter-card{

    display:grid;

    grid-template-columns:
        minmax(220px,1.7fr)
        repeat(3,minmax(150px,1fr))
        auto;

    align-items:end;

    gap:13px;

    padding:19px;

    border:1px solid #e2e8f0;

    border-radius:17px;

    background:#ffffff;

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

}


/*================================================
Filter Labels
================================================*/

.gjp-latest-articles-filter-card label{

    display:block;

    margin:0 0 7px;

    color:#475569;

    font-size:11px;

    line-height:1.4;

    font-weight:750;

}


/*================================================
Search
================================================*/

.gjp-latest-articles-search{

    min-width:0;

}


.gjp-latest-articles-search-box{

    position:relative;

}


.gjp-latest-articles-search-icon{

    position:absolute;

    left:13px;

    top:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    width:18px;

    height:18px;

    color:#94a3b8;

    font-size:20px;

    line-height:1;

    transform:translateY(-50%);

    pointer-events:none;

}


.gjp-latest-articles-search-box input{

    width:100%;

    height:43px;

    padding:0 13px 0 38px;

    border:1px solid #dbe2ea;

    border-radius:10px;

    outline:none;

    background:#ffffff;

    color:#0f172a;

    font-family:inherit;

    font-size:12px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;

}


.gjp-latest-articles-search-box input::placeholder{

    color:#94a3b8;

}


.gjp-latest-articles-search-box input:focus{

    border-color:#93c5fd;

    box-shadow:
        0 0 0 3px rgba(37,99,235,.09);

}


/*================================================
Select Filters
================================================*/

.gjp-latest-articles-filter{

    min-width:0;

}


.gjp-latest-articles-filter select{

    width:100%;

    height:43px;

    padding:0 34px 0 12px;

    border:1px solid #dbe2ea;

    border-radius:10px;

    outline:none;

    background:#ffffff;

    color:#334155;

    font-family:inherit;

    font-size:12px;

    font-weight:600;

    cursor:pointer;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;

}


.gjp-latest-articles-filter select:focus{

    border-color:#93c5fd;

    box-shadow:
        0 0 0 3px rgba(37,99,235,.09);

}


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

.gjp-latest-articles-reset{

    height:43px;

    padding:0 16px;

    border:1px solid #dbe2ea;

    border-radius:10px;

    background:#f8fafc;

    color:#475569;

    font-family:inherit;

    font-size:11px;

    font-weight:750;

    cursor:pointer;

    white-space:nowrap;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease;

}


.gjp-latest-articles-reset:hover{

    border-color:#93c5fd;

    background:#eff6ff;

    color:#2563eb;

    transform:translateY(-1px);

}


.gjp-latest-articles-reset:focus-visible{

    outline:3px solid rgba(37,99,235,.18);

    outline-offset:3px;

}


/*================================================
Articles List Header
================================================*/

.gjp-latest-articles-list-section{

    margin-top:4px;

}


.gjp-latest-articles-list-header{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

    margin-bottom:20px;

}


.gjp-latest-articles-section-heading{

    display:flex;

    align-items:center;

    gap:12px;

}


.gjp-latest-articles-heading-line{

    width:40px;

    height:4px;

    border-radius:10px;

    background:#2563eb;

}


.gjp-latest-articles-section-heading h2{

    margin:0;

    color:#0f172a;

    font-size:25px;

    line-height:1.4;

    font-weight:750;

}


.gjp-latest-articles-result-count{

    color:#64748b;

    font-size:12px;

    line-height:1.4;

    font-weight:650;

}


/*================================================
Tablet
================================================*/

@media (max-width:1000px){

    .gjp-latest-articles-filter-card{

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

    }


    .gjp-latest-articles-search{

        grid-column:1 / -1;

    }


    .gjp-latest-articles-reset{

        width:100%;

    }

}


/*================================================
Mobile
================================================*/

@media (max-width:650px){

    .gjp-latest-articles-page{

        padding:30px 0 55px;

    }


    .gjp-latest-articles-container{

        padding:0 15px;

    }


    .gjp-latest-articles-hero{

        padding:30px 23px;

        border-radius:18px;

    }


    .gjp-latest-articles-hero h1{

        font-size:29px;

    }


    .gjp-latest-articles-hero p{

        font-size:14px;

    }


    .gjp-latest-articles-filter-card{

        grid-template-columns:1fr;

        gap:12px;

        padding:16px;

        border-radius:15px;

    }


    .gjp-latest-articles-search{

        grid-column:auto;

    }


    .gjp-latest-articles-list-header{

        align-items:flex-start;

        flex-direction:column;

        gap:8px;

    }


    .gjp-latest-articles-section-heading h2{

        font-size:23px;

    }

}


/*================================================
Small Mobile
================================================*/

@media (max-width:400px){

    .gjp-latest-articles-hero{

        padding:27px 19px;

    }


    .gjp-latest-articles-hero h1{

        font-size:26px;

    }


    .gjp-latest-articles-filter-card{

        padding:14px;

    }

}
/*
==================================================
GovtJobPreparation.com
Latest Articles
Part-2 : Article Cards
==================================================
*/


/*================================================
Articles Grid
================================================*/

.gjp-latest-articles-grid{

    display:grid;

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

    gap:20px;

    align-items:stretch;

}


/*================================================
Article Card
================================================*/

.gjp-latest-article-card{

    display:flex;

    flex-direction:column;

    min-width:0;

    overflow:hidden;

    border:1px solid #e2e8f0;

    border-radius:20px;

    background:#ffffff;

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

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;

}


.gjp-latest-article-card:hover{

    transform:translateY(-4px);

    border-color:#bfdbfe;

    box-shadow:
        0 15px 34px rgba(15,23,42,.09);

}


/*================================================
Article Image Link
================================================*/

.gjp-latest-article-image-link{

    display:block;

    overflow:hidden;

    text-decoration:none;

}


/*================================================
Article Image
================================================*/

.gjp-latest-article-image{

    position:relative;

    width:100%;

    aspect-ratio:16 / 8.8;

    overflow:hidden;

    background:#eef4fb;

}


.gjp-latest-article-image-placeholder{

    width:100%;

    height:100%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:
        linear-gradient(
            135deg,
            #eff6ff,
            #f8fafc
        );

    color:#94a3b8;

    font-size:12px;

    font-weight:700;

    transition:
        transform .35s ease;

}


.gjp-latest-article-card:hover
.gjp-latest-article-image-placeholder{

    transform:scale(1.03);

}


/*================================================
When Real Image Is Added
================================================*/

.gjp-latest-article-image img{

    display:block;

    width:100%;

    height:100%;

    object-fit:cover;

    transition:
        transform .35s ease;

}


.gjp-latest-article-card:hover
.gjp-latest-article-image img{

    transform:scale(1.04);

}


/*================================================
Article Content
================================================*/

.gjp-latest-article-content{

    display:flex;

    flex:1;

    flex-direction:column;

    padding:20px 21px 18px;

}


/*================================================
Meta Row
================================================*/

.gjp-latest-article-meta-top{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:7px;

    margin-bottom:12px;

}


/*================================================
Exam Badge
================================================*/

.gjp-latest-article-exam{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:6px 10px;

    border-radius:20px;

    background:#eff6ff;

    color:#2563eb;

    font-size:9px;

    line-height:1.3;

    font-weight:800;

    white-space:nowrap;

}


/*================================================
Article Type Badge
================================================*/

.gjp-latest-article-type{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:6px 10px;

    border-radius:20px;

    background:#f1f5f9;

    color:#64748b;

    font-size:9px;

    line-height:1.3;

    font-weight:750;

    white-space:nowrap;

}


/*================================================
Article Title
================================================*/

.gjp-latest-article-content h3{

    margin:0 0 8px;

    color:#0f172a;

    font-size:20px;

    line-height:1.45;

    font-weight:780;

    letter-spacing:-.15px;

}


.gjp-latest-article-content h3 a{

    color:inherit;

    text-decoration:none;

}


.gjp-latest-article-content h3 a:hover{

    color:#2563eb;

}


/*================================================
Article Description
================================================*/

.gjp-latest-article-content p{

    margin:0;

    color:#64748b;

    font-size:13px;

    line-height:1.75;

}


/*================================================
Article Bottom
================================================*/

.gjp-latest-article-bottom{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:15px;

    margin-top:auto;

    padding-top:18px;

}


/*================================================
Article Date
================================================*/

.gjp-latest-article-date{

    color:#94a3b8;

    font-size:10px;

    line-height:1.4;

    font-weight:650;

    white-space:nowrap;

}


/*================================================
Read Article
================================================*/

.gjp-read-article{

    display:inline-flex;

    align-items:center;

    gap:6px;

    color:#2563eb;

    font-size:11px;

    line-height:1.4;

    font-weight:750;

    text-decoration:none;

    white-space:nowrap;

    transition:
        color .2s ease,
        gap .2s ease;

}


.gjp-read-article span{

    font-size:14px;

    line-height:1;

}


.gjp-read-article:hover{

    color:#1d4ed8;

    gap:9px;

}


/*================================================
Card Focus Accessibility
================================================*/

.gjp-latest-article-card
a:focus-visible{

    outline:3px solid rgba(37,99,235,.18);

    outline-offset:-3px;

}


/*================================================
No Results
================================================*/

.gjp-latest-articles-no-results{

    margin-top:20px;

    padding:55px 25px;

    text-align:center;

    border:1px solid #e2e8f0;

    border-radius:18px;

    background:#ffffff;

    box-shadow:
        0 6px 20px rgba(15,23,42,.035);

}


.gjp-latest-articles-no-results-icon{

    width:54px;

    height:54px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0 auto 15px;

    border-radius:14px;

    background:#f1f5f9;

    font-size:20px;

}


.gjp-latest-articles-no-results h3{

    margin:0 0 7px;

    color:#0f172a;

    font-size:19px;

    line-height:1.4;

    font-weight:750;

}


.gjp-latest-articles-no-results p{

    margin:0;

    color:#64748b;

    font-size:13px;

    line-height:1.7;

}


/*================================================
Tablet
================================================*/

@media (max-width:800px){

    .gjp-latest-articles-grid{

        grid-template-columns:1fr;

        gap:16px;

    }


    .gjp-latest-article-card{

        border-radius:18px;

    }


    .gjp-latest-article-image{

        aspect-ratio:16 / 8;

    }

}


/*================================================
Mobile
================================================*/

@media (max-width:600px){

    .gjp-latest-article-content{

        padding:18px;

    }


    .gjp-latest-article-content h3{

        font-size:18px;

    }


    .gjp-latest-article-content p{

        font-size:12.5px;

    }


    .gjp-latest-article-bottom{

        padding-top:16px;

    }

}


/*================================================
Small Mobile
================================================*/

@media (max-width:400px){

    .gjp-latest-article-card{

        border-radius:16px;

    }


    .gjp-latest-article-image{

        aspect-ratio:16 / 9;

    }


    .gjp-latest-article-content{

        padding:16px;

    }


    .gjp-latest-article-meta-top{

        gap:5px;

    }


    .gjp-latest-article-exam,
    .gjp-latest-article-type{

        padding:5px 8px;

        font-size:8.5px;

    }


    .gjp-latest-article-content h3{

        font-size:17px;

        line-height:1.5;

    }


    .gjp-latest-article-content p{

        font-size:12px;

        line-height:1.7;

    }


    .gjp-latest-article-bottom{

        align-items:flex-start;

        flex-direction:column;

        gap:9px;

    }

}
/*
==================================================
GovtJobPreparation.com
Latest Articles
Part-3 : Pagination + Information
==================================================
*/


/*================================================
Pagination Wrapper
================================================*/

.gjp-latest-articles-pagination{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    margin-top:32px;

    padding:5px 0;

}


/*================================================
Pagination Pages
================================================*/

.gjp-article-pagination-pages{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:6px;

}


/*================================================
Pagination Buttons
================================================*/

.gjp-article-pagination-btn,
.gjp-article-pagination-page{

    min-width:40px;

    height:40px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:0 11px;

    border:1px solid #dbe2ea;

    border-radius:8px;

    background:#ffffff;

    color:#475569;

    font-family:inherit;

    font-size:12px;

    line-height:1;

    font-weight:700;

    cursor:pointer;

    text-decoration:none;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;

}


.gjp-article-pagination-btn:hover:not(:disabled),
.gjp-article-pagination-page:hover{

    border-color:#93c5fd;

    background:#eff6ff;

    color:#2563eb;

    transform:translateY(-1px);

}


/*================================================
Active Page
================================================*/

.gjp-article-pagination-page.active{

    border-color:#2563eb;

    background:#2563eb;

    color:#ffffff;

    box-shadow:
        0 5px 14px rgba(37,99,235,.16);

}


.gjp-article-pagination-page.active:hover{

    border-color:#1d4ed8;

    background:#1d4ed8;

    color:#ffffff;

    transform:none;

}


/*================================================
Disabled
================================================*/

.gjp-article-pagination-btn:disabled{

    opacity:.45;

    background:#f8fafc;

    color:#94a3b8;

    cursor:not-allowed;

    transform:none;

    box-shadow:none;

}


/*================================================
Pagination Ellipsis
================================================*/

.gjp-article-pagination-ellipsis{

    min-width:30px;

    height:40px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    color:#94a3b8;

    font-size:13px;

    font-weight:700;

}


/*================================================
Focus Accessibility
================================================*/

.gjp-latest-articles-page
button:focus-visible,
.gjp-latest-articles-page
a:focus-visible{

    outline:3px solid rgba(37,99,235,.18);

    outline-offset:3px;

}


/*================================================
Articles Information Section
================================================*/

.gjp-latest-articles-info{

    display:flex;

    align-items:flex-start;

    gap:15px;

    margin-top:35px;

    padding:20px 22px;

    border:1px solid #dbeafe;

    border-radius:15px;

    background:#f8fbff;

    box-shadow:
        0 5px 18px rgba(15,23,42,.025);

}


.gjp-latest-articles-info-icon{

    width:38px;

    height:38px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    border-radius:10px;

    background:#dbeafe;

    color:#2563eb;

    font-size:16px;

    font-weight:800;

}


.gjp-latest-articles-info-content{

    min-width:0;

}


.gjp-latest-articles-info-content h3{

    margin:0 0 5px;

    color:#334155;

    font-size:14px;

    line-height:1.5;

    font-weight:750;

}


.gjp-latest-articles-info-content p{

    margin:0;

    color:#64748b;

    font-size:12px;

    line-height:1.7;

}


/*================================================
Hidden Utility
================================================*/

.gjp-latest-articles-page
.is-hidden{

    display:none !important;

}


/*================================================
Filter Active State
================================================*/

.gjp-latest-articles-filter
select.gjp-filter-active,
.gjp-latest-articles-search-box
input.gjp-filter-active{

    border-color:#93c5fd;

    background:#f8fbff;

}


/*================================================
Loading State
================================================*/

.gjp-latest-articles-card-loading{

    opacity:.6;

    pointer-events:none;

}


/*================================================
Tablet
================================================*/

@media (max-width:700px){

    .gjp-latest-articles-pagination{

        gap:5px;

    }


    .gjp-article-pagination-pages{

        gap:4px;

    }


    .gjp-article-pagination-btn,
    .gjp-article-pagination-page{

        min-width:38px;

        height:38px;

        padding:0 9px;

        font-size:11px;

    }


    .gjp-latest-articles-info{

        margin-top:28px;

    }

}


/*================================================
Mobile
================================================*/

@media (max-width:500px){

    .gjp-latest-articles-pagination{

        flex-wrap:wrap;

        gap:7px;

    }


    .gjp-article-pagination-pages{

        order:1;

        width:100%;

    }


    .gjp-article-pagination-btn{

        flex:1;

        min-width:0;

    }


    .gjp-latest-articles-info{

        gap:12px;

        margin-top:25px;

        padding:17px;

        border-radius:13px;

    }


    .gjp-latest-articles-info-icon{

        width:35px;

        height:35px;

    }


    .gjp-latest-articles-info-content h3{

        font-size:13px;

    }


    .gjp-latest-articles-info-content p{

        font-size:11.5px;

        line-height:1.65;

    }

}


/*================================================
Small Mobile
================================================*/

@media (max-width:400px){

    .gjp-latest-articles-pagination{

        gap:5px;

    }


    .gjp-article-pagination-pages{

        gap:3px;

    }


    .gjp-article-pagination-btn,
    .gjp-article-pagination-page{

        min-width:34px;

        height:36px;

        padding:0 7px;

        font-size:10px;

    }


    .gjp-article-pagination-ellipsis{

        min-width:20px;

    }


    .gjp-latest-articles-info{

        align-items:flex-start;

        padding:15px;

    }


    .gjp-latest-articles-info-icon{

        width:32px;

        height:32px;

        border-radius:8px;

        font-size:14px;

    }

}


/*================================================
Reduced Motion
================================================*/

@media (prefers-reduced-motion:reduce){

    .gjp-latest-articles-page *,
    .gjp-latest-articles-page *::before,
    .gjp-latest-articles-page *::after{

        animation:none !important;

        transition:none !important;

    }

}
/*
==================================================
GovtJobPreparation.com
Latest Articles
Part-4 : Final Cleanup + Responsive Refinements
==================================================
*/


/*================================================
Grid Height Consistency
================================================*/

.gjp-latest-articles-grid{

    align-items:stretch;

}


.gjp-latest-article-card{

    height:100%;

}


/*================================================
Text Overflow Protection
================================================*/

.gjp-latest-article-card h3,
.gjp-latest-article-card p{

    overflow-wrap:anywhere;

}


/*================================================
Interactive Elements
================================================*/

.gjp-latest-articles-page
button{

    font-family:inherit;

}


.gjp-latest-articles-page
button:disabled{

    cursor:not-allowed;

}


/*================================================
Article Card Stability
================================================*/

.gjp-latest-article-card{

    backface-visibility:hidden;

    -webkit-font-smoothing:antialiased;

}


/*================================================
Image Stability
================================================*/

.gjp-latest-article-image{

    isolation:isolate;

}


.gjp-latest-article-image-placeholder{

    user-select:none;

}


/*================================================
Filter Card Stability
================================================*/

.gjp-latest-articles-filter-card{

    box-sizing:border-box;

}


.gjp-latest-articles-filter-card *,
.gjp-latest-articles-filter-card
*::before,
.gjp-latest-articles-filter-card
*::after{

    box-sizing:border-box;

}


/*================================================
Search Input Cleanup
================================================*/

.gjp-latest-articles-search-box input{

    appearance:none;

    -webkit-appearance:none;

}


.gjp-latest-articles-search-box input::-webkit-search-cancel-button{

    cursor:pointer;

}


/*================================================
Select Cleanup
================================================*/

.gjp-latest-articles-filter select{

    appearance:auto;

    -webkit-appearance:auto;

}


/*================================================
Pagination Stability
================================================*/

.gjp-latest-articles-pagination{

    min-height:42px;

}


.gjp-article-pagination-pages{

    min-height:40px;

}


/*================================================
No Results Centering
================================================*/

.gjp-latest-articles-no-results{

    box-sizing:border-box;

}


/*================================================
Large Desktop
================================================*/

@media (min-width:1200px){

    .gjp-latest-articles-container{

        max-width:1160px;

    }


    .gjp-latest-articles-grid{

        gap:22px;

    }


    .gjp-latest-article-card{

        border-radius:21px;

    }


    .gjp-latest-article-content{

        padding:21px 22px 19px;

    }

}


/*================================================
Desktop Refinement
================================================*/

@media (min-width:1001px){

    .gjp-latest-articles-filter-card{

        grid-template-columns:
            minmax(240px,1.7fr)
            repeat(3,minmax(145px,1fr))
            auto;

    }


    .gjp-latest-article-image{

        aspect-ratio:16 / 8.7;

    }

}


/*================================================
Tablet
================================================*/

@media (max-width:1000px){

    .gjp-latest-articles-container{

        padding-left:18px;

        padding-right:18px;

    }


    .gjp-latest-article-content h3{

        font-size:19px;

    }

}


/*================================================
Tablet Small
================================================*/

@media (max-width:800px){

    .gjp-latest-articles-grid{

        grid-template-columns:1fr;

    }


    .gjp-latest-article-card{

        max-width:100%;

    }


    .gjp-latest-article-image{

        aspect-ratio:16 / 8.5;

    }

}


/*================================================
Mobile
================================================*/

@media (max-width:650px){

    .gjp-latest-articles-page{

        padding-top:30px;

        padding-bottom:55px;

    }


    .gjp-latest-articles-container{

        padding-left:15px;

        padding-right:15px;

    }


    .gjp-latest-articles-hero{

        border-radius:18px;

    }


    .gjp-latest-articles-filter-card{

        border-radius:15px;

    }


    .gjp-latest-article-card{

        border-radius:17px;

    }


    .gjp-latest-articles-pagination{

        margin-top:26px;

    }

}


/*================================================
Small Mobile
================================================*/

@media (max-width:400px){

    .gjp-latest-articles-container{

        padding-left:13px;

        padding-right:13px;

    }


    .gjp-latest-article-card{

        border-radius:15px;

    }


    .gjp-latest-article-image{

        aspect-ratio:16 / 9;

    }


    .gjp-latest-article-content{

        padding:16px;

    }


    .gjp-latest-article-content h3{

        font-size:17px;

    }


    .gjp-latest-article-content p{

        font-size:12px;

    }


    .gjp-latest-articles-info{

        padding:15px;

    }

}


/*================================================
Touch Devices
================================================*/

@media (hover:none){

    .gjp-latest-article-card:hover{

        transform:none;

        border-color:#e2e8f0;

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

    }


    .gjp-latest-article-card:hover
    .gjp-latest-article-image img{

        transform:none;

    }


    .gjp-latest-article-card:hover
    .gjp-latest-article-image-placeholder{

        transform:none;

    }


    .gjp-read-article:hover{

        gap:6px;

    }

}


/*================================================
Reduced Motion
================================================*/

@media (prefers-reduced-motion:reduce){

    .gjp-latest-articles-page *,
    .gjp-latest-articles-page *::before,
    .gjp-latest-articles-page *::after{

        scroll-behavior:auto !important;

        animation:none !important;

        transition:none !important;

    }

}