/* =========================================================
   [blog_home] - cards de posts para a home
   Usa as mesmas variáveis e o mesmo card de tc-blog.css
   ========================================================= */
.tcblog-home,
.tcblog-home * {
    box-sizing: border-box !important;
}

.tcblog-home {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: var(--tc-text) !important;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}

/* Espaço extra para o hover do card (translateY + sombra) não ser cortado */
.tcblog-home-viewport {
    overflow: hidden !important;
    padding: 8px 4px 24px !important;
    margin: -8px -4px -24px !important;
}

/* ---------- Desktop / tablet: grid de 3 colunas ---------- */
.tcblog-home-track {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
}

.tcblog-home-slide {
    display: flex !important;
    min-width: 0 !important;
}

.tcblog-home-slide .tcblog-card {
    width: 100% !important;
}

/* Navegação só aparece no mobile */
.tcblog-home-nav {
    display: none !important;
}

/* ---------- Botão "Veja mais postagens" ---------- */
.tcblog-home-cta {
    display: flex !important;
    justify-content: center !important;
    margin-top: 36px !important;
}

.tcblog-home-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: var(--tc-primary) !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 14px 30px !important;
    border-radius: 999px !important;
    border: 1px solid var(--tc-primary) !important;
    transition: background .2s ease, transform .15s ease, box-shadow .2s ease;
}

.tcblog-home-btn:hover,
.tcblog-home-btn:focus-visible {
    background: var(--tc-primary-dark) !important;
    border-color: var(--tc-primary-dark) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(150, 96, 77, 0.25) !important;
}

.tcblog-home-btn svg {
    transition: transform .2s ease;
}

.tcblog-home-btn:hover svg {
    transform: translateX(3px);
}

/* ---------- Mobile: 1 card por vez + setas + dots ---------- */
@media (max-width: 767px) {
    .tcblog-home-viewport {
        overflow: visible !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .tcblog-home-track {
        display: flex !important;
        gap: 16px !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 6px 2px 20px !important;
    }

    .tcblog-home-track::-webkit-scrollbar {
        display: none !important;
    }

    .tcblog-home-slide {
        flex: 0 0 100% !important;
        scroll-snap-align: center !important;
        scroll-snap-stop: always;
    }

    /* no mobile o hover não "pula" o card */
    .tcblog-home-slide .tcblog-card:hover {
        transform: none;
    }

    .tcblog-home-nav {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 16px !important;
        margin-top: 4px !important;
    }

    .tcblog-home-arrow {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        height: 42px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        border: 1px solid var(--tc-border) !important;
        background: #fff !important;
        color: var(--tc-primary-dark) !important;
        box-shadow: 0 4px 14px rgba(58, 50, 44, 0.10) !important;
        cursor: pointer !important;
        transition: background .2s ease, color .2s ease, opacity .2s ease;
    }

    .tcblog-home-arrow:hover,
    .tcblog-home-arrow:focus-visible {
        background: var(--tc-primary) !important;
        color: #fff !important;
    }

    .tcblog-home-arrow[disabled] {
        opacity: .35 !important;
        cursor: default !important;
        background: #fff !important;
        color: var(--tc-primary-dark) !important;
    }

    .tcblog-home-dots {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .tcblog-home-dot {
        width: 9px !important;
        height: 9px !important;
        min-width: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
        border: none !important;
        border-radius: 999px !important;
        background: rgba(185, 122, 99, 0.3) !important;
        cursor: pointer !important;
        transition: width .25s ease, background .25s ease;
    }

    .tcblog-home-dot.is-ativo {
        width: 26px !important;
        background: var(--tc-primary) !important;
    }

    .tcblog-home-cta {
        margin-top: 28px !important;
    }

    .tcblog-home-btn {
        width: 100% !important;
        max-width: 340px !important;
        justify-content: center !important;
    }
}