.hero{max-width:700px}
.seo-queries p{font-size:14px;color:#94a3b8}

@media (max-width: 768px) {
  .hero {
    max-width: 100%;
  }

  .btn-primary {
    width: 100%;
    text-align: center;
  }
}


/* ===== ROUTES PAGE ===== */

.crumbs{
  font-size:14px;
  color:#94a3b8;
  margin-bottom:24px;
}

.crumbs a{
  color:#94a3b8;
  text-decoration:none;
}

.routes-hero{
  max-width:720px;
}

.routes-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:20px;
  margin-top:40px;
}

/* route card */

.route-card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:18px;
  padding:20px;
  transition:.2s;
}

.route-card:hover{
  border-color:#6366f1;
  transform:translateY(-2px);
}

.route-title{
  font-weight:700;
  color:white;
  margin-bottom:6px;
}

.route-sub{
  font-size:14px;
  color:#94a3b8;
}

.route-btn{
  display:inline-block;
  margin-top:12px;
  font-size:14px;
  color:#818cf8;
  text-decoration:none;
}


/* ===== ROUTE DETAIL PAGE ===== */

.route-hero{
  max-width:720px;
}

.route-tags{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:12px 0 24px;
}

.route-tag{
  padding:6px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  font-size:12px;
  color:#cbd5e1;
}

.seo-text{
  margin-top:24px;
}

.seo-text p{
  margin:12px 0;
}

.faq{
  display:grid;
  gap:16px;
  margin-top:24px;
}

.cta-card{
  margin-top:32px;
}



@media(min-width:900px){
  .mobile-sticky{display:none}
}

/* убрать подчёркивание у карточек направлений */
.routes-grid a,
.routes-grid a:hover,
.routes-grid a:focus,
.routes-grid a:active {
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

.routes-grid a{
  color: inherit !important;
}
