.page-blog {
    /* Add bg-blog.png to wp-content/themes/bba/images/ to restore the pattern */
    background: url('../../images/bg-blog.png') top center no-repeat, var(--gray500);
}

.page-blog__title-container {
    background: var(--white);
    margin-top: 0;
    padding-top: 4rem;
}

.page-blog__title {
    margin-top: 0;
    margin-bottom: 3.6rem;
}

.page-blog__title header span {
    display: block;
    font-size: 1.5rem;
    color: var(--red100);
    font-weight: 600;
    line-height: 1;
}

.page-blog__item {
    margin-bottom: 3rem;
    display: flex;
    flex-direction: column;
}

.page-blog__item a {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

/* Push date to card bottom regardless of content length */
.page-blog__item .blog-date {
    margin-top: auto;
}

/* Prevent long unbroken strings from overflowing the card */
.page-blog__item h2,
.page-blog__item p {
    overflow-wrap: break-word;
    word-break: break-word;
}

.page-blog__item figure {
    margin: 0 0 3rem 0;
    height: 22.8rem;
    overflow: hidden;
}

.page-blog__item figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-blog__item h2 {
    margin: 0 0 1.5rem 0;
    font-size: 2.5rem;
    line-height: 3rem;
    color: var(--black100);
    font-weight: 600;
}

.page-blog__item p {
    margin: 0 0 1.5rem 0;
    font-family: var(--roboto);
    font-size: 1.6rem;
    line-height: 1.8rem;
    color: var(--gray);
}

.page-blog__item span:not(.blog-cat-label):not(.blog-date) {
    display: block;
    font-size: 1.6rem;
    line-height: 1.8rem;
    color: var(--red100);
    font-weight: 600;
}

.single-blog__title {
    margin-top: 2rem;
}

.single-blog__title a {
    display: block;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--red100);
    margin-bottom: 2rem;
}

.single-blog__title {
    margin-bottom: 3rem;
}

.single-blog__title h1 {
    margin: 0;
    font-size: clamp(2.4rem, 6vw, 4.5rem);
    line-height: 1.15;
    font-weight: 600;
    color: var(--black100);
    overflow-wrap: break-word;
    word-break: break-word;
}

.single-blog__title h1::after {
    content: '';
    display: block;
    width: 10rem;
    height: .4rem;
    background: var(--red100);
    margin-top: .5rem;
}

.single-content {
    overflow-wrap: break-word;
    word-break: break-word;
}

.single-content p {
    margin: 0 0 2.5rem 0;
    font-family: var(--roboto);
    font-size: 1.7rem;
    color: var(--gray);
    line-height: 2.6rem;
}

.single-content div {
    margin: 0 0 2.5rem 0;
    font-family: var(--roboto);
    font-size: 1.7rem;
    color: var(--gray);
    line-height: 2.6rem;
}

.single-content strong {
    font-weight: 700;
}

.single-content a {
    color: var(--red100);
    text-decoration: underline;
}

.single-content h2,
.single-content h3,
.single-content h4,
.single-content h5,
.single-content h6 {
    margin: 0 0 1rem 0;
    line-height: 0.8;
    color: var(--red);
    font-weight: 600;
    font-family: var(--roboto);
}

.single-content h2 {
    font-size: 3rem;
}

.single-content h3 {
    font-size: 2.5rem;
}

.single-content h4 {
    font-size: 2rem;
}

.single-content h5,
.single-content h6 {
    font-size: 1.8rem;
}

.single-content img {
    max-width: 100%;
    height: auto;
    margin-bottom: 2.5rem;
}

.single-content li {
    margin: 0 0 .5rem 0;
    font-family: var(--roboto);
    font-size: 1.7rem;
    color: var(--gray);
    line-height: 2.6rem;
    position: relative;
    padding-left: 4rem;
}

.single-content ul {
    margin-bottom: 2.5rem;
}

.single-content li:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 2.6rem;
    height: 2.6rem;
    background: var(--red100);
    border-radius: .6rem;
    background-image: url("data: image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='h-5 w-5' viewBox='0 0 20 20' fill='%23FFFFFF'><path fill-rule='evenodd' d='M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z' clip-rule='evenodd' /></svg>");
    background-size: 62%;
    background-repeat: no-repeat;
    background-position: center;
}

