/* How-to guides (guide-*.html, guides.html) - built by scripts/content/build-guides.py */
.guide-hero .lede { max-width: 760px; }
.guide-video { margin-top: 32px; }
.guide-video video { display: block; width: 100%; height: auto; background: #0b1626; }
.guide-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 18px; color: var(--slate); font-size: 14px; }
.guide-need { margin: 0; padding-left: 20px; line-height: 1.8; }
.guide-steps { display: grid; gap: 56px; margin-top: 8px; }
.guide-step { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: center; }
.guide-step:nth-child(even) .guide-step-copy { order: 2; }
.guide-step h3 { margin: 0 0 10px; font-size: 22px; }
.guide-step p { margin: 0; color: var(--slate); font-size: 16px; line-height: 1.7; }
.guide-step code, .guide-tips code { font-family: var(--mono); font-size: .92em; background: rgba(11, 22, 38, .06); padding: 1px 6px; border-radius: 5px; }
.guide-tips { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.guide-tips li { border-left: 3px solid var(--tape); padding: 4px 0 4px 16px; line-height: 1.65; }
.guide-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.guide-card { display: block; border: 1px solid #c9d2de; border-radius: 16px; overflow: hidden; background: #fff; color: inherit; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.guide-card:hover { transform: translateY(-2px); box-shadow: 0 24px 48px -28px rgba(11, 22, 38, .5); }
.guide-card img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.guide-card div { padding: 18px 20px 22px; }
.guide-card .eyebrow { margin: 0 0 6px; }
.guide-card h3 { margin: 0 0 8px; font-size: 19px; }
.guide-card p { margin: 0; color: var(--slate); font-size: 15px; line-height: 1.6; }
@media (max-width: 820px) {
  .guide-step { grid-template-columns: 1fr; gap: 18px; }
  .guide-step:nth-child(even) .guide-step-copy { order: 0; }
}