body {

  font-family: Arial, sans-serif;

  margin: 0;

  padding: 0;

  background: #f8f9fa;

}

header, footer {

  background: #084077;

  color: white;

  text-align: center;

  padding: 1rem;

}

main {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));

  gap: 1rem;

  padding: 1rem;

}

.card {

  background: white;

  border-radius: 8px;

  box-shadow: 0 2px 5px rgba(0,0,0,0.1);

  overflow: hidden;

  position: relative;

}

.card img, .card video {

  width: 100%;

  display: block;

}

.card .actions {

  display: flex;

  justify-content: space-between;

  padding: 0.5rem;

}

.card button {

  background: #007bff;

  border: none;

  color: white;

  padding: 0.3rem 0.6rem;

  border-radius: 4px;

  cursor: pointer;

}

.card .actions button {

  margin-right: 0.5rem;

}

.card .actions button:last-child {

  margin-right: 0;

}

 .buttons {

      position: fixed;

      bottom: 20px;

      right: 20px;

      display: flex;

      flex-direction: column;

      gap: 10px;

    }

 .buttons a {

      background-color: #25D366;

      color: white;

      padding: 12px 20px;

      border-radius: 50px;

      text-decoration: none;

      display: flex;

      align-items: center;

      gap: 10px;

      font-weight: bold;

      box-shadow: 0 2px 5px rgba(0,0,0,0.2);

    }

    .buttons a.call {

      background-color: #ff7f0e;

    }





.lang-switcher {

  position: absolute;

  top: 10px;

  right: 10px;

  z-index: 999;

}

.lang-switcher button {

  padding: 4px 8px;

  font-size: 12px;

}