.single-sidebar .title-sidebar {
    margin: 0 0 3rem 0;
    font-size: 1.5rem;
    line-height: 1.8rem;
    font-weight: 600;
    color: var(--red100);
    border-bottom: .1rem solid var(--gray600);
    padding-bottom: 1.1rem;
}

.single-blog__sidebar-item {
    margin-bottom: 3rem;
}

.single-blog__sidebar-item a {
    display: block;
}

.single-blog__sidebar-item figure {
    margin: 0 0 1rem 0;
    height: 22.8rem;
    overflow: hidden;
}

.single-blog__sidebar-item figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.single-blog__sidebar-item h2 {
    margin: 0;
    font-size: 2.5rem;
    line-height: 3rem;
    color: var(--red100);
    font-weight: 600;
}

/* ── Blog category filter tabs ─────────────────────────────────────────── */

.blog-cats-list {
    list-style: none;
    margin: 0 0 3rem 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.blog-cats-list li a {
    display: inline-block;
    padding: .6rem 1.6rem;
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--red100);
    border: .2rem solid var(--red100);
    border-radius: 10rem;
    text-decoration: none;
    transition: background .2s, color .2s;
}

.blog-cats-list li a:hover,
.blog-cats-list li a.active {
    background: var(--red100);
    color: var(--white);
}

/* ── Category badge on card ─────────────────────────────────────────────── */

.blog-cat-label {
    display: inline-block;
    margin-bottom: 1rem;
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--white);
    background: var(--red100);
    padding: .3rem .9rem;
    border-radius: .4rem;
}

/* ── Post date ──────────────────────────────────────────────────────────── */

.blog-date {
    display: block;
    font-size: 1.3rem;
    color: var(--gray);
    margin-top: .5rem;
}

/* ── Single post: meta bar ─────────────────────────────────────────────── */

.single-blog__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin-top: 1.4rem;
    margin-bottom: 3rem;
    font-size: 1.3rem;
    font-weight: 300;
    color: #8a909e;              /* blue-grey, softer than --gray100 */
    font-family: var(--openSans);
    letter-spacing: .015em;
}

/* Each meta item — icon + text paired with breathing room */
.single-blog__meta span {
    display: inline-flex;
    align-items: center;
    gap: .7rem;                  /* space between icon and its text */
    white-space: nowrap;
    line-height: 1;
}

/* Vertical separator: very faint, purely structural */
.single-blog__meta span + span {
    margin-left: 1.8rem;
    padding-left: 1.8rem;
    border-left: .1rem solid #dde0e8;
}

/* Icons: one shade lighter than the text so they guide, not dominate */
.single-blog__meta .fas {
    font-size: 1.1rem;
    color: #c0c5d0;
    flex-shrink: 0;
}

/* Author link — override .single-blog__title a bleed-in */
.single-blog__meta a {
    display: inline;        /* .single-blog__title a sets display:block */
    font-size: inherit;     /* .single-blog__title a sets 1.6rem        */
    font-weight: 400;       /* .single-blog__title a sets 600           */
    margin-bottom: 0;       /* .single-blog__title a sets 2rem          */
    color: inherit;
    text-decoration: none;
    transition: color .18s;
}

.single-blog__meta a:hover {
    color: var(--red100);
}

/* ── Single post: featured image ──────────────────────────────────────── */

.single-blog__featured {
    margin: 0 0 3.5rem 0;
    border-radius: .6rem;
    overflow: hidden;
}

.single-blog__featured img {
    width: 100%;
    height: auto;
    display: block;
}

/* ── Tags ──────────────────────────────────────────────────────────────── */

.single-tags {
    margin: 3rem 0;
    font-size: 1.4rem;
}

.tag-link {
    display: inline-block;
    margin: .3rem .4rem;
    padding: .4rem 1rem;
    border: .1rem solid var(--red100);
    border-radius: .4rem;
    color: var(--red100);
    font-size: 1.3rem;
    text-decoration: none;
    transition: background .2s, color .2s;
}

.tag-link:hover {
    background: var(--red100);
    color: var(--white);
}

/* ── Post navigation ────────────────────────────────────────────────────── */

