/**
 * /travel-guides/ archive (hero, category pills, featured post, "more
 * guides" panel) and the related-guides block on single-guide.php. Ported
 * from Blog.dc.html. Enqueued conditionally from archive-guide.php and
 * single-guide.php only (depends on 'rnta-shared', which already carries
 * .rnta-archive-grid, .rnta-card, .rnta-cta-band and the .rnta-guide__*
 * single-article shell — this file only adds what those don't cover).
 */

/* =====================================================================
 * Hero band
 * ================================================================== */
.rnta-guides-hero {
  padding: var(--rn-space-72) 0 var(--rn-space-48);
  background: var(--rn-navy);
}
.rnta-guides-hero__inner {
  max-width: 700px;
}
.rnta-guides-hero__eyebrow {
  color: var(--rn-gold);
}
.rnta-guides-hero__title {
  margin: var(--rn-space-14) 0 var(--rn-space-14);
  color: var(--rn-white);
  font-size: var(--rn-fs-44);
  line-height: 1.08;
  letter-spacing: -1.5px;
}
.rnta-guides-hero__lead {
  margin: 0 0 var(--rn-space-22);
  max-width: 560px;
  font-size: var(--rn-fs-17);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.84);
}
.rnta-guides-hero__cats {
  display: flex;
  gap: var(--rn-space-8);
  flex-wrap: wrap;
}
.rnta-guides-hero__cat {
  padding: 9px 15px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: var(--rn-radius-pill);
  color: var(--rn-white);
  font-size: var(--rn-fs-13);
  font-weight: 700;
}
.rnta-guides-hero__cat--accent {
  border-color: transparent;
  background: var(--rn-gold);
  color: var(--rn-navy);
}
@media (max-width: 720px) {
  .rnta-guides-hero {
    padding: var(--rn-space-56) 0 var(--rn-space-32);
  }
  .rnta-guides-hero__title {
    font-size: var(--rn-fs-32);
  }
}

/* =====================================================================
 * Featured post
 * ================================================================== */
.rnta-guides-featured {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  overflow: hidden;
  margin: var(--rn-space-56) 0 0;
  background: var(--rn-white);
  border: 1px solid var(--rn-line);
  border-radius: var(--rn-radius-20);
  box-shadow: var(--rn-shadow-card);
}
.rnta-guides-featured__body {
  display: flex;
  flex-direction: column;
  gap: var(--rn-space-14);
  padding: var(--rn-space-40);
}
.rnta-guides-featured__badge {
  display: inline-flex;
  align-self: flex-start;
  padding: 6px 12px;
  border-radius: var(--rn-radius-pill);
  background: var(--rn-tint-blue);
  color: var(--rn-navy);
  font-family: var(--rn-font-label);
  font-size: var(--rn-fs-11);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.rnta-guides-featured__title {
  margin: 0;
  font-size: var(--rn-fs-32);
  line-height: 1.25;
  letter-spacing: -1.1px;
}
.rnta-guides-featured__excerpt {
  margin: 0;
  font-size: var(--rn-fs-16);
  line-height: 1.6;
}
.rnta-guides-featured__author {
  display: flex;
  align-items: center;
  gap: var(--rn-space-12);
  margin-top: var(--rn-space-4);
}
.rnta-guides-featured__author-initial {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex: none;
  border-radius: var(--rn-radius-pill);
  background: var(--rn-surface-blue);
  color: var(--rn-navy);
  font-size: var(--rn-fs-14);
  font-weight: 800;
}
.rnta-guides-featured__author strong {
  display: block;
  font-size: var(--rn-fs-14);
  color: var(--rn-ink);
}
.rnta-guides-featured__author span span {
  font-size: var(--rn-fs-13);
  color: var(--rn-body);
}
.rnta-guides-featured__link {
  display: inline-flex;
  align-items: center;
  gap: var(--rn-space-8);
  margin-top: var(--rn-space-8);
  font-size: var(--rn-fs-15);
  font-weight: 700;
}
.rnta-guides-featured__media {
  position: relative;
  min-height: 320px;
  background: var(--rn-surface);
}
.rnta-guides-featured__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 1080px) {
  .rnta-guides-featured {
    grid-template-columns: 1fr;
  }
  .rnta-guides-featured__media {
    min-height: 240px;
    order: -1;
  }
}
@media (max-width: 720px) {
  .rnta-guides-featured__body {
    padding: var(--rn-space-26);
  }
  .rnta-guides-featured__title {
    font-size: var(--rn-fs-25);
    line-height: 1.3;
  }
}

/* =====================================================================
 * Grid spacing + "more guides" panel
 * ================================================================== */
.rnta-guides-grid {
  margin-top: var(--rn-space-40);
}
.rnta-guides-more {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rn-space-22);
  flex-wrap: wrap;
  margin-top: var(--rn-space-26);
  padding: var(--rn-space-32) var(--rn-space-32);
  background: rgba(245, 188, 65, 0.1);
  border: 1px dashed rgba(15, 54, 123, 0.2);
  border-radius: var(--rn-radius-16);
}
.rnta-guides-more strong {
  display: block;
  margin-bottom: var(--rn-space-4);
  font-family: var(--rn-font-display);
  font-size: var(--rn-fs-19);
  color: var(--rn-navy);
}
.rnta-guides-more span {
  font-size: var(--rn-fs-15);
  line-height: 1.6;
}
@media (max-width: 720px) {
  .rnta-guides-more {
    padding: var(--rn-space-22);
  }
}

/* =====================================================================
 * WordPress core pagination markup, styled to match .rnta-pagination
 * (dist/css/packages.css) without depending on that file being loaded.
 * ================================================================== */
.pagination,
.navigation.pagination {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rn-space-8);
  margin-top: var(--rn-space-8);
}
.pagination .page-numbers,
.navigation.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 var(--rn-space-12);
  border: 1px solid var(--rn-line);
  border-radius: var(--rn-radius-8);
  color: var(--rn-navy);
  font-size: var(--rn-fs-14);
  font-weight: 700;
}
.pagination .page-numbers.current {
  background: var(--rn-blue);
  border-color: var(--rn-blue);
  color: var(--rn-white);
}
.pagination .page-numbers:not(.current):not(.dots):hover {
  border-color: var(--rn-blue);
  color: var(--rn-blue);
}
.pagination .dots {
  border-color: transparent;
}

/* =====================================================================
 * Related guides (single-guide.php)
 * ================================================================== */
.rnta-guide__related {
  margin: var(--rn-space-56) auto 0;
  padding-top: var(--rn-space-48);
  border-top: 1px solid var(--rn-line);
}
.rnta-guide__related-title {
  margin: 0 0 var(--rn-space-26);
  font-size: var(--rn-fs-28);
  letter-spacing: -0.6px;
}