/* =====================================================================
   Lista de pastorais (public/pastorais.php): carrossel com 4 cards à
   vista, giro automático lento e setas para mover à mão.
   Usa os tokens de style.css.
   ===================================================================== */

.pastorais-carrossel { --colunas: 4; --vao: 24px; position: relative; }
.pastorais-trilho {
    display: flex; gap: var(--vao); overflow-x: auto; padding: 10px 4px 26px; margin: 0 -4px;
    scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
}
.pastorais-trilho::-webkit-scrollbar { display: none; }
.pastorais-trilho:focus-visible { outline: 2px solid var(--dourado-claro); outline-offset: 4px; border-radius: 12px; }

/* Até 4 pastorais: grade fixa, sem giro */
.pastorais-carrossel.e-estatico .pastorais-trilho { overflow: visible; flex-wrap: wrap; }

.pastoral-card {
    flex: 0 0 calc((100% - (var(--colunas) - 1) * var(--vao)) / var(--colunas));
    display: flex; flex-direction: column; background: #fff; border-radius: 16px; overflow: hidden;
    box-shadow: var(--sombra); border: 1px solid rgba(192,138,45,.14);
    transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s, border-color .35s;
}
.pastoral-card:hover, .pastoral-card:focus-visible { transform: translateY(-6px); box-shadow: var(--sombra-forte); border-color: rgba(192,138,45,.45); }
.pastoral-card:focus-visible { outline: 2px solid var(--dourado-claro); outline-offset: 2px; }

