/* DESIGN SYSTEM OFICIAL - DECOR & DESIGN */

:root {
  --color-black: #111111;
  --color-black-soft: #181818;
  --color-white: #ffffff;
  --color-background: #fafafa;
  --color-text: #222222;
  --color-text-soft: #666666;
  --color-border: #e5e5e5;
  --color-gold: #a98932;
  --color-gold-soft: #c4a64d;
  --color-gold-light: #f4eedc;
}

body {
    background-color: var(--color-white) !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* =========================================
   CONTAINER & LARGURA EDITORIAL
========================================= */
main.content-wrapper, main.artigo-container {
    max-width: 680px !important; /* Estreito para leitura conforme DESIGN.md */
    margin: 0 auto !important;
    padding: 40px 24px 60px !important;
}

/* =========================================
   TIPOGRAFIA - TÍTULOS (H1)
========================================= */
h1, h1.artigo-titulo {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: 34px !important; /* 30-38px */
    font-weight: 400 !important; /* normal */
    line-height: 1.25 !important;
    color: var(--color-black) !important;
    margin-bottom: 32px !important;
    text-align: left !important;
}

/* =========================================
   TIPOGRAFIA - H2
========================================= */
h2, .artigo-corpo h2, .post-content h2 {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: 25px !important; /* 23-27px */
    font-weight: 400 !important;
    color: var(--color-gold) !important;
    
    
    line-height: 1.3 !important;
}

/* =========================================
   TIPOGRAFIA - PARÁGRAFOS
========================================= */
p, .artigo-corpo p, .post-content p {
    font-family: 'Inter', Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
    color: #333333 !important;
    
}

/* =========================================
   IMAGENS
========================================= */
img {
    width: 100% !important;
    height: auto;
    object-fit: cover !important;
    border-radius: 6px !important;
    margin-top: 0 !important; 
}
/* Except logo */
.logo-txt img {
    width: 100% !important;
    height: auto;
    object-fit: cover !important;
    border-radius: 6px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* =========================================
   CITAÇÕES / BLOCKQUOTE
========================================= */
blockquote, .artigo-corpo blockquote, .post-content blockquote {
    border-left: 3px solid var(--color-gold) !important;
    background: var(--color-white) !important;
    font-family: 'Playfair Display', Georgia, serif !important;
    font-style: italic !important;
    padding: 24px 32px !important;
    margin: 40px 0 !important;
    font-size: 18px !important;
    color: var(--color-text) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.02) !important;
}

/* =========================================
   LINKS DENTRO DO CONTEÚDO
========================================= */
.post-content a, .artigo-corpo a {
    color: var(--color-gold) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}
.post-content a:hover, .artigo-corpo a:hover {
    text-decoration: underline !important;
}

/* =========================================
   METADADOS
========================================= */
.post-meta, .artigo-meta {
    font-family: 'Inter', sans-serif !important;
    font-size: 12px !important;
    color: var(--color-text-soft) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    
    display: flex !important;
    gap: 16px !important;
    align-items: center !important;
}
.post-meta i, .artigo-meta i {
    color: var(--color-gold) !important;
}

/* =========================================
   ARTIGOS RELACIONADOS (LISTA)
========================================= */
.recomendados-list li {
    
}
.recomendados-list a {
    color: var(--color-gold) !important;
    text-decoration: none !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    font-family: 'Inter', sans-serif !important;
}
.recomendados-list a:hover {
    text-decoration: underline !important;
}

/* =========================================
   MOBILE
========================================= */
@media (max-width: 768px) {
    main.content-wrapper, main.artigo-container {
        padding: 24px 16px 40px !important;
    }
    h1, h1.artigo-titulo {
        font-size: 28px !important;
    }
    h2, .artigo-corpo h2, .post-content h2 {
        font-size: 22px !important;
        
    }
    p, .artigo-corpo p, .post-content p {
        font-size: 15px !important;
    }
}
/* =========================================
   CTA BOX (Fale conosco)
========================================= */
.cta-box, .contact-box {
    background-color: #fafafa !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 6px !important;
    padding: 40px 32px !important;
    margin: 48px 0 !important;
    text-align: center !important;
}
.cta-box h2, .contact-box h2 {
    color: var(--color-black) !important;
    
    
    font-size: 24px !important;
    font-family: 'Playfair Display', Georgia, serif !important;
    border: none !important;
}
.cta-box p, .contact-box p {
    color: var(--color-text-soft) !important;
    
    font-family: 'Inter', Arial, sans-serif !important;
    font-size: 16px !important;
}
.cta-btn {
    background-color: #25D366 !important;
    color: #ffffff !important;
    border-radius: 30px !important;
    padding: 14px 28px !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    box-shadow: 0 4px 12px rgba(37, 211, 102, 0.2) !important;
    transition: all 0.2s ease !important;
}
.cta-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(37, 211, 102, 0.3) !important;
}
/* Elegant Arrows for Related Links */
.recomendados-list a::before {
    content: '\2192';
    color: var(--color-gold) !important;
    font-family: Arial, sans-serif !important;
    margin-right: 8px !important;
    display: inline-block;
    transition: transform 0.2s ease;
}
.recomendados-list a:hover::before {
    transform: translateX(4px);
}
/* FORCED SPACING FIXES */
main h1, main h1.artigo-titulo {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
    padding-bottom: 0 !important;
}

main > img, main .artigo-capa-wrap img, .hero-img {
    height: 400px !important;
    width: 100% !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    display: block !important;
    
    
}

