﻿*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{
    background:#0a0f1a;
    color:#e2e8f0;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    min-height:100vh;line-height:1.6
}
.container{max-width:1200px;margin:0 auto;padding:0 16px}

/* ===== HEADER ===== */
.header{text-align:center;padding:20px 16px;border-bottom:1px solid #1e293b;margin-bottom:24px}
.header-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:10px}
.logo{font-size:24px;font-weight:700;color:#f1f5f9}
.logo span{color:#3b82f6}
.logo a{color:inherit;text-decoration:none}

/* ===== SELETOR DE IDIOMA ===== */
.lang-selector select,.lang-mini select{
    background:#1e293b;color:#e2e8f0;border:1px solid #334155;
    padding:8px 12px;border-radius:8px;font-size:12px;cursor:pointer
}
.lang-selector select:focus,.lang-mini select:focus{outline:none;border-color:#3b82f6}
.lang-selector select option,.lang-mini select option{background:#0f172a;color:#e2e8f0}
.lang-inline{display:flex;justify-content:center;gap:4px;flex-wrap:wrap;margin-bottom:24px}
.lang-inline a{
    color:#475569;text-decoration:none;padding:6px 12px;border-radius:8px;
    font-size:13px;transition:all 0.2s;border:1px solid transparent
}
.lang-inline a:hover{color:#60a5fa;border-color:#3b82f6;background:#1e293b}
.lang-inline a.ativo{color:#60a5fa;border-color:#3b82f6;background:rgba(59,130,246,0.1)}

/* ===== SEARCH BAR ===== */
.search-bar{
    display:flex;gap:10px;background:#1e293b;border-radius:16px;
    padding:6px 16px;border:1px solid #334155;max-width:600px;
    margin:14px auto 20px;transition:all 0.3s
}
.search-bar:focus-within{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,0.15)}
.search-bar input{
    flex:1;background:transparent;border:none;color:#f1f5f9;
    font-size:16px;padding:16px 0;outline:none;min-width:0
}
.search-bar input::placeholder{color:#475569}
.search-bar button{
    background:#3b82f6;color:#fff;border:none;padding:10px 24px;
    border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;white-space:nowrap
}
.search-bar button:hover{background:#2563eb}

/* ===== HOME ===== */
.home-body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px}
.home-container{text-align:center;max-width:650px;width:100%}
.home-logo{font-size:clamp(40px,10vw,64px);font-weight:700;color:#f1f5f9;letter-spacing:2px;margin-bottom:6px}
.home-logo span{color:#3b82f6;text-shadow:0 0 30px rgba(59,130,246,0.3)}
.tagline{color:#64748b;font-size:14px;margin-bottom:24px;letter-spacing:1px}
.stats-mini{color:#475569;font-size:13px;margin-bottom:32px;letter-spacing:1px}
.stats-mini strong{color:#64748b}

/* ===== FRASE ===== */
.frase-box{margin-bottom:48px}
.frase-texto{color:#60a5fa;font-size:16px;font-style:italic;line-height:1.6}
.frase-autor{color:#475569;font-size:12px;margin-top:6px}

/* ===== TÍTULO E STATS ===== */
.titulo-pagina{font-size:clamp(22px,4vw,32px);font-weight:700;color:#f1f5f9;text-align:center;margin-bottom:6px}
.stats-linha{text-align:center;color:#64748b;font-size:13px;margin-bottom:20px}
.stats-linha strong{color:#94a3b8}
.paragrafo{color:#94a3b8;max-width:750px;margin:0 auto 28px;text-align:center;font-size:14px;line-height:1.7}

/* ===== WIKIPEDIA ===== */
.wikipedia-box{
    background:#0f172a;border:1px solid #1e293b;border-radius:12px;
    padding:16px 20px;margin-bottom:28px;max-width:750px;margin-left:auto;margin-right:auto
}
.wikipedia-box .wiki-titulo{font-size:14px;font-weight:600;color:#94a3b8;margin-bottom:6px}
.wikipedia-box .wiki-texto{color:#94a3b8;font-size:13px;line-height:1.7;margin-bottom:8px}
.wikipedia-box .wiki-link{color:#60a5fa;font-size:12px;text-decoration:none}
.wikipedia-box .wiki-link:hover{text-decoration:underline}

/* ===== CARDS ===== */
.grid-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:32px}
.card{background:#0f172a;border:1px solid #1e293b;border-radius:12px;padding:14px 16px;transition:all 0.2s}
.card:hover{border-color:#3b82f6}
.card-titulo{font-size:13px;font-weight:600;color:#94a3b8;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid #1e293b}
.card-body{display:flex;flex-direction:column;gap:2px}
.card-body a{
    display:flex;align-items:center;gap:8px;color:#60a5fa;text-decoration:none;
    padding:4px 6px;border-radius:6px;font-size:11px;transition:all 0.15s;border:1px solid transparent
}
.card-body a:hover{background:#1e293b;border-color:#3b82f6;color:#93c5fd;padding-left:10px}
.card-body a img{width:14px;height:14px;border-radius:2px;flex-shrink:0}

/* ===== COMPARTILHAR ===== */
.share-bloco{text-align:center;margin:32px 0}
.share-label{color:#94a3b8;font-size:14px;margin-bottom:10px}
.share-area{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
.share-btn{
    background:#1e293b;border:1px solid #334155;color:#94a3b8;
    padding:6px 14px;border-radius:20px;font-size:12px;cursor:pointer;
    text-decoration:none;transition:all 0.2s
}
.share-btn:hover{background:#1e3a5f;color:#60a5fa;border-color:#3b82f6}

/* ===== COMENTÁRIOS ===== */
.comentarios{padding-top:24px;border-top:1px solid #1e293b}
.comentarios h2{color:#f1f5f9;margin-bottom:16px;font-size:20px}
.comentario-item{background:#0f172a;border:1px solid #1e293b;border-radius:8px;padding:12px 16px;margin-bottom:10px}
.comentario-item .nome{font-weight:600;color:#60a5fa;font-size:13px}
.comentario-item .data{font-size:10px;color:#475569;margin-left:8px}
.comentario-item .texto{color:#cbd5e1;font-size:13px;margin-top:4px}
.comentario-item .acoes{margin-top:8px;display:flex;gap:10px;align-items:center}
.respostas{margin-left:32px;border-left:2px solid #1e293b;padding-left:12px;margin-top:8px}
.resposta-item{background:#0f172a;border:1px solid #1e293b;border-radius:8px;padding:10px 14px;margin-bottom:8px}
.resposta-item .nome{font-weight:600;color:#60a5fa;font-size:12px}
.resposta-item .data{font-size:9px;color:#475569;margin-left:6px}
.resposta-item .texto{color:#cbd5e1;font-size:12px;margin-top:3px}
.resposta-item .acoes{margin-top:6px;display:flex;gap:8px;align-items:center}
.responder-link{color:#94a3b8;font-size:11px;text-decoration:none}
.responder-link:hover{color:#60a5fa}
.responder-form{background:#0f172a;border:1px solid #3b82f6;border-radius:8px;padding:14px;margin-top:8px;margin-left:32px}
.responder-form input,.responder-form textarea{
    width:100%;background:#1e293b;border:1px solid #334155;border-radius:8px;
    padding:8px;color:#f1f5f9;margin-bottom:6px;font-family:inherit;font-size:13px
}
.responder-form button{background:#3b82f6;color:#fff;border:none;padding:8px 18px;border-radius:8px;cursor:pointer;font-weight:600;font-size:13px}
.respondendo-info{color:#60a5fa;font-size:11px;margin-bottom:6px}
.comentario-form{margin-top:20px}
.comentario-form input,.comentario-form textarea{
    width:100%;background:#1e293b;border:1px solid #334155;border-radius:8px;
    padding:10px;color:#f1f5f9;margin-bottom:8px;font-family:inherit;font-size:14px
}
.comentario-form input::placeholder,.comentario-form textarea::placeholder{color:#64748b}
.comentario-form button{background:#3b82f6;color:#fff;border:none;padding:10px 24px;border-radius:8px;cursor:pointer;font-weight:600}
.sem-comentarios{color:#64748b;font-size:14px;margin-bottom:16px}
.honeypot{position:absolute;left:-9999px;opacity:0}

/* ===== LIKE ===== */
.like-btn{
    display:inline-flex;align-items:center;gap:6px;background:transparent;
    border:1px solid #334155;color:#94a3b8;padding:3px 10px;border-radius:20px;
    cursor:pointer;font-size:11px;transition:all 0.2s
}
.like-btn:hover{border-color:#ef4444;color:#f87171;background:rgba(239,68,68,0.08)}
.like-btn.liked{border-color:#ef4444;color:#ef4444;background:rgba(239,68,68,0.12)}
.like-btn .heart{display:inline-block;font-size:14px}
.like-btn .like-count{font-weight:600;font-size:11px}

/* ===== RELACIONADAS ===== */
.relacionadas{margin-top:32px;padding-top:20px;border-top:1px solid #1e293b}
.relacionadas h3{color:#94a3b8;font-size:14px;margin-bottom:10px}
.relacionadas a{display:inline-block;color:#60a5fa;text-decoration:none;margin:3px 8px;font-size:13px}
.relacionadas a:hover{color:#93c5fd}

/* ===== FOOTER ===== */
.footer{margin-top:40px;padding-top:20px;border-top:1px solid #1e293b;text-align:center;font-size:13px;color:#94a3b8;line-height:1.8}
.footer a{color:#60a5fa;text-decoration:none}
.footer a:hover{text-decoration:underline}
.footer-links{font-size:12px;color:#475569}
.footer-links a{color:#475569;text-decoration:none;margin:0 8px;transition:color 0.2s}
.footer-links a:hover{color:#60a5fa}
.footer-copy{font-size:10px;color:#334155;margin-top:12px}

/* ===== RESPONSIVO ===== */
@media(max-width:1024px){.grid-cards{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){
    .grid-cards{grid-template-columns:1fr 1fr}
    .search-bar{flex-wrap:wrap;padding:8px 12px}
    .search-bar input{width:100%;padding:12px 0;font-size:16px}
    .search-bar button{width:100%;padding:10px}
    .respostas{margin-left:16px}
    .lang-inline{gap:2px}
    .lang-inline a{padding:4px 8px;font-size:11px}
}
@media(max-width:480px){
    .grid-cards{grid-template-columns:1fr}
    .respostas{margin-left:8px}
    .header-top{justify-content:center}
    .home-logo{font-size:36px}
}