.single-blog__nav {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    margin: 3rem 0;
    padding: 2rem 0;
    border-top: .1rem solid var(--gray600, #e0e0e0);
    border-bottom: .1rem solid var(--gray600, #e0e0e0);
    font-size: 1.5rem;
}

.single-blog__nav a {
    color: var(--red100);
    font-weight: 600;
    text-decoration: none;
}

.single-blog__nav a:hover {
    text-decoration: underline;
}

/* ── Pagination ─────────────────────────────────────────────────────────── */

.blog-pagination {
    margin: 4rem 0 2rem 0;
    text-align: center;
}

/* Native the_posts_pagination() output */
.blog-pagination .nav-links {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: .6rem;
}

.blog-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 3.8rem;
    height: 3.8rem;
    padding: 0 1rem;
    border: .1rem solid var(--gray300);
    border-radius: .4rem;
    font-family: var(--openSans);
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--gray);
    text-decoration: none;
    transition: background .18s, border-color .18s, color .18s;
}

.blog-pagination .page-numbers:hover {
    background: var(--gray500);
    border-color: var(--gray200);
    color: var(--blue);
    text-decoration: none;
}

.blog-pagination .page-numbers.current {
    background: var(--red100);
    border-color: var(--red100);
    color: var(--white);
    font-weight: 600;
}

.blog-pagination .page-numbers.dots {
    border-color: transparent;
    background: transparent;
    color: var(--gray100);
    min-width: auto;
    padding: 0 .4rem;
}

.blog-pagination .page-numbers.prev,
.blog-pagination .page-numbers.next {
    font-size: 1.3rem;
    padding: 0 1.4rem;
    color: var(--blue);
    font-weight: 600;
}

/* wp_pagenavi() plugin output — same visual treatment */
.blog-pagination .wp-pagenavi {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: .6rem;
}

.blog-pagination .wp-pagenavi a,
.blog-pagination .wp-pagenavi span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 3.8rem;
    height: 3.8rem;
    padding: 0 1rem;
    border: .1rem solid var(--gray300) !important;
    border-radius: .4rem;
    font-family: var(--openSans);
    font-size: 1.4rem;
    color: var(--gray);
    text-decoration: none;
    transition: background .18s, border-color .18s, color .18s;
}

.blog-pagination .wp-pagenavi a:hover {
    background: var(--gray500);
    border-color: var(--gray200) !important;
    color: var(--blue);
}

.blog-pagination .wp-pagenavi span.current {
    background: var(--red100);
    border-color: var(--red100) !important;
    color: var(--white);
    font-weight: 600;
}

.blog-pagination .wp-pagenavi span.pages {
    border-color: transparent !important;
    background: transparent;
    color: var(--gray100);
    font-size: 1.3rem;
}

/* ── Author bio ─────────────────────────────────────────────────────────── */

.author-bio {
    margin-bottom: 3rem;
}

.author-bio__inner {
    display: flex;
    align-items: flex-start;
    gap: 2rem;
    background: var(--white);
    border-left: .4rem solid var(--red100);
    padding: 2rem;
    border-radius: .4rem;
}

.author-bio__inner img {
    border-radius: 50%;
    flex-shrink: 0;
}

.author-bio__text h2 {
    margin: 0 0 1rem 0;
    font-size: 2rem;
    color: var(--blue);
}

.author-bio__text p {
    margin: 0 0 .5rem 0;
    font-size: 1.5rem;
    color: var(--gray);
}

.author-bio__text a {
    font-size: 1.4rem;
    color: var(--red100);
}

/* ── LGPD consent checkbox ──────────────────────────────────────────────── */

.comment-form-lgpd {
    margin-top: 1.5rem;
}

.lgpd-label {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    font-size: 1.4rem;
    color: var(--gray);
    cursor: pointer;
    line-height: 1.6;
}

.lgpd-label input[type="checkbox"] {
    margin-top: .3rem;
    flex-shrink: 0;
    width: 1.6rem;
    height: 1.6rem;
    accent-color: var(--red100);
}

.lgpd-label a {
    color: var(--red100);
    text-decoration: underline;
}

/* ── LGPD notice (newsletter / thank you page) ──────────────────────────── */

.bba-lgpd-notice {
    background: #f8f8f8;
    border-left: .3rem solid var(--red100);
    padding: 1.2rem 1.6rem;
    border-radius: .4rem;
    font-size: 1.3rem;
    color: var(--gray);
    margin: 2rem 0;
}