.post-meta, .artigo-meta {
    border-bottom: 1px solid var(--color-border) !important;
    padding-bottom: 16px !important;
    margin-bottom: 0 !important;
}
/* =========================================
   HEADER
========================================= */
header, header.site-header {
    background: var(--color-black) !important;
    padding: 16px 24px !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    border-bottom: 1px solid #1c1c1e !important;
}
header .header-inner, .header-inner {
    max-width: 800px !important;
    margin: 0 auto !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    position: relative !important;
    height: 32px !important;
}
.btn-voltar {
    position: absolute !important;
    left: 0 !important;
    color: #ffffff !important;
    font-size: 20px !important;
    text-decoration: none !important;
    transition: opacity 0.2s !important;
}
.btn-voltar:hover { opacity: 0.8 !important; }
.logo-txt {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: 18px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-weight: 500 !important;
}

/* =========================================
   FOOTER
========================================= */
footer, footer.site-footer {
    background: var(--color-black) !important;
    color: #ffffff !important;
    text-align: center !important;
    padding: 60px 24px !important;
    
}
.footer-areas strong {
    display: block !important;
    font-size: 18px !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    
    color: #ffffff !important;
    font-family: 'Playfair Display', serif !important;
    font-weight: 600 !important;
}
.footer-areas {
    max-width: 860px !important;
    margin: 0 auto 32px !important;
    font-size: 14px !important;
    color: rgba(255,255,255,0.7) !important;
    line-height: 2 !important;
}
.footer-areas a {
    color: rgba(255,255,255,0.7) !important;
    text-decoration: none !important;
    margin: 0 4px !important;
}
.footer-areas a:hover { color: #ffffff !important; }
.footer-social {
    display: flex !important;
    justify-content: center !important;
    gap: 32px !important;
    
}
.footer-social a {
    color: rgba(255,255,255,0.85) !important;
    text-decoration: none !important;
    font-size: 16px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}
.footer-copy {
    font-size: 13px !important;
    color: rgba(255,255,255,0.4) !important;
    
}
/* =========================================
   BOTÃO CONSULTORIA (Author Box / WhatsApp)
========================================= */
.btn-consultoria {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background-color: #25D366 !important;
    color: #ffffff !important;
    padding: 12px 28px !important;
    border-radius: 50px !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    text-decoration: none !important;
    
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 12px rgba(37, 211, 102, 0.2) !important;
}
.btn-consultoria:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(37, 211, 102, 0.3) !important;
    text-decoration: none !important;
    color: #ffffff !important;
}
.btn-consultoria i {
    font-size: 18px !important;
    color: #ffffff !important;
}
/* =========================================
   FAQ
========================================= */
.faq-block {  }
.faq-item {
    border: 1px solid var(--color-border) !important;
    border-radius: 6px !important;
    
    overflow: hidden !important;
    background: var(--color-background) !important;
}
.faq-item summary {
    padding: 16px 20px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    color: var(--color-gold) !important;
    list-style: none !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-family: 'Inter', sans-serif !important;
}
.faq-item summary::-webkit-details-marker { display: none !important; }
.faq-item summary::after { content: "+"; font-size: 20px !important; }
details[open] > summary::after { content: "-"; }
.faq-item p { padding: 0 20px 16px !important; margin-bottom: 0 !important; }
/* =========================================
   GLOBAL TYPOGRAPHY & LINKS FIX
========================================= */
body {
    font-family: 'Inter', Arial, sans-serif !important;
}

ul, ol, li {
    font-family: 'Inter', Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
    color: #333333 !important;
}

main ul, main ol {
    
    padding-left: 24px !important;
}

main li {
    
}

/* Base links in main content */
main a {
    color: var(--color-gold) !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}
main a:hover {
    text-decoration: underline !important;
}

/* =========================================
   LEIA TAMBÉM (Internal Links Box)
========================================= */
.leia-tambem {
    margin: 32px 0 !important;
    padding: 16px 20px !important;
    background-color: #fafafa !important;
    border-left: 4px solid var(--color-gold) !important;
    border-radius: 0 6px 6px 0 !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 16px !important;
}
.leia-tambem a {
    color: var(--color-text) !important;
    font-weight: 500 !important;
}
.leia-tambem a:hover {
    color: var(--color-gold) !important;
    text-decoration: none !important;
}
.leia-tambem strong {
    color: var(--color-gold) !important;
    font-family: 'Playfair Display', serif !important;
    font-weight: 600 !important;
    font-size: 17px !important;
    margin-right: 6px !important;
}

/* =========================================
   AUTOR CARD (Responsável Técnico)
========================================= */
.autor-card {
    background-color: #fcfcfc !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 12px !important;
    padding: 30px !important;
    margin: 40px 0 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
}

.autor-info {
    flex: 1 !important;
    min-width: 250px !important;
}

.autor-badge {
    display: inline-block !important;
    background: transparent !important;
    color: var(--color-gold) !important;
    border: 1px solid var(--color-gold) !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
    
}

.autor-card h4 {
    font-family: 'Playfair Display', serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: var(--color-black) !important;
    margin: 0 0 12px 0 !important;
}

.autor-card p {
    font-family: 'Inter', sans-serif !important;
    color: var(--color-text-soft) !important;
    margin: 0 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}

/* FIX: Button specificity so 'main a' doesn't override white text */
main a.btn-consultoria, main .btn-consultoria {
    color: #ffffff !important;
}

/* BTN CONSULTORIA - WhatsApp button on autor-card */
.btn-consultoria {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background-color: #25D366 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 14px 28px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease, transform 0.1s ease !important;
}
.btn-consultoria:hover {
    background-color: #1ebe57 !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    text-decoration: none !important;
}
.btn-consultoria i {
    font-size: 20px !important;
}