.blog-wrap { max-width: 1100px; margin: 0 auto; padding: 0 8px; }
  .blog-hero { max-width: 760px; padding: 34px 0 22px; text-align: left; }
  .blog-hero h1 {
    font-size: 2rem; font-weight: 700; color: var(--text-1);
    margin: 0 0 10px; line-height: 1.2;
  }
  .blog-hero-accent { color: var(--accent-text, var(--accent)); }
  .blog-hero p {
    font-size: 1rem; color: var(--text-2); margin: 0;
    max-width: 70ch; line-height: 1.6;
  }
  .blog-tabs {
    display: flex; gap: 2px; overflow-x: auto;
    padding: 0; margin-bottom: 24px;
    border-bottom: 1px solid var(--border);
  }
  .blog-tab {
    min-height:44px;display:inline-flex;align-items:center;
    flex-shrink: 0; padding: 8px 12px; border-radius: 7px 7px 0 0;
    border-bottom: 2px solid transparent;
    color: var(--text-2); text-decoration: none;
    font-size: 0.86rem; font-weight: 600;
    transition: color 0.12s, border-color 0.12s;
  }
  .blog-tab:hover { color: var(--text-1); }
  .blog-tab.is-active { color: var(--accent-text, var(--accent)); border-bottom-color: var(--accent); }

  .blog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%,310px), 1fr));
    gap: 18px;
  }
  .blog-card {
    display: block; background: var(--bg-card);
    border: 1px solid var(--border); border-radius: 12px;
    overflow: hidden; text-decoration: none; color: inherit;
    transition: border-color 0.15s;
  }
  .blog-card:hover {
    border-color: var(--accent);
  }
  .blog-card-hero {
    width: 100%; aspect-ratio: 1200/630;
    background: #1F0046;
    margin: 0; overflow: hidden;
  }
  .blog-card-hero img {
    width: 100%; height: 100%; object-fit: cover; display: block;
  }
  .blog-card-body { padding: 16px 18px 18px; }
  .blog-card-meta {
    display: flex; gap: 10px; align-items: center;
    margin-bottom: 8px;
    font-size: 0.78rem; color: var(--text-3);
  }
  .blog-card-cat {
    font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em;
    padding: 0; border-radius: 0;
    background: transparent; color: var(--accent-text, var(--accent));
    text-transform: uppercase;
  }
  .blog-card-cat-reseller { background: transparent; color: var(--teal); }
  .blog-card-cat-educacional { background: transparent; color: var(--warn); }
  .blog-card-cat-gaming { background: transparent; color: var(--accent-text, var(--accent)); }
  .blog-card-title {
    font-size: 1rem; font-weight: 700; color: var(--text-1);
    margin: 0 0 8px; line-height: 1.3;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  .blog-card-excerpt {
    font-size: 0.86rem; color: var(--text-2);
    margin: 0 0 12px; line-height: 1.5;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  }
  .blog-card-cta {
    font-size: 0.84rem; font-weight: 700;
    color: var(--accent-text, var(--accent));
  }

  .blog-empty {
    background: var(--bg-card); border: 1px solid var(--border);
    border-radius: 12px; padding: 32px 24px;
    text-align: left; color: var(--text-2);
  }

  .blog-pagination {
    display: flex; justify-content: space-between; align-items: center;
    gap: 14px; margin: 28px 0 8px;
    padding: 16px 0 0;
    border-top: 1px solid var(--border);
  }
  .blog-pagination a {
    color: var(--accent-text, var(--accent)); font-weight: 600; text-decoration: none;
    font-size: 0.9rem;
  }
  .blog-pagination-info { font-size: 0.85rem; color: var(--text-3); }

  @media (max-width: 640px) {
    .blog-hero { padding: 24px 0 18px; }
    .blog-hero h1 { font-size: 1.5rem; }
    .blog-hero p { font-size: 0.9rem; }
  }

.blog-wrap a:focus-visible { outline:2px solid var(--accent-text); outline-offset:3px; }
.blog-pagination a { display:inline-flex; align-items:center; min-height:44px; }
.blog-card-meta { flex-wrap:wrap; }
@media(prefers-reduced-motion:reduce) { .blog-tab,.blog-card { transition:none; } }