/* Editorial index: real categories, source excerpts and two quiet reading columns. */
.renew-blog-area { --renew-blog-panel: #fff; --renew-blog-section: #fff; --renew-blog-shadow: none; background: var(--renew-blog-section); }
.renew-blog-area[data-blog-theme="grey-section"] { --renew-blog-section: #f7f8fa; }
.renew-blog-area[data-blog-shadow="soft"] { --renew-blog-shadow: 0 4px 14px rgba(42, 50, 73, .07); }
.renew-breadcrumb-band--blog-selected { background: #fff; }
.renew-blog { padding-block: 48px 80px; }
.renew-blog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.renew-blog .renew-collection-title { margin: 0 0 28px; font-weight: 400; color: #333; text-transform: uppercase; }
.renew-blog .renew-collection-filters { gap: 8px; padding-bottom: 24px; margin-bottom: 32px; border-bottom: 0; }
.renew-blog .renew-collection-filters a {
  padding: 9px 15px;
  border-radius: 999px;
  border-color: #e1e4ed;
  background: #fff;
  font: 500 14px/1.5 var(--renew-body);
}
.renew-blog .renew-collection-filters a:hover { background: #f6f6fc; text-decoration: underline; }
.renew-main .renew-blog .renew-collection-filters a[aria-current="page"] { background: #efeffb; border-color: #cccbe8; color: #413b72; font-weight: 700; }
.renew-blog .renew-content-card { border-color: #e4e7eb; border-radius: 12px; background: #fff; box-shadow: var(--renew-blog-shadow); }
.renew-blog .renew-content-card-image { overflow: hidden; }
/* An outside outline is clipped by the rounded card. Paint a two-tone inset
   over the photo; both dark and light images retain a visible keyboard ring. */
.renew-blog .renew-content-card-image:focus-visible { position: relative; outline: none; }
.renew-blog .renew-content-card-image:focus-visible::after { content: ""; position: absolute; inset: 3px; border: 3px solid var(--renew-blue); box-shadow: 0 0 0 2px #fff; pointer-events: none; }
.renew-blog .renew-content-card-image img { aspect-ratio: 16 / 9; object-fit: cover; }
.renew-blog .renew-content-card-content { padding: 22px 24px; background: var(--renew-blog-panel); }
.renew-blog .renew-content-card-category { font-size: 13px; font-weight: 500; }
.renew-blog .renew-content-card h2 { margin: 10px 0 23px; font: 400 20px/normal Raleway, Verdana, sans-serif; text-transform: uppercase; }
/* Native title values; owner explicitly rejects underlines, including hover. */
.renew-main .renew-blog .renew-content-card h2 a { color: #141d1e; text-decoration: none; }
.renew-main .renew-blog .renew-content-card h2 a:is(:hover, :focus-visible) { color: var(--renew-link); text-decoration: none; }
.renew-blog .renew-content-card-excerpt { font-size: 14px; line-height: 25px; color: #626262; margin-bottom: 22px; }
.renew-blog .renew-content-card-excerpt > :last-child { margin-bottom: 0; }
.renew-blog-cta-sample { margin-top: auto; }
.renew-blog .renew-content-card-more { box-sizing: border-box; display: inline-flex; align-items: center; gap: 8px; min-height: 56px; padding: 0; font-size: 14px; font-weight: 400; text-decoration: none; }
.renew-blog .renew-content-card-more:is(:hover, :focus-visible) { text-decoration: none; }
.renew-blog-more-icon {
  --renew-cta-circle: 32px;
  --renew-cta-scale-x: 1.55;
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: 0 0 64px;
  width: 64px;
  height: 56px;
  color: var(--renew-category-ink, var(--renew-link));
  transition: color 180ms ease;
}
.renew-blog-more-icon::before {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: var(--renew-cta-circle); height: var(--renew-cta-circle);
  box-sizing: border-box;
  border: 1px solid var(--renew-category-ink, #d7e1ec);
  border-radius: 999px;
  background: var(--renew-category-surface, #f3f7fc);
  transform: translate(-50%, -50%);
  transition: width 180ms ease, background-color 180ms ease, opacity 180ms ease;
}
.renew-blog-more-icon svg { position: relative; width: 18px; height: 18px; transition: transform 180ms ease; }
.renew-content-card-more:is(:hover, :focus-visible) .renew-blog-more-icon { color: #fff; }
.renew-content-card-more:is(:hover, :focus-visible) .renew-blog-more-icon::before { background: var(--renew-category-ink, var(--renew-link)); width: calc(var(--renew-cta-circle) * var(--renew-cta-scale-x)); }
.renew-content-card-more:is(:hover, :focus-visible) .renew-blog-more-icon svg { transform: translateX(5px); }
/* Owner-selected capsule: compact44px, dedicated blue independent of category. */
.renew-blog .renew-content-card-more[data-cta-variant="7"] { --renew-cta-ink: #2856b6; --renew-cta-surface: #e9efff; gap: 6px; min-height: 44px; padding-inline: 20px 8px; border-radius: 999px; background: var(--renew-cta-surface); color: var(--renew-cta-ink); font-weight: 400; box-shadow: none; }
.renew-blog-more-label { display: inline-grid; }
/* Invisible bold measurement reserves the native label's width in both states. */
.renew-blog-more-label::after { content: attr(data-label); grid-area: 1 / 1; font-weight: 700; visibility: hidden; pointer-events: none; }
.renew-blog-more-label > span { grid-area: 1 / 1; font-weight: 400; transition: font-weight 280ms ease-in-out; }
.renew-content-card-more[data-cta-variant="7"]:is(:hover, :focus-visible) .renew-blog-more-label > span { font-weight: 700; }
.renew-content-card-more[data-cta-variant="7"] .renew-blog-more-icon { --renew-cta-circle: 28px; --renew-cta-scale-x: 1.6; flex-basis: 52px; width: 52px; height: 44px; color: var(--renew-cta-ink); }
.renew-content-card-more[data-cta-variant="7"] .renew-blog-more-icon::before { border-color: var(--renew-cta-ink); background: var(--renew-cta-surface); transition: width 280ms ease-in-out, background-color 280ms ease-in-out; }
.renew-content-card-more[data-cta-variant="7"] .renew-blog-more-icon,
.renew-content-card-more[data-cta-variant="7"] .renew-blog-more-icon svg { transition-duration: 280ms; transition-timing-function: ease-in-out; }
.renew-content-card-more[data-cta-variant="7"]:is(:hover, :focus-visible) .renew-blog-more-icon { color: #fff; }
.renew-content-card-more[data-cta-variant="7"]:is(:hover, :focus-visible) .renew-blog-more-icon::before { background: var(--renew-cta-ink); }
@media (prefers-reduced-motion: reduce) {
  .renew-blog-more-label > span,
  .renew-content-card-more[data-cta-variant="7"] .renew-blog-more-icon::before { transition: none; }
  .renew-blog-more-icon, .renew-blog-more-icon::before, .renew-blog-more-icon svg { transition: none; }
  .renew-content-card-more:is(:hover, :focus-visible) .renew-blog-more-icon::before { width: var(--renew-cta-circle); }
  .renew-content-card-more:is(:hover, :focus-visible) .renew-blog-more-icon svg { transform: none; }
}
/* Stable category identity; explicit ink/surface pairs selected from reference
   or adapted by Astra. Border alpha20% → solid ink only on hover/focus. */
.renew-blog--category-styles .renew-collection-filters { row-gap: 18px; }
.renew-main .renew-blog--category-styles .renew-collection-filters a,
.renew-main .renew-blog--category-styles .renew-collection-filters a[aria-current="page"] { box-sizing: border-box; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 9px 14px; background: var(--renew-category-surface); color: var(--renew-category-ink); border: 1px solid var(--renew-category-border); font-weight: 500; text-decoration: none; }
.renew-main .renew-blog--category-styles .renew-collection-filters a[aria-current="page"] { position: relative; border-color: var(--renew-category-ink); box-shadow: inset 0 0 0 1px var(--renew-category-ink); }
/* Selection uses the capsule border only; no underline or lower marker. */
.renew-main .renew-blog--category-styles .renew-collection-filters a:is(:hover, :focus-visible) { border-color: var(--renew-category-ink); text-decoration: none; }
.renew-blog--category-styles .renew-content-card-category { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; }
.renew-main .renew-blog--category-styles .renew-content-card-category,
.renew-main .renew-blog--category-styles .renew-content-card-category:is(:hover, :focus-visible) { color: var(--renew-category-ink); text-decoration: none; }
@media (max-width: 767px) { .renew-blog-grid { grid-template-columns: minmax(0, 1fr); } }