.bba-lgpd-notice a {
    color: var(--red100);
    text-decoration: underline;
}

/* ── Breadcrumb ─────────────────────────────────────────────────────────── */

.bba-breadcrumb {
    margin-top: 1rem;
    font-size: 1.3rem;
}

.bba-breadcrumb ol {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.bba-breadcrumb li {
    display: flex;
    align-items: center;
    color: var(--gray100);
}

.bba-breadcrumb li + li::before {
    content: '›';
    margin-right: .4rem;
    color: var(--gray300);
}

.bba-breadcrumb a {
    color: var(--red100);
    text-decoration: none;
}

.bba-breadcrumb a:hover {
    text-decoration: underline;
}

/* ── Thank-you page ─────────────────────────────────────────────────────── */

.thanks-box {
    padding: 6rem 2rem;
    text-align: center;
}

.thanks-icon {
    font-size: 6rem;
    color: var(--red100);
    margin-bottom: 2rem;
}

.thanks-box h2 {
    font-size: 3.5rem;
    color: var(--blue);
    margin-bottom: 1.5rem;
}

.thanks-actions {
    margin-top: 3rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5rem;
}

.thanks-btn {
    display: inline-block;
    padding: 1.2rem 3rem;
    border-radius: .4rem;
    font-size: 1.6rem;
    font-weight: 600;
    text-decoration: none;
    border: .2rem solid var(--red100);
    color: var(--red100);
    transition: background .2s, color .2s;
}

.thanks-btn.btn-primary,
.thanks-btn:hover {
    background: var(--red100);
    color: var(--white);
}

/* ── Header visibility on blog pages ────────────────────────────────────── */
/* The header is position:absolute with white text — on light blog backgrounds
   it becomes invisible. Force a white bar with dark text on all blog pages. */

.post-type-archive-artigo .header,
.single-artigo .header,
.tax-artigo_categoria .header,
.author .header {
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

/* Restore the dark-blue logo block (mirrors .sticky .header-logo) */
.post-type-archive-artigo .header-logo,
.single-artigo .header-logo,
.tax-artigo_categoria .header-logo,
.author .header-logo {
    background: var(--blue);
    position: relative;
}

.post-type-archive-artigo .header-logo::before,
.single-artigo .header-logo::before,
.tax-artigo_categoria .header-logo::before,
.author .header-logo::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: var(--blue);
}

.post-type-archive-artigo .header-menu a,
.single-artigo .header-menu a,
.tax-artigo_categoria .header-menu a,
.author .header-menu a {
    color: var(--blue);
}

.post-type-archive-artigo .header-menu a:hover,
.single-artigo .header-menu a:hover,
.tax-artigo_categoria .header-menu a:hover,
.author .header-menu a:hover {
    color: var(--red100);
}

/* ═══════════════════════════════════════════════════════════════════════════
   COMMENTS — List & Form
   HTML structure (WP default):
   #comments > .comments-title
               ol.comment-list > li.comment >
                 article.comment-body >
                   footer.comment-meta >
                     div.comment-author > img.avatar + b.fn + span.says
                     div.comment-metadata > a > time
                     p.comment-awaiting-moderation   ← inside footer
                   div.comment-content > p
                   div.reply > a.comment-reply-link
   #respond > h3#reply-title + form#commentform
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Single post spacing overrides ─────────────────────────────────────── */
/* .bgbreadcrumb is 33.4rem tall (designed for pages with a big title).     *
 * On single posts the breadcrumb is the only content inside it, so the    *
 * min-height creates a large void. Compact it.                             */

.single-artigo .bgbreadcrumb {
    min-height: 10rem;
    margin-bottom: 0;
}

/* Blog archive + category pages: remove the bottom gap that stacks with
   page-blog__title-container's own top spacing */
.post-type-archive-artigo .bgbreadcrumb,
.tax-artigo_categoria .bgbreadcrumb {
    margin-bottom: 0;
}

/* Container that previously had inline padding-top:4rem */
.single-blog__wrap {
    padding-top: 3rem;
    padding-bottom: 6rem;
}

/* ── Section wrapper ────────────────────────────────────────────────────── */

#comments {
    margin-top: 5rem;
    padding-top: 4rem;
    border-top: .2rem solid var(--gray400);
}

/* ── Section title: "X respostas para …" ───────────────────────────────── */