.pastoral-card-imagem { display: flex; align-items: center; justify-content: center; height: 190px; background: var(--creme-escuro); overflow: hidden; }
.pastoral-card-imagem img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.pastoral-card-imagem.e-logo { background: #fff; padding: 18px; border-bottom: 1px solid #f1ebdf; }
.pastoral-card-imagem.e-logo img { object-fit: contain; }
.pastoral-card:hover .pastoral-card-imagem img { transform: scale(1.05); }
.pastoral-card-icone { display: flex; align-items: center; justify-content: center; width: 96px; height: 96px; border-radius: 50%; background: #fff; color: var(--dourado); box-shadow: var(--sombra); }

.pastoral-card-corpo { flex: 1; display: flex; flex-direction: column; gap: 6px; padding: 18px 20px 20px; font-size: 13.5px; line-height: 1.5; color: var(--cinza-texto); }
.pastoral-card-corpo b { color: var(--azul-escuro); font-weight: 600; }
.pastoral-card-nome { font-family: var(--fonte-titulo); font-size: 19px; line-height: 1.25; color: var(--azul-escuro); margin-bottom: 2px; }
.pastoral-card-cta { margin-top: auto; padding-top: 10px; display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--dourado); }
.pastoral-card-cta .icone { transition: transform .3s; }
.pastoral-card:hover .pastoral-card-cta .icone { transform: translateX(4px); }

/* Setas */
.pastorais-seta {
    position: absolute; top: calc(50% - 18px); z-index: 2; width: 48px; height: 48px; border-radius: 50%; cursor: pointer;
    display: flex; align-items: center; justify-content: center; border: 1px solid rgba(192,138,45,.35);
    background: #fff; color: var(--azul-escuro); box-shadow: var(--sombra-forte); transition: background .25s, color .25s, transform .25s;
}
.pastorais-seta:hover { background: var(--azul-escuro); color: #fff; transform: scale(1.06); }
.pastorais-seta:focus-visible { outline: 3px solid var(--dourado-claro); outline-offset: 2px; }
.pastorais-seta.e-anterior { left: -24px; }
.pastorais-seta.e-anterior .icone { transform: rotate(180deg); }
.pastorais-seta.e-proxima { right: -24px; }

.pastorais-dica { text-align: center; font-size: 12.5px; color: #8a8478; margin-top: 4px; }

/* Botão "Ver lista completa" */
.pastorais-ver-lista { text-align: center; margin-top: 22px; }
.pastorais-botao-lista {
    display: inline-flex; align-items: center; gap: 8px; padding: 12px 26px; border-radius: 40px;
    font-size: 14px; font-weight: 600; color: var(--azul-escuro); background: #fff; border: 1px solid rgba(192,138,45,.45);
    box-shadow: var(--sombra); transition: background .25s, color .25s, transform .25s;
}
.pastorais-botao-lista .icone { color: var(--dourado); transition: color .25s; }
.pastorais-botao-lista:hover { background: var(--azul-escuro); color: #fff; transform: translateY(-2px); }
.pastorais-botao-lista:hover .icone { color: var(--dourado-claro); }

/* ---------- Lista completa (pastorais.php?lista=1) ---------- */
.pastorais-voltar { display: inline-block; font-size: 13px; color: var(--dourado); margin-bottom: 14px; }
.pastorais-lista-topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-bottom: 16px; }
.pastorais-busca { flex: 1 1 320px; max-width: 520px; display: flex; align-items: center; gap: 10px; padding: 0 14px; background: #fff; border-radius: 12px; border: 1px solid rgba(192,138,45,.25); box-shadow: var(--sombra); color: var(--dourado); }
.pastorais-busca:focus-within { box-shadow: 0 0 0 2px var(--dourado-claro); }
.pastorais-busca input { flex: 1; min-width: 0; border: 0; background: transparent; font: inherit; font-size: 14.5px; color: var(--azul-escuro); padding: 12px 0; outline: none; }
.pastorais-total { font-size: 13px; color: #8a8478; }
.pastorais-lista { list-style: none; display: flex; flex-direction: column; gap: 12px; max-width: 900px; }
.pastorais-lista li[hidden] { display: none; }
.pastorais-item {
    display: flex; align-items: center; gap: 14px; height: 100%; padding: 12px 16px 12px 12px; border-radius: 14px; background: #fff;
    border: 1px solid rgba(192,138,45,.12); box-shadow: var(--sombra); transition: transform .25s, box-shadow .25s, border-color .25s;
}
.pastorais-item:hover, .pastorais-item:focus-visible { transform: translateY(-2px); box-shadow: var(--sombra-forte); border-color: rgba(192,138,45,.45); }
.pastorais-item-imagem { flex: 0 0 auto; width: 58px; height: 58px; border-radius: 12px; overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--creme-escuro); color: var(--dourado); }
.pastorais-item-imagem img { width: 100%; height: 100%; object-fit: cover; }
.pastorais-item-imagem.e-logo { background: #fff; border: 1px solid #f1ebdf; padding: 5px; }
.pastorais-item-imagem.e-logo img { object-fit: contain; }
.pastorais-item-texto { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pastorais-item-texto strong { font-family: var(--fonte-titulo); font-size: 17px; line-height: 1.25; color: var(--azul-escuro); }
.pastorais-item-info { display: flex; flex-wrap: wrap; gap: 2px 14px; font-size: 12.5px; color: var(--cinza-texto); }
.pastorais-item-info b { color: var(--azul-escuro); font-weight: 600; }
.pastorais-item-resumo { font-size: 12.5px; line-height: 1.5; color: #8a8478; }
.pastorais-item-seta { flex: 0 0 auto; color: var(--dourado); transition: transform .25s; }
.pastorais-item:hover .pastorais-item-seta { transform: translateX(4px); }
.pastorais-nenhuma { text-align: center; color: #8a8478; padding: 20px 0; }

@media (max-width: 1240px) {
    .pastorais-seta.e-anterior { left: 4px; }
    .pastorais-seta.e-proxima { right: 4px; }
}
@media (max-width: 1024px) { .pastorais-carrossel { --colunas: 3; } }
@media (max-width: 760px)  {
    .pastorais-carrossel { --colunas: 2; --vao: 16px; }
    .pastoral-card-imagem { height: 150px; }
    /* No celular as setas ficam abaixo dos cards, para não cobrir os nomes */
    .pastorais-carrossel:not(.e-estatico) { padding-bottom: 56px; }
    .pastorais-seta { top: auto; bottom: 0; }
    .pastorais-seta.e-anterior { left: calc(50% - 56px); }
    .pastorais-seta.e-proxima { right: calc(50% - 56px); }
}
@media (max-width: 520px)  {
    .pastorais-carrossel { --colunas: 1.25; }
    .pastorais-carrossel.e-estatico { --colunas: 1; }
    .pastorais-seta { width: 40px; height: 40px; }
    .pastorais-dica { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .pastoral-card, .pastoral-card-imagem img { transition: none; }
}