src/styles/Home.module.css

body {
 font-family: Arial;
 margin: 0;
 padding: 20px;
}

.container {
 max-width: 1200px;
 margin: 0 auto;
 padding: 20px;
}

.main {
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 min-height: 100vh;
}

.title {
 color: #333;
 font-size: 36px;
}

.description {
 color: #666;
 font-size: 24px;
 margin-bottom: 20px;
}

.grid {
 display: grid;
 width: 100%;
 justify-items: center;
 grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}

.card {
 position: relative;
 background-color: #fff;
 border-radius: 5px;
 padding: 20px;
 margin: 20px;
}

.card h2 {
 margin-bottom: 10px;
}

.card p {
 margin-bottom: 20px;
}

.button {
 background-color: #00a766;
 color: #fff;
 padding: 10px 20px;
 border-radius: 5px;
 cursor: pointer;
}

.readMore {
 color: #00a766;
 text-decoration: none;
}

.readMore:hover {
 text-decoration: underline;
}