.guide-hero {
  padding: 25px 28px;
  border-radius: 18px;
  background: #17191f;
  color: #fff;
}
.guide-hero h2 { color: #d8ff63; }
.guide-hero p:not(.eyebrow) { color: #aeb3bd; }
.guide-hero .btn { background: #d8ff63; border-color: #d8ff63; color: #17191f; }
.guide-route {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 18px 20px;
  margin-bottom: 10px;
  border: 1px solid #e7e8ec;
  border-radius: 15px;
  background: #fff;
}
.guide-route div { min-width: 0; }
.guide-route i { color: #a4a8b1; font-style: normal; }
.guide-route b { display: block; margin-top: 5px; font-size: 12px; }
.route-label { color: #8a8f99; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.guide-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .55fr); gap: 20px; }
.guide-steps { display: grid; gap: 10px; }
.guide-step {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 15px;
  padding: 17px;
  border: 1px solid #e7e8ec;
  border-radius: 14px;
  background: #fff;
}
.step-number {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #eeebff;
  color: #6d5dfc;
  font-size: 11px;
  font-weight: 900;
}
.guide-step h3 { margin: 0 0 6px; font-size: 14px; }
.guide-step p { margin: 0; color: #737883; font-size: 11px; line-height: 1.65; }
.guide-checklist { overflow: hidden; border: 1px solid #e7e8ec; border-radius: 14px; background: #fff; }
.guide-checklist>div { display: flex; gap: 10px; padding: 14px 15px; border-bottom: 1px solid #eceef0; }
.guide-checklist>div:last-child { border: 0; }
.guide-checklist>div>span { color: #257a55; font-weight: 900; }
.guide-checklist p { margin: 0; }
.guide-checklist b { display: block; font-size: 12px; }
.guide-checklist small { display: block; margin-top: 4px; color: #8a8f99; font-size: 10px; line-height: 1.45; }
.guide-tip, .guide-warning { padding: 17px; margin-top: 13px; border-radius: 14px; }
.guide-tip { background: #eeebff; }
.guide-tip blockquote { margin: 8px 0; padding-left: 11px; border-left: 3px solid #6d5dfc; font-size: 11px; line-height: 1.65; }
.guide-tip>p:last-child, .guide-warning p { margin: 8px 0 0; color: #646a74; font-size: 10px; line-height: 1.6; }
.guide-warning { border: 1px solid #eed99e; background: #fff8e3; }
.guide-warning b { font-size: 12px; color: #7d5c00; }
.guide-formats { margin-top: 24px; }
.format-guide { display: grid; grid-template-columns: repeat(3, 1fr); }
.format-guide>div { padding: 20px; border-right: 1px solid #e7e8ec; }
.format-guide>div:last-child { border: 0; }
.format-guide span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: #17191f; color: #d8ff63; font-size: 11px; font-weight: 900; }
.format-guide h4 { margin: 12px 0 7px; font-size: 13px; }
.format-guide p { margin: 0; color: #737883; font-size: 11px; line-height: 1.65; }
@media (max-width: 1000px) {
  .guide-route { grid-template-columns: repeat(2, 1fr); }
  .guide-route i { display: none; }
  .guide-layout { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .guide-hero { align-items: stretch; }
  .guide-route { grid-template-columns: 1fr; }
  .guide-step { grid-template-columns: 42px 1fr; }
  .guide-step .btn { grid-column: 1 / -1; }
  .format-guide { grid-template-columns: 1fr; }
  .format-guide>div { border-right: 0; border-bottom: 1px solid #e7e8ec; }
}