#comments .comments-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--blue);
    letter-spacing: -.01em;
    margin: 0 0 2.8rem 0;
}

/* ── Comment list resets ────────────────────────────────────────────────── */

.comment-list,
.comment-list .children {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ── Each comment card ──────────────────────────────────────────────────── */

.comment-list > li,
.comment-list .children > li {
    background: var(--white);
    border-radius: .6rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.07);
    padding: 2.4rem;
    margin-bottom: 2rem;
}

/* ── Nested replies ─────────────────────────────────────────────────────── */

.comment-list .children {
    margin-top: 2rem;
    padding-left: 2rem;
    border-left: .3rem solid var(--gray400);
}

/* ── Comment inner article ──────────────────────────────────────────────── */

.comment-body {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

/* ── Header: avatar + name + date ──────────────────────────────────────── */
/*   footer.comment-meta
       div.comment-author   → flex row: [avatar] [name]
       div.comment-metadata → date, indented to align under name          */

.comment-meta {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.comment-author {
    display: flex;
    align-items: center;
    gap: 1.2rem;
}

/* Avatar — circular, crisp edge */
.comment-author .avatar {
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 50%;
    flex-shrink: 0;
    display: block;
    object-fit: cover;
    border: .2rem solid var(--gray400);
}

/* Author name */
.comment-author .fn {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--blue);
    font-style: normal;
}

.comment-author .fn a {
    color: inherit;
    text-decoration: none;
}

/* Hide "disse:" — adds no value in modern UI */
.comment-author .says {
    display: none;
}

/* Date — indented to sit below the name, not the avatar */
.comment-metadata {
    padding-left: 5.6rem; /* 4.4rem avatar + 1.2rem gap */
    font-size: 1.2rem;
    color: var(--gray100);
    margin: 0;
}

.comment-metadata a,
.comment-metadata time {
    color: var(--gray100);
    text-decoration: none;
}

.comment-metadata a:hover {
    color: var(--gray200);
    text-decoration: none;
}

.comment-edit-link {
    margin-left: .8rem;
    font-size: 1.1rem;
    color: var(--gray100);
}

/* Moderation notice — inside footer, indented same as date */
.comment-awaiting-moderation {
    margin-left: 5.6rem;
    display: inline-block;
    padding: .45rem 1rem;
    background: #fffbeb;
    border-left: .25rem solid #f0c040;
    border-radius: .3rem;
    font-size: 1.2rem;
    font-style: italic;
    color: #7a6000;
    margin-top: .2rem;
}

/* ── Comment body text ──────────────────────────────────────────────────── */

.comment-content {
    padding: 0;
}

.comment-content p {
    font-family: var(--openSans);
    font-size: 1.55rem;
    line-height: 2.6rem;
    color: var(--gray);
    margin: 0 0 .8rem 0;
}

.comment-content p:last-child {
    margin-bottom: 0;
}

/* ── Reply button ───────────────────────────────────────────────────────── */

.reply {
    margin-top: .2rem;
}

.comment-reply-link {
    display: inline-block;
    padding: .45rem 1.4rem;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--blue);
    border: .15rem solid var(--gray300);
    border-radius: 10rem;
    text-decoration: none;
    letter-spacing: .02em;
    transition: background .18s, border-color .18s, color .18s;
}

.comment-reply-link:hover {
    background: var(--blue);
    border-color: var(--blue);
    color: var(--white);
    text-decoration: none;
}

/* ═══════════════════════════════════════════════════════════════════════════
   COMMENT FORM
   ═══════════════════════════════════════════════════════════════════════════ */

/* Section title: "Deixe um comentário" */
#reply-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--blue);
    letter-spacing: -.01em;
    margin: 0 0 2.4rem 0;
}

#reply-title small a {
    font-size: 1.3rem;
    font-weight: 400;
    color: var(--gray100);
    text-decoration: none;
    margin-left: 1rem;
}

/* ── Form layout ────────────────────────────────────────────────────────── */

#commentform {
    display: flex;
    flex-direction: column;
    gap: 1.8rem;
}

#commentform p {
    margin: 0;
}

#commentform label {
    display: block;
    font-size: 1.35rem;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: .5rem;
}

