/*
  common and repeating utility classes

  general styling
  flash message
  backgrounds
  card
  awards section
*/




/* general styling
============================================================================ */
html,
body {
  scroll-behavior: smooth;
  background-color: var(--pos-color-page-background, #f7f8fa);
  color: var(--pos-color-prominent);
}

.container {
  max-width: var(--width-page);
  margin-inline: auto;
  padding-inline: var(--spacing-page);
}

.content .container {
  padding-block: var(--spacing-section);
}



/* flash message
============================================================================ */
.pos-flash {
  max-width: 300px;
  position: fixed;
  inset-inline-start: 1rem;
  inset-block-end: 1rem;
}

.pos-flash li {
  padding: 1rem;

  border-radius: var(--radius-card);

  background-color: var(--color-text-normal);

  color: var(--color-text-inverted);
}

.pos-flash .notice {
  background-color: var(--color-confirmation);
}

.pos-flash .error {
  background-color: var(--color-important);
}

.pos-flash .alert {
  background-color: var(--color-warning);
}



/* backgrounds
============================================================================ */
.bg-prominent {
  background-image: radial-gradient(35.35% 106.03% at 50% 50%, #fff 24%, #f5f6fc 100%);
}

.bg-fancy {
  background-image: url('../images/bg-fancy.svg'), linear-gradient(99.03deg, #45a041 12.8%, #3a8dde 71.85%);
  background-repeat: no-repeat;
  background-position: right center;
}

.bg-vector {
  background-image: url('../images/marketing-landing/pictures/heroimg.png');
  background-repeat: no-repeat;
  background-position: right -150px center;
}
.bg-vector2 {
  background-image: url('../images/marketing-landing/pictures/vector2.png');
  background-repeat: no-repeat;
  background-position: right top;

}
.bg-vector3 {
  background-image: url('../images/marketing-landing/pictures/vector3.png');
  background-repeat: no-repeat;
  background-position: right -150px center;
}
.bg-hero {
  background-image: url('../images/marketing-landing/pictures/hero_bg_img.avif?v=1.0');
  background-repeat: no-repeat;
  background-position: right -150px center;
  background-color:var(--hero-bg-color);

}

@media (max-width: 1024px) {
  .bg-hero {
    background-position: right -500px center;
  }
}

/* Mobil nézet (max. 767px) */
@media (max-width: 767px) {
  .bg-hero {
    padding-bottom: 10px;
  }
}
/* card
============================================================================ */
.card {
  padding: var(--spacing-card);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
}



/* awards section
============================================================================ */
#awards ul {
  width: 100%;
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

#awards li {
  width: 94px;
}

#awards img {
  max-width: 100%;
}
.svg-pair img{
  margin: 5px;
  height:20px ;
  width:20spx

}