/* ============================================================
   OFICIAL GEEK — single.css
   Template de post individual
   ============================================================ */

/* ── Wrapper do artigo ─────────────────────────────────────── */
.ogc-single {
  background: var(--og-bg);
  padding-bottom: 64px;
}

/* ── Breadcrumb ────────────────────────────────────────────── */
.ogc-breadcrumb {
  background: var(--og-surface);
  border-bottom: 1px solid var(--og-border);
}

.ogc-breadcrumb__inner {
  max-width: var(--og-max-width);
  margin: 0 auto;
  padding: 10px 20px;
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--og-font);
  font-size: var(--og-fs-xs);
  color: var(--og-text-muted);
}

.ogc-breadcrumb a {
  color: var(--og-text-muted);
  text-decoration: none;
  transition: color .15s;
}
.ogc-breadcrumb a:hover { color: var(--og-text-1); }

.ogc-breadcrumb__sep {
  color: var(--og-border-strong);
  font-size: 10px;
}

.ogc-breadcrumb__current {
  color: var(--og-text-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 260px;
}

/* ── Cabeçalho do artigo ───────────────────────────────────── */
.ogc-article-header {
  max-width: var(--og-content-width);
  margin: 0 auto;
  padding: 36px 20px 0;
}

.ogc-article-header__cat {
  margin-bottom: 14px;
}

.ogc-article-header__title {
  font-family: var(--og-font) !important;
  font-size: var(--og-fs-3xl) !important;
  font-weight: var(--og-fw-black) !important;
  line-height: 1.18 !important;
  letter-spacing: -0.03em !important;
  color: var(--og-text-1) !important;
  margin: 0 0 20px !important;
}

/* ── Meta linha ────────────────────────────────────────────── */
.ogc-article-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  padding: 14px 0;
  border-top: 1px solid var(--og-border);
  border-bottom: 1px solid var(--og-border);
  margin-bottom: 28px;
}

.ogc-article-meta__author {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ogc-article-meta__avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--og-border);
  flex-shrink: 0;
}

.ogc-article-meta__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ogc-article-meta__author-name {
  font-family: var(--og-font);
  font-size: var(--og-fs-xs);
  font-weight: var(--og-fw-semibold);
  color: var(--og-text-1);
  text-decoration: none;
}
.ogc-article-meta__author-name:hover { color: var(--og-black); }

.ogc-article-meta__dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--og-text-muted);
  flex-shrink: 0;
}

.ogc-article-meta__date,
.ogc-article-meta__reading {
  font-family: var(--og-font);
  font-size: var(--og-fs-xs);
  color: var(--og-text-muted);
}

/* ── Imagem destaque ───────────────────────────────────────── */
.ogc-article-image {
  max-width: 820px;
  margin: 0 auto 32px;
  padding: 0 20px;
}

.ogc-article-image img,
.ogc-article-image .wp-post-image {
  width: 100% !important;
  height: auto !important;
  max-height: 480px !important;
  object-fit: cover !important;
  border-radius: var(--og-r-md) !important;
  display: block !important;
}

.ogc-article-image__caption {
  font-family: var(--og-font);
  font-size: var(--og-fs-xs);
  color: var(--og-text-muted);
  text-align: center;
  margin-top: 8px;
  font-style: italic;
}

/* ── Corpo do artigo ───────────────────────────────────────── */
.ogc-article-body {
  max-width: var(--og-content-width);
  margin: 0 auto;
  padding: 0 20px;
}

/* Lead / primeiro parágrafo com destaque */
.ogc-article-body .entry-content > p:first-of-type {
  font-family: var(--og-font-read) !important;
  font-size: 18px !important;
  line-height: 1.72 !important;
  color: var(--og-text-1) !important;
  font-weight: 400 !important;
  letter-spacing: .005em !important;
  margin-bottom: 24px !important;
}

/* Inline images dentro do conteúdo */
.ogc-article-body .entry-content figure {
  margin: 28px 0 !important;
}

.ogc-article-body .entry-content figure img {
  width: 100% !important;
  height: auto !important;
  border-radius: var(--og-r-md) !important;
}

.ogc-article-body .entry-content figcaption {
  font-family: var(--og-font) !important;
  font-size: var(--og-fs-xs) !important;
  color: var(--og-text-muted) !important;
  text-align: center !important;
  margin-top: 8px !important;
  font-style: italic !important;
}

/* ── Tags do post ──────────────────────────────────────────── */
.ogc-article-tags {
  max-width: var(--og-content-width);
  margin: 28px auto 0;
  padding: 20px 20px 0;
  border-top: 1px solid var(--og-border);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.ogc-article-tags__label {
  font-family: var(--og-font);
  font-size: var(--og-fs-xs);
  font-weight: var(--og-fw-bold);
  text-transform: uppercase;
  letter-spacing: var(--og-ls-wider);
  color: var(--og-text-muted);
  margin-right: 4px;
}

.ogc-article-tags a {
  font-family: var(--og-font);
  font-size: var(--og-fs-xs);
  font-weight: var(--og-fw-medium);
  color: var(--og-text-3);
  background: var(--og-surface);
  border: 1px solid var(--og-border-strong);
  padding: 3px 10px;
  border-radius: 99px;
  text-decoration: none;
  transition: all .15s;
}
.ogc-article-tags a:hover {
  border-color: var(--og-yellow);
  color: var(--og-text-1);
}

/* ── Bio do autor ──────────────────────────────────────────── */
.ogc-author-bio {
  max-width: var(--og-content-width);
  margin: 32px auto 0;
  padding: 20px;
  background: var(--og-surface);
  border: 1px solid var(--og-border);
  border-radius: var(--og-r-md);
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.ogc-author-bio__avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--og-bg);
}