#commentform input[type="text"],
#commentform input[type="email"],
#commentform input[type="url"],
#commentform textarea {
    width: 100%;
    padding: 1rem 1.4rem;
    border: .1rem solid var(--gray300);
    border-radius: .4rem;
    font-size: 1.5rem;
    font-family: inherit;
    color: var(--gray);
    background: var(--white);
    transition: border-color .2s, box-shadow .2s;
    appearance: none;
}

#commentform input[type="text"]:focus,
#commentform input[type="email"]:focus,
#commentform input[type="url"]:focus,
#commentform textarea:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 .3rem rgba(24, 29, 77, 0.08);
    outline: none;
}

#commentform textarea {
    min-height: 14rem;
    resize: vertical;
}

/* ── LGPD / cookie checkboxes ───────────────────────────────────────────── */

.comment-form-cookies-consent label,
.comment-form-lgpd label {
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--gray);
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    cursor: pointer;
    line-height: 1.6;
}

.comment-form-cookies-consent input[type="checkbox"],
.comment-form-lgpd input[type="checkbox"] {
    margin-top: .2rem;
    flex-shrink: 0;
    width: 1.6rem;
    height: 1.6rem;
    accent-color: var(--red100);
    cursor: pointer;
}

/* ── Submit button ──────────────────────────────────────────────────────── */

#commentform .form-submit {
    margin: 0;
}

#commentform #submit {
    display: inline-block;
    padding: 1.1rem 3.2rem;
    background: var(--red100);
    color: var(--white);
    font-size: 1.55rem;
    font-weight: 700;
    border: none;
    border-radius: .4rem;
    cursor: pointer;
    font-family: inherit;
    letter-spacing: .02em;
    transition: background .2s;
}

#commentform #submit:hover {
    background: var(--blue);
}

/* ── Helper text ────────────────────────────────────────────────────────── */

.comment-notes {
    font-size: 1.3rem;
    color: var(--gray100);
    margin-bottom: .5rem;
}

/* ── Newsletter page ────────────────────────────────────────────────────── */

.page-newsletter .bgbreadcrumb {
    min-height: 14rem;
}

.newsletter-page__info,
.newsletter-page__form {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.newsletter-page__label {
    display: block;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--red100);
    margin-bottom: 1.2rem;
}

.newsletter-page__title {
    font-size: clamp(2.4rem, 4vw, 3.6rem);
    font-weight: 700;
    color: var(--blue);
    line-height: 1.2;
    margin: 0 0 2rem 0;
}

.newsletter-page__desc {
    font-family: var(--roboto);
    font-size: 1.7rem;
    color: var(--gray);
    line-height: 2.6rem;
    margin: 0 0 2.4rem 0;
}

.newsletter-page__benefits {
    list-style: none;
    margin: 0 0 2.8rem 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.newsletter-page__benefits li {
    font-family: var(--roboto);
    font-size: 1.5rem;
    color: var(--gray);
    padding-left: 2.4rem;
    position: relative;
}

.newsletter-page__benefits li::before {
    content: '';
    position: absolute;
    left: 0;
    top: .5rem;
    width: 1rem;
    height: 1rem;
    background: var(--red100);
    border-radius: 50%;
}

.newsletter-page__lgpd {
    font-size: 1.2rem;
    color: #999;
    line-height: 1.6;
    margin: 0;
}

.newsletter-page__lgpd a {
    color: var(--red100);
}

.newsletter-page__form-box {
    background: var(--gray500);
    border-radius: .8rem;
    padding: 4rem 3.6rem;
    border-top: .4rem solid var(--red100);
}

.newsletter-page__form-title {
    font-size: 2rem;
    font-weight: 700;
    color: var(--blue);
    margin: 0 0 2.8rem 0;
}

/* ── Form fields ── */

.nl-field {
    margin-bottom: 1.8rem;
}

.nl-field label:not(.nl-check-label) {
    display: block;
    font-size: 1.35rem;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: .5rem;
}

.nl-field label span[aria-hidden] {
    color: var(--red100);
    margin-left: .2rem;
}

.nl-field input[type="text"],
.nl-field input[type="email"] {
    width: 100%;
    padding: 1.1rem 1.4rem;
    border: .1rem solid #dde0e8;
    border-radius: .4rem;
    font-size: 1.5rem;
    font-family: inherit;
    color: var(--gray);
    background: var(--white);
    transition: border-color .2s, box-shadow .2s;
    appearance: none;
}

.nl-field input[type="text"]:focus,
.nl-field input[type="email"]:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 .3rem rgba(24, 29, 77, 0.08);
    outline: none;
}

