.guides-index,
.article-shell { --max: 1040px; }

.guides-index h1,
.article-header h1 { max-width: 17ch; }

.method-note {
  margin: 34px 0 70px;
  padding: 22px 24px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 0 14px 14px 0;
  color: var(--muted);
  background: var(--surface);
}

.method-note strong { color: var(--ink); }

.guide-group { margin-top: 84px; }

.group-heading h2 { margin-top: 0; }

.guide-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.guide-card {
  display: flex;
  min-height: 310px;
  flex-direction: column;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
}

.guide-card h2 { margin: 8px 0 14px; }
.guide-card h2 a { color: var(--ink); text-decoration: none; }
.guide-card p { margin-top: 0; }
.guide-card .text-link { margin-top: auto; font-weight: 800; text-decoration: none; }

.card-meta,
.byline {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
  letter-spacing: 0.04em;
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 54px;
  color: var(--muted);
  font-size: 0.86rem;
}

.breadcrumbs a { text-decoration: none; }
.article-header { margin-bottom: 40px; }
.article-header .lead { max-width: 760px; }

.article-shell article { max-width: 760px; margin-inline: auto; }
.article-shell article section { margin-top: 54px; }
.article-shell article h2 { margin-bottom: 18px; }
.article-shell article p { font-size: 1.04rem; }

.worked-example {
  padding: 24px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 0 12px 12px 0;
  background: var(--surface);
  scroll-margin-top: 24px;
}
.worked-example h2 { margin-top: 0; }
.worked-example li { margin-block: 12px; }
.worked-example summary { cursor: pointer; color: var(--ink); font-weight: 750; }
.worked-example details { padding-top: 18px; border-top: 1px solid var(--line); }
.worked-example .example-sources { font-size: 0.9rem; }
.instructions section { margin-top: 48px; scroll-margin-top: 24px; }
.instructions h1 { max-width: 17ch; }

.takeaway {
  padding: 28px;
  border-radius: 16px;
  color: #eaf8fa;
  background: var(--ocean);
}

.takeaway h2 { margin-top: 0; color: #fff; }
.takeaway p { margin-bottom: 0; color: #c4dce4; }

.article-pagination {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 80px;
}

.article-pagination a {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--ink);
  font-weight: 750;
  text-decoration: none;
}

.article-pagination a:last-child { text-align: right; }
.article-pagination span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 0.76rem; text-transform: uppercase; }

@media (max-width: 720px) {
  .guide-grid,
  .article-pagination { grid-template-columns: 1fr; }
  .guide-card { min-height: auto; }
  .article-pagination a:last-child { text-align: left; }
}