.ogc-author-bio__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ogc-author-bio__info {}

.ogc-author-bio__label {
  font-family: var(--og-font);
  font-size: var(--og-fs-2xs);
  font-weight: var(--og-fw-black);
  text-transform: uppercase;
  letter-spacing: var(--og-ls-wider);
  color: var(--og-text-muted);
  margin-bottom: 2px;
}

.ogc-author-bio__name {
  font-family: var(--og-font);
  font-size: var(--og-fs-base);
  font-weight: var(--og-fw-bold);
  color: var(--og-text-1);
  margin-bottom: 6px;
}

.ogc-author-bio__desc {
  font-family: var(--og-font);
  font-size: var(--og-fs-sm);
  line-height: var(--og-lh-normal);
  color: var(--og-text-3);
  margin: 0;
}

/* ── Navegação anterior/próximo ────────────────────────────── */
.ogc-post-nav {
  max-width: var(--og-content-width);
  margin: 32px auto 0;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.ogc-post-nav__item {
  background: var(--og-surface);
  border: 1px solid var(--og-border);
  border-radius: var(--og-r-md);
  padding: 14px 16px;
  text-decoration: none;
  transition: border-color .15s, box-shadow .15s;
  display: block;
}

.ogc-post-nav__item:hover {
  border-color: var(--og-yellow);
  box-shadow: var(--og-shadow-sm);
}

.ogc-post-nav__item--prev { text-align: left; }
.ogc-post-nav__item--next { text-align: right; }

.ogc-post-nav__dir {
  font-family: var(--og-font);
  font-size: var(--og-fs-2xs);
  font-weight: var(--og-fw-bold);
  text-transform: uppercase;
  letter-spacing: var(--og-ls-wider);
  color: var(--og-text-muted);
  margin-bottom: 4px;
}

.ogc-post-nav__title {
  font-family: var(--og-font);
  font-size: var(--og-fs-sm);
  font-weight: var(--og-fw-semibold);
  line-height: var(--og-lh-snug);
  color: var(--og-text-1);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── Posts relacionados ────────────────────────────────────── */
.ogc-related {
  background: var(--og-bg);
  padding: 40px 0 48px;
  margin-top: 48px;
  border-top: 2px solid var(--og-border);
}

.ogc-related__wrap {
  max-width: var(--og-max-width);
  margin: 0 auto;
  padding: 0 20px;
}

.ogc-related__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--og-yellow);
  margin-bottom: 20px;
}

.ogc-related__title {
  font-family: var(--og-font) !important;
  font-size: var(--og-fs-sm) !important;
  font-weight: var(--og-fw-black) !important;
  text-transform: uppercase !important;
  letter-spacing: var(--og-ls-wider) !important;
  color: var(--og-text-1) !important;
  margin: 0 !important;
}

.ogc-related__link {
  font-family: var(--og-font);
  font-size: var(--og-fs-xs);
  color: var(--og-text-muted);
  text-decoration: none;
  transition: color .15s;
}
.ogc-related__link:hover { color: var(--og-text-1); }

.ogc-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

/* ── Comentários ───────────────────────────────────────────── */
.ogc-comments {
  max-width: var(--og-content-width);
  margin: 48px auto 0;
  padding: 0 20px;
}

.ogc-comments .comments-title,
.ogc-comments #reply-title,
.ogc-comments .comment-reply-title {
  font-family: var(--og-font) !important;
  font-size: var(--og-fs-sm) !important;
  font-weight: var(--og-fw-black) !important;
  text-transform: uppercase !important;
  letter-spacing: var(--og-ls-wider) !important;
  color: var(--og-text-1) !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid var(--og-yellow) !important;
  margin-bottom: 20px !important;
}

/* ── Responsivo ────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ogc-article-header { padding-top: 24px; }

  .ogc-article-header__title {
    font-size: clamp(22px, 6vw, 28px) !important;
  }

  .ogc-related__grid { grid-template-columns: 1fr; }

  .ogc-post-nav { grid-template-columns: 1fr; }
  .ogc-post-nav__item--next { text-align: left; }

  .ogc-author-bio { flex-direction: column; }
  .ogc-author-bio__avatar { width: 44px; height: 44px; }

  .ogc-article-body .entry-content > p:first-of-type {
    font-size: 17px !important;
  }
}

@media (max-width: 480px) {
  .ogc-article-header { padding-top: 20px; }
  .ogc-related__grid  { grid-template-columns: 1fr; }

  /* Padding lateral reduzido para mais espaço de leitura */
  .ogc-article-image,
  .ogc-article-body,
  .ogc-article-tags,
  .ogc-post-nav,
  .ogc-comments { padding-left: 14px; padding-right: 14px; }

  .ogc-author-bio { padding: 14px; }

  /* Breadcrumb: título atual se ajusta ao espaço disponível */
  .ogc-breadcrumb__current {
    flex: 1;
    min-width: 0;
    max-width: none;
  }

  /* Lead menor em telas muito pequenas */
  .ogc-article-body .entry-content > p:first-of-type {
    font-size: 16px !important;
  }
}