/* ============================================
   QUOTE SECTION
   ============================================ */

.quote {
    font-size: 0.95rem;
    font-style: italic;
    opacity: 0.9;
    margin: 1.25rem auto;
    max-width: 550px;
    position: relative;
    animation: fadeIn 1s ease-out 0.7s both;
}

.quote-loading {
    display: none;
    font-size: 0.9rem;
    opacity: 0.6;
    text-align: center;
}

.quote-loading::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid var(--accent-primary);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-right: var(--spacing-sm);
    vertical-align: middle;
}

.quote[aria-busy="true"] .quote-loading {
    display: block;
}

.quote[aria-busy="true"] q,
.quote[aria-busy="true"] .quote-author,
.quote[aria-busy="true"] .quote-source {
    display: none;
}

.quote-author {
    font-size: 0.9rem;
    font-weight: 600;
    opacity: 0.7;
    margin-top: var(--spacing-sm);
    text-align: right;
    color: var(--accent-primary);
}

.quote-source {
    font-size: 0.8rem;
    font-weight: 400;
    opacity: 0.6;
    margin-top: var(--spacing-xs);
    text-align: right;
    color: var(--text-secondary);
}