/**
 * SJPR News & Insights — Figma node 371:1713  (canvas 1920px)
 *
 * Proporções do Figma convertidas em vw para escalar entre 640–1920px:
 *   padding vertical: 120px / 1920 =  6.25vw
 *   inner gap:         56px / 1920 =  2.92vw
 *   title font:        40px / 1920 =  2.08vw
 *   grid gap:          32px / 1920 =  1.67vw
 *   card width:       336px / 1920 = 17.5vw
 *   card gap:          40px / 1920 =  2.08vw
 *   media height:     240px / 1920 = 12.5vw
 *   headline font:     24px / 1920 =  1.25vw
 */

.sjpr-news {
    --sjpr-news-bg:    #000000;
    --sjpr-news-gold:  #ba9e2e;
    --sjpr-news-grey:  #d4d4d4;
    --sjpr-news-meta:  #808080;
    --sjpr-news-black: #000000;
    background: var(--sjpr-news-bg);
    padding: clamp(64px, 6.25vw, 120px) clamp(20px, 1.25vw, 24px);  /* 120/1920 */
    font-family: "Inter", system-ui, sans-serif;
}

.sjpr-news__inner {
    max-width: 1480px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(32px, 2.92vw, 56px);             /* 56/1920 */
}

/* Título da seção — 40px bold dourado */
.sjpr-news__title {
    margin: 0;
    width: 100%;
    text-align: center;
    font-size: clamp(24px, 2.08vw, 40px);       /* 40/1920 */
    font-weight: 700;
    line-height: 1.1;
    color: var(--sjpr-news-gold);
}

/* Grid de cards */
.sjpr-news__grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(20px, 1.67vw, 32px);             /* 32/1920 */
    width: 100%;
}

/* Card individual — 336px@1920 */
.sjpr-news-card {
    display: flex;
    flex-direction: column;
    gap: clamp(24px, 2.08vw, 40px);             /* 40/1920 */
    flex: 0 1 clamp(260px, 17.5vw, 336px);      /* 336/1920 */
    max-width: 100%;
}

.sjpr-news-card__media-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

/* Imagem do card — 240px@1920 */
.sjpr-news-card__media {
    position: relative;
    height: clamp(160px, 12.5vw, 240px);        /* 240/1920 */
    border-radius: clamp(16px, 1.25vw, 24px);
    overflow: hidden;
    background: #1a1a1a;
}

.sjpr-news-card__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
    display: block;
}

.sjpr-news-card__placeholder {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #2a2a2a 0%, #111 100%);
}

.sjpr-news-card__badge {
    position: absolute;
    left: clamp(16px, 1.25vw, 24px);
    bottom: clamp(16px, 1.25vw, 24px);
    padding: clamp(6px, 0.42vw, 8px) clamp(12px, 0.83vw, 16px);
    border-radius: 40px;
    background: var(--sjpr-news-gold);
    color: var(--sjpr-news-black);
    font-size: clamp(12px, 0.73vw, 14px);
    font-weight: 400;
    line-height: 1.2;
    max-width: calc(100% - 48px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Corpo do card */
.sjpr-news-card__body {
    display: flex;
    flex-direction: column;
    gap: clamp(16px, 1.25vw, 24px);             /* 24/1920 */
    align-items: flex-start;
    width: 100%;
}

/* Título do post — 24px bold dourado */
.sjpr-news-card__headline {
    margin: 0;
    font-size: clamp(16px, 1.25vw, 24px);       /* 24/1920 */
    font-weight: 700;
    line-height: 1.25;
    color: var(--sjpr-news-gold);
}

.sjpr-news-card__headline a {
    color: inherit;
    text-decoration: none;
}

.sjpr-news-card__headline a:hover {
    text-decoration: underline;
}

/* Excerpt — 14px (mínimo legível) */
.sjpr-news-card__excerpt {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.71;
    color: var(--sjpr-news-grey);
}

/* Meta: avatar + byline */
.sjpr-news-card__meta {
    display: flex;
    align-items: center;
    gap: clamp(12px, 0.83vw, 16px);
}

.sjpr-news-card__avatar {
    width: clamp(32px, 2.08vw, 40px);
    height: clamp(32px, 2.08vw, 40px);
    border-radius: 100px;
    overflow: hidden;
    flex-shrink: 0;
}

.sjpr-news-card__avatar-img,
.sjpr-news-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sjpr-news-card__byline {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 12px;
    line-height: 1.3;
    color: var(--sjpr-news-meta);
}

.sjpr-news-card__author { display: block; }
.sjpr-news-card__date   { display: block; }

/* CTA "Ver todas as notícias" */
.sjpr-news__cta-wrap {
    display: flex;
    justify-content: center;
    margin-top: clamp(8px, 0.83vw, 16px);
}

.sjpr-news__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: clamp(12px, 0.83vw, 16px) clamp(20px, 1.25vw, 24px);
    border-radius: 48px;
    background: var(--sjpr-news-gold);
    color: var(--sjpr-news-black);
    font-size: clamp(14px, 0.83vw, 16px);
    font-weight: 400;
    text-decoration: none;
    line-height: 1.2;
    transition: filter 0.15s;
}

.sjpr-news__cta:hover {
    filter: brightness(1.08);
}

/* ── Responsivo: scroll lateral abaixo de 1024px ── */
@media (max-width: 1024px) {
    .sjpr-news {
        padding-left: 0;
        padding-right: 0;
    }

    .sjpr-news__inner {
        max-width: none;
        padding: 0 clamp(20px, 4vw, 40px);
    }

    .sjpr-news__grid {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: visible;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 20px;
        margin: 0 calc(-1 * clamp(20px, 4vw, 40px));
        padding: 0 clamp(20px, 4vw, 40px) 10px;
        scrollbar-width: thin;
        scrollbar-color: var(--sjpr-news-gold) transparent;
    }

    .sjpr-news__grid::-webkit-scrollbar {
        height: 4px;
    }

    .sjpr-news__grid::-webkit-scrollbar-track {
        background: transparent;
    }

    .sjpr-news__grid::-webkit-scrollbar-thumb {
        background: var(--sjpr-news-gold);
        border-radius: 4px;
    }

    .sjpr-news-card {
        flex: 0 0 280px;
        max-width: none;
        scroll-snap-align: center;
    }

    .sjpr-news-card.sa-animation {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ── Responsivo: mobile abaixo de 640px ── */
@media (max-width: 640px) {
    .sjpr-news__inner {
        gap: 36px;
        padding: 0 16px;
    }

    .sjpr-news__title {
        font-size: clamp(22px, 7vw, 32px);
    }

    .sjpr-news__grid {
        margin: 0 -16px;
        padding: 0 16px 10px;
    }

    .sjpr-news-card {
        flex: 0 0 82vw;
    }

    .sjpr-news-card__media {
        height: clamp(180px, 50vw, 240px);
    }

    .sjpr-news-card__headline {
        font-size: clamp(16px, 5vw, 22px);
    }
}
