/*
=========================================
Newsfeed - Corporate Design
=========================================
*/

:root{
    --nf-text:#1A252A;
    --nf-accent:#f49864;
    --nf-accent-faded:#f8c1a2;
    --nf-sage:#a2a68f;
    --nf-border:#d9ddda;
    --nf-background:#ffffff;
    --nf-box:#f4f5f3;
}

.nf-widget,
.nf-widget *{
    box-sizing:border-box;
}

.nf-widget{
    width:100%;
    font-family:"Figtree", Arial, sans-serif;
    color:var(--nf-text);
}

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

.nf-filters{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:14px;
    width:100%;
    margin:0 auto 44px;
    text-align:center;
}

.nf-category-buttons{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:14px;
    width:100%;
}

.nf-widget .nf-category-button{
    appearance:none;
    -webkit-appearance:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:50px;
    padding:1rem 1.25rem;
    border:0;
    border-radius:0;
    background:#ffffff;
    color:var(--nf-text);
    cursor:pointer;
    font-family:"Figtree", Arial, sans-serif;
    font-size:1rem;
    font-weight:700;
    letter-spacing:.05rem;
    line-height:1.15;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    box-shadow:none;
    transform:none;
    transition:background-color .18s ease, color .18s ease;
}

.nf-widget .nf-category-button:hover,
.nf-widget .nf-category-button:focus{
    background:var(--nf-sage);
    color:#ffffff;
    outline:none;
    box-shadow:none;
    transform:none;
}

.nf-widget .nf-category-button.is-active,
.nf-widget .nf-category-button.is-active:hover,
.nf-widget .nf-category-button.is-active:focus{
    background:var(--nf-accent);
    color:#ffffff;
    outline:none;
    box-shadow:none;
    transform:none;
}


.nf-category-select-wrap{
    display:none;
    width:100%;
    max-width:420px;
    margin:0 auto;
    text-align:left;
}

.nf-category-select-label{
    display:block;
    margin:0 0 .55rem;
    color:var(--nf-text);
    font-family:"Figtree", Arial, sans-serif;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.05rem;
    line-height:1.1;
    text-transform:uppercase;
}

.nf-widget .nf-category-select{
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    min-height:50px;
    padding:1rem 3rem 1rem 1rem;
    border:0;
    border-radius:0;
    background-color:#ffffff;
    background-image:linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
    background-position:calc(100% - 22px) calc(50% - 3px), calc(100% - 16px) calc(50% - 3px);
    background-size:6px 6px, 6px 6px;
    background-repeat:no-repeat;
    color:var(--nf-text);
    cursor:pointer;
    font-family:"Figtree", Arial, sans-serif;
    font-size:1rem;
    font-weight:700;
    letter-spacing:.05rem;
    line-height:1.15;
    text-transform:uppercase;
    box-shadow:none;
    transition:background-color .18s ease, color .18s ease;
}

.nf-widget .nf-category-select:hover,
.nf-widget .nf-category-select:focus{
    background-color:var(--nf-sage);
    color:#ffffff;
    outline:none;
    box-shadow:none;
}

.nf-widget .nf-category-select.is-active,
.nf-widget .nf-category-select.is-active:hover,
.nf-widget .nf-category-select.is-active:focus{
    background-color:var(--nf-accent);
    color:#ffffff;
}

.nf-category-button:focus-visible,
.nf-card__button:focus-visible,
.nf-load-more:focus-visible,
.nf-reset:focus-visible{
    outline:3px solid var(--nf-text);
    outline-offset:3px;
}

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

.nf-results{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:44px;
    width:100%;
    transition:opacity .2s ease;
}

.nf-widget.is-loading .nf-results{
    opacity:.45;
    pointer-events:none;
}

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

.nf-card{
    display:flex;
    flex-direction:column;
    background:var(--nf-background);
    border:none;
    border-radius:0;
    overflow:hidden;
    color:var(--nf-text);
    box-shadow:10px 10px 0 var(--nf-accent);
    transition:transform .22s ease, box-shadow .22s ease;
}

.nf-card:hover{
    transform:translateY(-8px);
    box-shadow:10px 10px 0 var(--nf-sage);
}

.nf-card__image{
    display:block;
    width:100%;
    aspect-ratio:4 / 3;
    overflow:hidden;
    background:var(--nf-box);
    border-radius:0;
}

.nf-card__image img{
    display:block;
    width:100%;
    height:100%;
    min-height:100%;
    object-fit:cover;
    object-position:center center;
    transition:transform .45s ease, filter .45s ease;
}

.nf-card:hover .nf-card__image img{
    transform:scale(1.045);
    filter:saturate(1.04) contrast(1.03);
}

.nf-card__content{
    display:flex;
    flex-direction:column;
    gap:1rem;
    flex:1;
    padding:1.35rem;
}

.nf-card__title{
    margin:0;
    color:var(--nf-text);
    font-family:"Figtree", Arial, sans-serif;
    font-size:clamp(1.35rem, 1.6vw, 1.85rem);
    line-height:1.08;
    font-weight:900;
    letter-spacing:-.02em;
}

.nf-card__title a{
    color:inherit;
    text-decoration:none;
}

.nf-card__facts{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.75rem;
}

