body {
      margin: 0;
      font-family: "Segoe UI", Arial, sans-serif;
      background-color: #f5f8fa;
      color: #2c3e50;
      display: grid;
      grid-template-rows: auto 1fr auto;
      min-height: 100vh;
    }

    header {
      background-color: #d9eaf7;
      text-align: center;
      padding: 2rem 1rem;
      font-size: 2rem;
      font-weight: bold;
      color: #1a3d5d;
    }

    main {
      display: grid;
      gap: 2rem;
      justify-items: center;
      align-content: start;
      padding: 2rem 1rem;
    }

    main p {
      max-width: 700px;
      text-align: justify;
      font-size: 1.1rem;
      color: #34495e;
    }

    .buttons {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 1.5rem;
      width: 100%;
      max-width: 800px;
    }

    .buttons a {
      display: block;
      text-align: center;
      padding: 1.2rem;
      background-color: #bcd4e6;
      color: #1a3d5d;
      text-decoration: none;
      font-size: 1.2rem;
      font-weight: 400;
      border-radius: 10px;
      transition: background-color 0.2s ease, transform 0.1s ease;
    }

    .buttons a:hover {
      background-color: #a7c7db;
      transform: translateY(-2px);
    }

    footer {
      background-color: #d9eaf7;
      text-align: center;
      padding: 1rem;
      font-size: 0.9rem;
      color: #1a3d5d;
    }