.sk-tutorials-directory .sk-tutorials-quick-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sk-tutorials-directory .sk-tools-quick-grid a {
  --quick-accent: var(--sk-blue);
  --quick-soft: var(--sk-blue-soft);
}

.sk-tutorials-directory .sk-tools-quick-grid a:nth-child(7) {
  --quick-accent: var(--sk-blue);
  --quick-soft: var(--sk-blue-soft);
}

.sk-tutorials-directory .sk-tools-quick-grid a:nth-child(8) {
  --quick-accent: var(--sk-blue);
  --quick-soft: var(--sk-blue-soft);
}

.sk-tutorials-directory .sk-tools-quick-grid a > span:first-child,
.sk-tutorials-directory .sk-tools-category-mark {
  font-size: 11px;
}

.sk-tutorials-directory .sk-tutorials-stage-list {
  gap: 70px;
}

.sk-tutorials-directory .sk-tutorials-stage {
  scroll-margin-top: 164px;
  --section-accent: var(--sk-blue);
  --section-soft: var(--sk-blue-soft);
  --section-border: #aebdca;
}

.sk-tutorials-directory .sk-tutorials-stage:nth-child(7) {
  --section-accent: var(--sk-blue);
  --section-soft: var(--sk-blue-soft);
  --section-border: #aebdca;
}

.sk-tutorials-directory .sk-tutorials-stage:nth-child(8) {
  --section-accent: var(--sk-blue);
  --section-soft: var(--sk-blue-soft);
  --section-border: #aebdca;
}

.sk-tutorials-directory .sk-tutorials-post-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card {
  min-height: 280px;
}

.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-body {
  padding: 24px;
}

.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card:last-child:nth-child(odd) {
  grid-column: auto;
  max-width: none;
}

.sk-tutorials-stage-link {
  display: inline-flex;
  margin-top: 14px;
  color: var(--sk-blue);
  font-size: 13px;
  line-height: 1.55;
  font-weight: 850;
}

.sk-tutorials-stage-link:hover {
  color: var(--sk-blue-dark);
}

.sk-tutorials-directory .sk-stage-empty {
  min-height: 220px;
}

.sk-tutorials-directory .sk-tutorials-method .sk-tools-verify-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sk-tutorials-directory .sk-tools-related-links a:first-child {
  color: #fff;
  background: var(--sk-blue);
  border-color: var(--sk-blue);
}

.sk-tutorials-directory .sk-tools-anchor-nav a span,
.sk-tutorials-directory .sk-tools-anchor-nav a:hover,
.sk-tutorials-directory .sk-tools-anchor-nav a:focus-visible { color: var(--sk-blue); }
.sk-tutorials-directory .sk-tools-anchor-nav a:hover,
.sk-tutorials-directory .sk-tools-anchor-nav a:focus-visible { background: var(--sk-blue-soft); }
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(7) span,
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(7):hover,
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(7):focus-visible { color: var(--sk-blue); }
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(7):hover,
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(7):focus-visible { background: var(--sk-blue-soft); }
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(8) span,
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(8):hover,
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(8):focus-visible { color: var(--sk-blue); }
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(8):hover,
.sk-tutorials-directory .sk-tools-anchor-nav a:nth-child(8):focus-visible { background: var(--sk-blue-soft); }

.sk-tutorials-directory .sk-tools-category .sk-post-card::before { background: var(--section-accent); }
.sk-tutorials-directory .sk-tools-category .sk-post-category { color: var(--section-accent); background: var(--section-soft); }
.sk-tutorials-directory .sk-tools-category .sk-post-action,
.sk-tutorials-directory .sk-tools-category .sk-tutorials-stage-link { color: var(--section-accent); }

.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-meta { font-size: 13px; line-height: 1.55; }
.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card h3 {
  font-size: 22px;
  line-height: 1.48;
  letter-spacing: -.012em;
  text-wrap: balance;
}
.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-excerpt {
  font-size: 15px;
  line-height: 1.8;
  text-wrap: pretty;
}
.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-action { font-size: 14px; }
.sk-tutorials-directory .sk-stage-empty strong { font-size: 18px; line-height: 1.5; }
.sk-tutorials-directory .sk-stage-empty span { font-size: 14px; line-height: 1.8; }

@media (max-width: 980px) {
  .sk-tutorials-directory .sk-tutorials-quick-grid,
  .sk-tutorials-directory .sk-tutorials-method .sk-tools-verify-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .sk-tutorials-directory .sk-tutorials-quick-grid,
  .sk-tutorials-directory .sk-tutorials-post-grid,
  .sk-tutorials-directory .sk-tutorials-method .sk-tools-verify-grid {
    grid-template-columns: 1fr;
  }

  .sk-tutorials-directory .sk-tutorials-stage {
    scroll-margin-top: 86px;
  }

  .sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card {
    min-height: 0;
  }

  .sk-tutorials-directory .sk-tutorials-post-grid .sk-post-body { padding: 21px 19px; }
  .sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card h3 { font-size: 20px; }
  .sk-tutorials-directory .sk-tutorials-post-grid .sk-post-excerpt { font-size: 14px; }
}

/* 3.1 editorial tutorial rhythm */
.sk-tutorials-directory .sk-tutorials-stage-list { gap: 90px; }
.sk-tutorials-directory .sk-tutorials-post-grid { gap: 20px; align-items: stretch; }
.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card { min-height: 310px; }
.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-body { padding: 28px; }
.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card h3 { font-size: 23px; line-height: 1.42; letter-spacing: -.025em; }
.sk-tutorials-directory .sk-tutorials-post-grid .sk-post-excerpt { line-height: 1.85; }

@media (max-width: 700px) {
  .sk-tutorials-directory .sk-tutorials-stage-list { gap: 68px; }
  .sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card { min-height: 0; }
  .sk-tutorials-directory .sk-tutorials-post-grid .sk-post-body { padding: 23px 21px; }
  .sk-tutorials-directory .sk-tutorials-post-grid .sk-post-card h3 { font-size: 21px; }
}