.nf-card__fact{
    display:flex;
    align-items:center;
    gap:.65rem;
    min-height:70px;
    padding:.8rem;
    background:var(--nf-box);
    border:1px solid var(--nf-sage);
    border-radius:0;
    color:var(--nf-text);
}

.nf-card__fact-text{
    display:flex;
    flex-direction:column;
    gap:.15rem;
    min-width:0;
}

.nf-card__fact-label{
    font-size:.72rem;
    line-height:1;
    font-weight:700;
    letter-spacing:.05rem;
    text-transform:uppercase;
    color:var(--nf-sage);
}

.nf-card__fact-value{
    font-size:.95rem;
    line-height:1.15;
    font-weight:700;
    color:var(--nf-text);
}

.nf-card__excerpt{
    color:#1A252A;
    font-family:"Figtree", Arial, sans-serif;
    font-size:1rem;
    line-height:1.55;
    font-weight:400;
}


/* Respect hidden state even when theme/button CSS sets display values */
.nf-widget [hidden]{
    display:none !important;
}

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

.nf-card__button,
.nf-load-more,
.nf-reset{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.45rem;
    min-height:50px;
    padding:1rem;
    border-radius:0;
    cursor:pointer;
    font-family:"Figtree", Arial, sans-serif;
    font-size:1rem;
    font-weight:700;
    line-height:1.15;
    letter-spacing:.05rem;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    box-shadow:none;
    transform:none;
    transition:background-color .18s ease, border-color .18s ease, color .18s ease, opacity .18s ease;
}

.nf-card__button{
    width:100%;
    margin-top:auto;
    border:2px solid var(--nf-accent);
    background:var(--nf-accent);
    color:#ffffff;
}

.nf-card__button:hover,
.nf-card__button:focus{
    background:var(--nf-sage);
    border-color:var(--nf-sage);
    color:#ffffff;
    outline:none;
    box-shadow:none;
    transform:none;
}

.nf-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:1rem;
    margin-top:46px;
    text-align:center;
}

.nf-load-more{
    min-width:260px;
}

.nf-widget .nf-actions .nf-load-more,
.nf-widget .nf-actions .nf-reset{
    appearance:none !important;
    -webkit-appearance:none !important;
    border:2px solid #ffffff !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#ffffff !important;
    font-weight:700 !important;
    box-shadow:none !important;
    transform:none !important;
}

.nf-widget .nf-actions .nf-load-more:hover,
.nf-widget .nf-actions .nf-load-more:focus,
.nf-widget .nf-actions .nf-load-more:active,
.nf-widget .nf-actions .nf-reset:hover,
.nf-widget .nf-actions .nf-reset:focus,
.nf-widget .nf-actions .nf-reset:active,
.nf-widget .nf-actions .nf-reset.is-active{
    border-color:var(--nf-sage) !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#ffffff !important;
    outline:none;
    box-shadow:none !important;
    transform:none !important;
}

.nf-widget .nf-actions .nf-load-more:disabled{
    cursor:wait;
    border-color:#ffffff !important;
    background:transparent !important;
    color:#ffffff !important;
    opacity:.75;
}

.nf-empty{
    grid-column:1 / -1;
    width:100%;
    margin:0;
    padding:22px 24px;
    color:#ffffff;
    font-family:"Figtree", Arial, sans-serif;
    font-size:18px;
    font-weight:700;
    line-height:1.4;
    text-align:center;
    border:1px solid rgba(255,255,255,.55);
    border-radius:0;
    background:rgba(255,255,255,.08);
}

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

@media(max-width:1024px){
    .nf-results{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:40px;
    }
}

@media(max-width:767px){
    .nf-filters{
        margin-bottom:34px;
    }

    .nf-category-buttons{
        display:none;
    }

    .nf-category-select-wrap{
        display:block;
    }

    .nf-results{
        grid-template-columns:1fr;
        gap:34px;
    }

    .nf-card__facts{
        grid-template-columns:1fr;
    }

    .nf-actions{
        gap:.8rem;
    }

    .nf-load-more,
    .nf-reset{
        width:100%;
        max-width:360px;
    }
}


/* Strong theme/Elementor override for action buttons */
.nf-widget .nf-actions button.nf-load-more,
.nf-widget .nf-actions button.nf-reset{
    border:2px solid #ffffff !important;
    border-radius:0 !important;
    background:transparent !important;
    background-color:transparent !important;
    color:#ffffff !important;
    font-family:"Figtree", Arial, sans-serif !important;
    font-size:1rem !important;
    font-weight:700 !important;
    letter-spacing:.05rem !important;
    text-transform:uppercase !important;
    box-shadow:none !important;
    transform:none !important;
}

.nf-widget .nf-actions button.nf-load-more:hover,
.nf-widget .nf-actions button.nf-load-more:focus,
.nf-widget .nf-actions button.nf-load-more:active,
.nf-widget .nf-actions button.nf-reset:hover,
.nf-widget .nf-actions button.nf-reset:focus,
.nf-widget .nf-actions button.nf-reset:active{
    border-color:#a2a68f !important;
    background:transparent !important;
    background-color:transparent !important;
    color:#ffffff !important;
    box-shadow:none !important;
    transform:none !important;
}

.nf-end-message{
    width:100%;
    margin:22px 0 0;
    color:#ffffff;
    font-family:"Figtree", Arial, sans-serif;
    font-size:1rem;
    font-weight:700;
    line-height:1.4;
    text-align:center;
}