.nl-error {
    display: none;
    font-size: 1.2rem;
    color: var(--red100);
    margin-top: .4rem;
}

.nl-error--global {
    display: block;
    background: #fff3f3;
    border-left: .3rem solid var(--red100);
    padding: 1rem 1.4rem;
    border-radius: .4rem;
    font-size: 1.4rem;
}

/* LGPD checkbox row */
.nl-field--check {
    margin-top: .4rem;
}

.nl-check-label {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    cursor: pointer;
    font-size: 1.3rem;
    color: var(--gray);
    line-height: 1.6;
}

.nl-check-label input[type="checkbox"] {
    margin-top: .25rem;
    flex-shrink: 0;
    width: 1.6rem;
    height: 1.6rem;
    accent-color: var(--red100);
    cursor: pointer;
}

.nl-check-label a {
    color: var(--red100);
    text-decoration: underline;
}

/* Submit button */
.nl-submit {
    display: block;
    width: 100%;
    padding: 1.2rem 2rem;
    background: var(--red100);
    color: var(--white);
    font-size: 1.6rem;
    font-weight: 700;
    border: none;
    border-radius: .4rem;
    cursor: pointer;
    font-family: inherit;
    transition: background .2s;
    margin-top: .8rem;
    text-align: center;
}

.nl-submit:hover:not(:disabled) {
    background: var(--blue);
}

.nl-submit:disabled {
    opacity: .7;
    cursor: not-allowed;
}

@media (max-width: 991px) {
    .newsletter-page__info {
        padding-bottom: 0;
    }
    .newsletter-page__form {
        padding-top: 3rem;
    }
}

/* ── Newsletter CTA banner ──────────────────────────────────────────────── */

.newsletter-cta {
    margin: 0 0 4rem 0;
}

.newsletter-cta__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 2rem;
    background: var(--blue);
    border-radius: .6rem;
    padding: 3.2rem 3.6rem;
}

.newsletter-cta__text span {
    display: block;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--red100);
    margin-bottom: .6rem;
}

.newsletter-cta__text h3 {
    margin: 0;
    font-size: 2.2rem;
    font-weight: 600;
    color: var(--white);
    line-height: 1.3;
}

.newsletter-cta__btn {
    display: inline-block;
    padding: 1.1rem 2.8rem;
    background: var(--red100);
    color: var(--white);
    font-size: 1.5rem;
    font-weight: 700;
    border-radius: .4rem;
    text-decoration: none;
    white-space: nowrap;
    transition: background .2s, transform .15s;
    flex-shrink: 0;
}

.newsletter-cta__btn:hover {
    background: #c72e1f;
    color: var(--white);
    transform: translateY(-.15rem);
    text-decoration: none;
}

/* Single post: reduce top margin since it sits below tags */
.single-blog .newsletter-cta {
    margin-top: 3rem;
}

/* ── Responsive adjustments ─────────────────────────────────────────────── */

@media (max-width: 767px) {
    .single-blog__title h1 {
        font-size: clamp(2.2rem, 7.5vw, 3.2rem);
        hyphens: auto;
        -webkit-hyphens: auto;
        hyphenate-limit-chars: 6 3 3;
    }

    .single-blog__meta {
        flex-direction: column;
        align-items: flex-start;
    }

    .single-blog__meta span + span {
        padding-left: 0;
        margin-left: 0;
        border-left: none;
        padding-top: .3rem;
    }

    .author-bio__inner {
        flex-direction: column;
    }

    .single-blog__nav {
        flex-direction: column;
    }

    .blog-cats-list {
        gap: .6rem;
    }

    .newsletter-cta__inner {
        flex-direction: column;
        align-items: flex-start;
        padding: 2.4rem 2rem;
    }

    .newsletter-cta__text h3 {
        font-size: 1.9rem;
    }

    .newsletter-cta__btn {
        width: 100%;
        text-align: center;
    }

    .comment-list > li,
    .comment-list .children > li {
        padding: 1.8rem;
    }

    .comment-list .children {
        padding-left: 1.2rem;
    }

    .comment-metadata,
    .comment-awaiting-moderation {
        padding-left: 0;
        margin-left: 0;
    }
}



