/* Presentación común para las guías Blue Team añadidas con plantillas heredadas.
   Mantiene la jerarquía visual de los artículos del blog y normaliza sus anchos. */
body.blue-team-article main {
  min-width: 0;
}

/* Enlaces de salto: disponibles al navegar con teclado, discretos en reposo. */
body.blue-team-article .skip-link:not(:focus):not(:focus-visible) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

body.blue-team-article .skip-link:focus,
body.blue-team-article .skip-link:focus-visible {
  position: fixed;
  z-index: 10000;
  top: var(--sp-3);
  left: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border: 2px solid var(--brand-blue);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow-md);
}

body.blue-team-article main > .article-container {
  box-sizing: border-box;
  width: min(100%, 1160px);
  margin-inline: auto;
  padding-inline: var(--sp-5);
}

body.blue-team-article main :is(.post-hero, .article-hero, .article-header) {
  box-sizing: border-box;
  width: min(calc(100% - var(--sp-5) - var(--sp-5)), 840px);
  margin-inline: auto;
  padding-block: var(--sp-8) var(--sp-5);
}

body.blue-team-article main :is(.post-hero h1, .article-title) {
  max-width: 24ch;
  margin-block: var(--sp-4);
  color: var(--text);
  font-family: var(--font-display);
  font-size: clamp(2rem, 4.5vw, var(--fs-3xl));
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.03em;
  text-wrap: balance;
}

body.blue-team-article main :is(.post-hero-lead, .article-lead, .lead) {
  max-width: 68ch;
  margin-block: var(--sp-4) var(--sp-6);
  color: var(--text-muted);
  font-size: var(--fs-md);
  line-height: var(--lh-relaxed);
}

body.blue-team-article main :is(.post-hero-meta, .article-meta, .article-meta-header, .article-meta-top, .article-meta-bottom) {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-3);
  color: var(--text-subtle);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  line-height: 1.6;
}

body.blue-team-article main :is(.breadcrumbs, .breadcrumb, .breadcrumb-nav) {
  margin-block-end: var(--sp-5);
  color: var(--text-subtle);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
}

body.blue-team-article main :is(.breadcrumbs ol, .breadcrumb ol, .breadcrumb-list) {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

body.blue-team-article main :is(.article-featured-image-wrapper, .article-featured-image, .article-featured-figure, .post-featured-image-box, .post-featured-img) {
  box-sizing: border-box;
  width: min(calc(100% - var(--sp-5) - var(--sp-5)), 840px);
  height: auto;
  margin: var(--sp-4) auto var(--sp-8);
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface-2);
  box-shadow: var(--shadow-md);
}

body.blue-team-article main :is(.article-featured-image-wrapper, .article-featured-image, .article-featured-figure, .post-featured-image-box, .post-featured-img) img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

body.blue-team-article main :is(.article-featured-image-wrapper, .article-featured-image, .article-featured-figure, .post-featured-image-box, .post-featured-img) figcaption,
body.blue-team-article main :is(.article-featured-image-wrapper, .article-featured-image, .article-featured-figure, .post-featured-image-box, .post-featured-img) .post-featured-caption {
  padding: var(--sp-2) var(--sp-4);
  border-top: 1px solid var(--border);
  color: var(--text-muted);
  font-size: var(--fs-xs);
  line-height: var(--lh-relaxed);
  text-align: center;
}

body.blue-team-article main :is(.article-content, .article-body, .post-content, .article-reading-content) {
  box-sizing: border-box;
  width: min(calc(100% - var(--sp-5) - var(--sp-5)), 840px);
  margin-inline: auto;
  color: var(--text);
  font-size: var(--fs-md);
  line-height: var(--lh-relaxed);
}

body.blue-team-article main :is(.article-content, .article-body, .post-content, .article-reading-content) :is(img, video, iframe) {
  max-width: 100%;
}

body.blue-team-article main :is(.toc-hero, .related-cursos, .share-box, .instructor-card, .author-box) {
  box-sizing: border-box;
  width: min(calc(100% - var(--sp-5) - var(--sp-5)), 840px);
  margin-inline: auto;
}

body.blue-team-article main :is(.article-content, .article-body, .post-content, .article-reading-content) :is(pre, .table-container, .table-responsive, .data-table-wrapper, .rule-table-wrap, .arch-diagram, .tree-box) {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

body.blue-team-article main table {
  max-width: 100%;
}

body.blue-team-article main :is(.article-content, .article-body, .post-content, .article-reading-content) :is(p, li, a, code) {
  overflow-wrap: anywhere;
}

@media (max-width: 640px) {
  body.blue-team-article main :is(.post-hero, .article-hero, .article-header) {
    padding-block: var(--sp-6) var(--sp-4);
  }

  body.blue-team-article main :is(.post-hero h1, .article-title) {
    font-size: clamp(1.8rem, 8vw, 2.35rem);
  }

  body.blue-team-article main :is(.article-featured-image-wrapper, .article-featured-image, .article-featured-figure, .post-featured-image-box, .post-featured-img) {
    border-radius: var(--radius-md);
  }
}