/**
 * Artigos Turbinados — FAQ no front-end.
 * Tipografia: Fraunces (display) para perguntas/título, Inter para o corpo.
 * Degrada com elegância para a fonte do tema se o Google Fonts estiver desligado.
 */

.at-faq {
    --at-faq-ink:    #1a1c22;
    --at-faq-body:   #3f434d;
    --at-faq-muted:  #8a9099;
    --at-faq-line:   #e8e9ee;
    --at-faq-accent: #2f6bff;
    --at-faq-soft:   #f7f8fb;

    margin: 48px 0 8px;
    padding-top: 28px;
    border-top: 1px solid var(--at-faq-line);
}

.at-faq-title {
    font-family: "Fraunces", Georgia, "Times New Roman", serif;
    font-weight: 600;
    font-size: clamp(24px, 3vw, 32px);
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: var(--at-faq-ink);
    margin: 0 0 24px;
}

.at-faq-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.at-faq-item {
    border: 1px solid var(--at-faq-line);
    border-radius: 14px;
    background: #fff;
    padding: 4px 20px;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.at-faq-item:hover {
    border-color: #d3d7e2;
    box-shadow: 0 4px 18px rgba(26, 28, 34, .05);
}
.at-faq-item[open] {
    border-color: #cdd6f0;
    box-shadow: 0 6px 24px rgba(47, 107, 255, .07);
}

.at-faq-q {
    font-family: "Fraunces", Georgia, serif;
    font-weight: 600;
    font-size: clamp(17px, 1.7vw, 20px);
    line-height: 1.4;
    color: var(--at-faq-ink);
    cursor: pointer;
    list-style: none;
    padding: 16px 34px 16px 0;
    position: relative;
    user-select: none;
}
.at-faq-q::-webkit-details-marker { display: none; }

/* Sinal de abrir/fechar desenhado em CSS (sem imagem, sem JS) */
.at-faq-q::after {
    content: "";
    position: absolute;
    right: 2px;
    top: 50%;
    width: 11px;
    height: 11px;
    border-right: 2px solid var(--at-faq-accent);
    border-bottom: 2px solid var(--at-faq-accent);
    transform: translateY(-70%) rotate(45deg);
    transition: transform .2s ease;
}
.at-faq-item[open] .at-faq-q::after {
    transform: translateY(-30%) rotate(-135deg);
}

.at-faq-a {
    font-family: "Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.7;
    color: var(--at-faq-body);
    padding: 0 0 18px;
    animation: at-faq-fade .28s ease;
}
@keyframes at-faq-fade {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.at-faq-a p { margin: 0 0 14px; }
.at-faq-a p:last-child { margin-bottom: 0; }

.at-faq-a ul,
.at-faq-a ol {
    margin: 12px 0 16px;
    padding-left: 22px;
}
.at-faq-a li {
    margin-bottom: 8px;
    line-height: 1.6;
}
.at-faq-a li::marker { color: var(--at-faq-accent); }

.at-faq-a strong { color: var(--at-faq-ink); font-weight: 600; }
.at-faq-a a { color: var(--at-faq-accent); text-decoration: underline; text-underline-offset: 2px; }

/* Acessibilidade: foco de teclado visível */
.at-faq-q:focus-visible {
    outline: 2px solid var(--at-faq-accent);
    outline-offset: 3px;
    border-radius: 4px;
}

@media (prefers-reduced-motion: reduce) {
    .at-faq-item, .at-faq-q::after, .at-faq-a { transition: none; animation: none; }
}

/* Modo escuro, se o tema usar */
@media (prefers-color-scheme: dark) {
    .at-faq {
        --at-faq-ink: #f0f1f4;
        --at-faq-body: #c3c7d0;
        --at-faq-line: #2a2d36;
        --at-faq-soft: #1c1e25;
    }
    .at-faq-item { background: #16181e; }
    .at-faq-item:hover { border-color: #3a3e4a; }
}