/* ============================================================
   artigos.css — estilos compartilhados para páginas de artigo
   ============================================================ */

/* Navbar: sticky apenas nas páginas de artigo */
.artigo-page #toposeta {
    position: sticky !important;
    top: 0;
    background: #1a1a1a !important;
    padding: 10px 0;
}
.artigo-page #toposeta .logo img { width: 50px !important; height: auto !important; }
.artigo-page #toposeta .navbar-nav .nav-link { color: #eee !important; }
.artigo-page #toposeta .navbar-nav .nav-link:hover,
.artigo-page #toposeta .navbar-nav .nav-link.active-artigo { color: #d01010 !important; }

/* Breadcrumb */
.artigo-breadcrumb { background: #f0f0f0; padding: 10px 0; font-size: 0.78rem; color: #888; }
.artigo-breadcrumb a { color: #555; text-decoration: none; }
.artigo-breadcrumb a:hover { color: #d01010; }
.artigo-breadcrumb span { margin: 0 6px; }

/* Wrapper do artigo */
.artigo-wrapper { background: #fff; padding: 50px 0 70px; }
.artigo-inner { max-width: 800px; margin: 0 auto; padding: 0 15px; }

/* Tag de categoria */
.artigo-tag {
    display: inline-block;
    background: #d01010;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 3px;
    margin-bottom: 16px;
}

/* Título */
.artigo-inner h1 {
    font-family: 'Raleway', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.3;
    color: #1a1a1a;
    margin-bottom: 14px;
}

/* Subtítulo */
.artigo-inner h2 {
    font-family: 'Raleway', sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-top: 38px;
    margin-bottom: 14px;
    padding-left: 14px;
    border-left: 4px solid #d01010;
}

/* Meta (suporte às duas classes: artigo-meta e meta) */
.artigo-meta, .artigo-inner .meta {
    font-size: 0.8rem;
    color: #888;
    border-bottom: 1px solid #e8e8e8;
    padding-bottom: 18px;
    margin-bottom: 28px;
}

/* Parágrafo e listas */
.artigo-inner p { font-size: 0.97rem; line-height: 1.85; color: #333; margin-bottom: 18px; }
.artigo-inner ol, .artigo-inner ul { padding-left: 24px; margin-bottom: 18px; }
.artigo-inner li { font-size: 0.97rem; line-height: 1.85; color: #333; margin-bottom: 6px; }

/* Tabela */
.artigo-inner table { border-collapse: collapse; width: 100%; margin: 20px 0 24px; font-size: 0.88rem; }
.artigo-inner th, .artigo-inner td { border: 1px solid #ddd; padding: 10px 12px; text-align: left; vertical-align: top; }
.artigo-inner th { background: #1a1a1a; color: #fff; font-weight: 600; }
.artigo-inner tr:nth-child(even) td { background: #f9f9f9; }

/* Destaque */
.destaque {
    background: #faf8f6;
    border-left: 4px solid #d01010;
    padding: 18px 22px;
    margin: 24px 0;
    border-radius: 0 4px 4px 0;
}
.destaque p { margin: 0; font-style: italic; }

/* FAQ (suporte a .faq-bloco e .faq) */
.faq-bloco h3, .artigo-inner .faq h3 {
    font-family: 'Raleway', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 6px;
    margin-top: 20px;
}

/* CTA (suporte a .artigo-cta e .cta) */
.artigo-cta, .artigo-inner .cta {
    background: #1a1a1a;
    color: #fff;
    padding: 28px;
    margin-top: 40px;
    border-radius: 6px;
}
.artigo-cta p, .artigo-inner .cta p { color: #ddd; margin-bottom: 8px; font-size: 0.92rem; }
.artigo-cta p:last-child, .artigo-inner .cta p:last-child { margin-bottom: 0; }
.artigo-cta strong, .artigo-inner .cta strong { color: #fff; }
.artigo-cta a, .artigo-inner .cta a { color: #ff9999; }
.artigo-cta a:hover, .artigo-inner .cta a:hover { color: #ffbbbb; }

/* Volta ao blog */
.volta-blog { text-align: center; margin-top: 44px; padding-top: 24px; border-top: 1px solid #eee; }
.volta-blog a {
    display: inline-block;
    color: #d01010;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
}
.volta-blog a:hover { color: #b00d0d; }

/* Footer */
footer.text-center { background: #1a1a1a; padding: 40px 0 25px; }
footer .logo02 img { max-width: 70px; height: auto; display: block; margin: 0 auto 10px; }
footer p { font-size: 0.8rem; color: #777; margin: 4px 0 0; }
footer a { color: #aaa; }
footer a:hover { color: #d01010; }
footer .info { margin-bottom: 16px; }

/* WhatsApp */
@keyframes pulse-whatsapp {
    0%, 100% { transform: scale(1); box-shadow: 2px 2px 10px rgba(0,0,0,0.5) !important; }
    50% { transform: scale(1.05); box-shadow: 0 0 20px rgba(37,211,102,0.6) !important; }
}
.wc_whatsapp::before { display: none !important; }
.wc_whatsapp:hover { transform: scale(1.1) !important; box-shadow: 0 0 25px rgba(37,211,102,0.8) !important; animation: none !important; }

/* Responsivo */
@media (max-width: 768px) {
    .artigo-inner h1 { font-size: 1.5rem; }
    .artigo-inner h2 { font-size: 1.1rem; }
    .navbar-collapse { background: #1a1a1a; padding: 10px 0; }
    .artigo-wrapper { padding: 30px 0 50px; }
}

/* ============================================================
   LISTING PAGE
   ============================================================ */
.artigos-listing { background: #f8f8f8; padding: 60px 0; }
.artigos-listing h1 {
    font-family: 'Raleway', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 8px;
    text-align: center;
}
.artigos-listing .listing-subtitle { text-align: center; color: #666; font-size: 0.95rem; margin-bottom: 40px; }

.artigo-card {
    background: #fff;
    border-radius: 6px;
    padding: 24px;
    margin-bottom: 24px;
    border: 1px solid #e8e8e8;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.artigo-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.1); transform: translateY(-2px); }
.artigo-card .card-tag {
    display: inline-block;
    background: #d01010;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 3px;
    margin-bottom: 12px;
}
.artigo-card h2,
.artigo-card h3 {
    font-family: 'Raleway', sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.4;
    margin-bottom: 10px;
    flex-grow: 1;
    border: none;
    padding: 0;
    margin-top: 0;
}
.artigo-card p { font-size: 0.85rem; color: #666; line-height: 1.6; margin-bottom: 16px; }
.artigo-card .card-link {
    display: inline-block;
    color: #d01010;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-decoration: none;
    text-transform: uppercase;
}
.artigo-card .card-link:hover { color: #b00d0d; }
.artigo-card .card-link::after { content: ' \2192'; }

/* Seção de artigos no index.html */
.artigos-section { background: #f8f8f8; }
.artigos-section .artigo-card { margin-bottom: 30px; }
.artigos-section .ver-todos { text-align: center; margin-top: 10px; }
.artigos-section .ver-todos-btn {
    display: inline-block;
    background: #d01010;
    color: #fff;
    padding: 12px 32px;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.2s ease;
}
.artigos-section .ver-todos-btn:hover { background: #b00d0d; color: #fff; }
