/* =============================================
   TEREZA KATIELI — Blog Index CSS
   ============================================= */

/* ===== BLOG INDEX ===== */
    .blog-hero { padding: 140px 0 0; background: var(--preto); }

    /* ÚLTIMO ARTIGO */
    .ultimo-artigo { padding: 60px 0 80px; border-bottom: 1px solid rgba(201,168,76,0.1); }
    .ultimo-inner { display: grid; grid-template-columns: 1fr 2.5fr 1fr; gap: 48px; align-items: center; }

    .ultimo-texto { padding-top: 8px; }
    .ultimo-categoria { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--dourado); display: flex; align-items: center; gap: 8px; margin-bottom: 20px; }
    .ultimo-categoria::before { content: ''; width: 20px; height: 1px; background: var(--dourado); }
    .ultimo-titulo { font-family: var(--fonte-serif); font-size: clamp(1.8rem, 3vw, 2.8rem); font-weight: 400; color: var(--offwhite); line-height: 1.2; margin-bottom: 28px; }
    .ultimo-resumo { font-size: 13px; font-weight: 300; color: var(--cinza); line-height: 1.8; margin-bottom: 28px; }
    .btn-artigo { display: inline-flex; align-items: center; gap: 10px; font-size: 10px; font-weight: 500; letter-spacing: 2.5px; text-transform: uppercase; color: var(--offwhite); border: 1px solid rgba(201,168,76,0.3); padding: 12px 24px; text-decoration: none; transition: 0.3s; }
    .btn-artigo:hover { border-color: var(--dourado); color: var(--dourado-lt); }
    .btn-artigo svg { width: 14px; height: 14px; }

    .ultimo-imagem { position: relative; }
    .ultimo-imagem a { display: block; overflow: hidden; }
    .ultimo-imagem img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; transition: transform 0.4s ease; }
    .ultimo-imagem a:hover img { transform: scale(1.02); }
    .ultimo-imagem-placeholder { width: 100%; aspect-ratio: 4/3; background: var(--preto-mid); border: 1px solid rgba(201,168,76,0.1); display: flex; align-items: center; justify-content: center; }
    .ultimo-imagem-placeholder span { font-family: var(--fonte-serif); font-size: 3rem; color: rgba(201,168,76,0.2); letter-spacing: 4px; }
    .ultimo-data { font-size: 11px; color: var(--cinza); margin-bottom: 12px; }

    /* LINKS ÚTEIS */
    .links-uteis h3 { font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--dourado); margin-bottom: 20px; }
    .link-util-item { display: flex; align-items: center; gap: 14px; padding: 16px 0; border-bottom: 1px solid rgba(201,168,76,0.08); text-decoration: none; transition: 0.25s; }
    .link-util-item:last-child { border-bottom: none; }
    .link-util-item:hover { padding-left: 6px; }
    .link-util-item:hover .link-util-icon { border-color: var(--dourado); background: rgba(201,168,76,0.08); }
    .link-util-item:hover .link-util-texto { color: var(--dourado-lt); }
    .link-util-icon { width: 36px; height: 36px; border: 1px solid rgba(201,168,76,0.2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: 0.25s; }
    .link-util-icon i { color: var(--dourado); font-size: 13px; }
    .link-util-texto { font-size: 13px; font-weight: 300; color: var(--cinza-lt); transition: 0.25s; }

    /* DESTAQUES */
    .destaques-section { padding: 28px 0; background: var(--preto-mid); position: relative; }
    .destaques-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(to right, transparent, rgba(201,168,76,0.2), transparent); }
    .destaques-section::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 1px; background: linear-gradient(to right, transparent, rgba(201,168,76,0.2), transparent); }
    .destaques-header { margin-bottom: 32px; }
    .destaques-header h2 { font-family: var(--fonte-serif); font-size: 1.1rem; font-weight: 300; color: var(--cinza); letter-spacing: 2px; text-transform: uppercase; font-style: normal; }
    .destaques-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(201,168,76,0.08); }
    .destaque-card { background: var(--preto-mid); padding: 24px 20px; text-decoration: none; transition: 0.25s; display: block; }
    .destaque-card:hover { background: rgba(201,168,76,0.06); }
    .destaque-cat { font-size: 9px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--dourado); margin-bottom: 10px; }
    .destaque-titulo { font-family: var(--fonte-serif); font-size: 1.05rem; font-weight: 400; color: var(--offwhite); line-height: 1.4; transition: 0.25s; }
    .destaque-card:hover .destaque-titulo { color: var(--dourado-lt); }

    /* TODOS OS ARTIGOS */
    .artigos-section { padding: 80px 0; background: var(--preto); position: relative; }
    .artigos-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(to right, transparent, rgba(201,168,76,0.2), transparent); }
    .artigos-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 40px; }
    .artigos-header h2 { font-family: var(--fonte-serif); font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 300; color: var(--offwhite); }
    .artigos-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; background: transparent; margin-bottom: 0; }

    .artigo-card { background: var(--preto); text-decoration: none; display: block; transition: 0.25s; }
    .artigo-card:hover { background: var(--preto); }
    .artigo-img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
    .artigo-img-placeholder { width: 100%; aspect-ratio: 16/9; background: var(--preto-mid); display: flex; align-items: center; justify-content: center; border-bottom: 1px solid rgba(201,168,76,0.08); }
    .artigo-img-placeholder i { color: rgba(201,168,76,0.2); font-size: 2rem; }
    .artigo-body { padding: 24px; }
    .artigo-cat { font-size: 9px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--dourado); margin-bottom: 10px; }
    .artigo-titulo { font-family: var(--fonte-serif); font-size: 1.15rem; font-weight: 400; color: var(--offwhite); line-height: 1.35; margin-bottom: 10px; transition: 0.25s; }
    .artigo-card:hover .artigo-titulo { color: var(--dourado-lt); }
    .artigo-resumo { font-size: 12px; font-weight: 300; color: var(--cinza); line-height: 1.7; margin-bottom: 14px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
    .artigo-footer { display: flex; align-items: center; justify-content: space-between; }
    .artigo-data { font-size: 10px; color: var(--cinza); letter-spacing: 1px; }
    .artigo-arrow { width: 28px; height: 28px; border: 1px solid rgba(201,168,76,0.2); display: flex; align-items: center; justify-content: center; transition: 0.25s; }
    .artigo-card:hover .artigo-arrow { border-color: var(--dourado); background: rgba(201,168,76,0.06); }
    .artigo-arrow svg { width: 12px; height: 12px; stroke: var(--dourado); }

    /* PAGINAÇÃO */
    .paginacao-wrap { margin-top: 16px; display: flex; align-items: center; justify-content: flex-end; gap: 20px; }
    .pag-label { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--cinza); white-space: nowrap; }
    .paginacao { display: flex; gap: 6px; align-items: center; }
    .pag-btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 13px; letter-spacing: 1px; color: var(--cinza-lt); border: 1px solid rgba(201,168,76,0.2); background: transparent; text-decoration: none; transition: 0.25s; cursor: pointer; font-family: var(--fonte-sans); }
    .pag-btn:hover { border-color: var(--dourado); color: var(--dourado-lt); background: rgba(201,168,76,0.06); }
    .pag-btn.ativo { background: rgba(201,168,76,0.15); color: var(--dourado-lt); border-color: var(--dourado); font-weight: 500; pointer-events: none; cursor: default; }
    .pag-nav { background: rgba(201,168,76,0.04); }
    .pag-ellipsis { color: var(--cinza); font-size: 13px; padding: 0 4px; line-height: 40px; }
    .pag-info { display: none; }

    /* CTA BANNER */
    .cta-banner { padding: 80px 0; background: var(--preto-mid); position: relative; overflow: hidden; }
    .cta-banner::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(to right, transparent, rgba(201,168,76,0.2), transparent); }
    .cta-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
    .cta-texto { }
    .cta-eyebrow { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--dourado); margin-bottom: 16px; }
    .cta-titulo { font-family: var(--fonte-serif); font-size: clamp(1.8rem, 3vw, 2.8rem); font-weight: 300; color: var(--offwhite); line-height: 1.2; margin-bottom: 16px; }
    .cta-subtitulo { font-size: 14px; font-weight: 300; color: var(--cinza-lt); line-height: 1.8; margin-bottom: 32px; }
    .cta-imagem { position: relative; }
    .cta-imagem img { width: 100%; max-height: 400px; object-fit: cover; display: block; }
    .cta-imagem-placeholder { width: 100%; height: 300px; background: rgba(201,168,76,0.04); border: 1px solid rgba(201,168,76,0.15); display: flex; align-items: center; justify-content: center; }

    /* RESPONSIVO */
    @media (max-width: 1024px) {
      .ultimo-inner { grid-template-columns: 1fr; }
      .links-uteis { border-top: 1px solid rgba(201,168,76,0.1); padding-top: 32px; }
      .destaques-grid { grid-template-columns: repeat(2, 1fr); }
      .artigos-grid { grid-template-columns: repeat(2, 1fr); }
      .cta-inner { grid-template-columns: 1fr; }
    }
    @media (max-width: 768px) {
      .ultimo-inner { gap: 32px; }
      .destaques-grid { grid-template-columns: 1fr; }
      .artigos-grid { grid-template-columns: 1fr; }
    }