/*
 * Duda Flex — Estilos do Single Post
 */

/* ==========================================
   IMAGEM DESTACADA REPETIDA
   ========================================== */
.single-featured-image {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
}

.single-featured-image__inner {
    max-width: 880px;
    margin: 0 auto;
}

.single-featured-image__img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    object-position: center;
}

/* ==========================================
   META / NAV / SHARE — usa .sec__label, .tag, .btn do design system
   ========================================== */
.single-meta__inner {
    max-width: 880px;
    margin: 0 auto;
    padding-bottom: var(--space-lg);
}

.single-share__btn {
    display: inline-flex;
    align-items: center;
    gap: var(--s8);
}

.single-share__btn svg {
    width: var(--s16);
    height: var(--s16);
    stroke-width: var(--stroke-width-sm);
}

.single-nav {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
}

.single-nav__grid {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    max-width: 880px;
    margin: 0 auto;
}

.single-nav__grid .btn-outline {
    display: inline-flex;
    align-items: center;
    gap: var(--s8);
}

.single-nav__grid .btn-outline svg {
    width: var(--s16);
    height: var(--s16);
    stroke-width: var(--stroke-width-sm);
}

/* ==========================================
   RESPONSIVO
   ========================================== */
@media (max-width: 768px) {
    .single-meta__inner {
        justify-content: center;
    }
}