/* Ustandaryzowany stos fontów – Tusker jako pierwszy, potem bezpieczne fallbacki */
:root {
  --font-sans: "Tusker Grotesk 4500", "Tusker Grotesk 3500",
               -apple-system, BlinkMacSystemFont, "Segoe UI",
               Roboto, Ubuntu, Cantarell, "Fira Sans",
               "Droid Sans", "Helvetica Neue", Arial, sans-serif;
}



/* Nagłówki – jeśli chcesz mocniejszy charakter */
h1, h2, h3 {
  font-family: "Tusker Grotesk 3500", var(--font-sans);
  font-weight: 700;
  letter-spacing: .1rem;
}
h4, h5, h6 {
  font-family: "Tusker Grotesk 2500", var(--font-sans);
  font-weight: 400;
}

/* Styl responsywnego logo */
.brand-logo img {
  max-height: 60px; /* dopasuj wysokość do paska nawigacji */
  height: auto;
  width: auto;
  display: block;
}

/* Dostosowanie na mniejszych ekranach */
@media (max-width: 992px) {
  .brand-logo img {
    max-height: 50px; /* np. mniejsza wysokość na tablet */
  }
}

@media (max-width: 600px) {
  .brand-logo img {
    max-height: 40px; /* jeszcze mniejsza na telefonie */
  }
}
/* Globalny font dla treści */
html, body, input, textarea, select, button {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI",
               Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif;
}
/* h1 – font Tusker */
h1 {
  font-family: "Tusker Grotesk 3500", "Tusker Grotesk 4600", "Tusker Grotesk 2500", sans-serif;
  font-weight: 700; /* Bold lub odpowiednia waga z Twoich plików Tusker */
  letter-spacing: -9px;
}

.barwy-img {
    display: block;
    margin: 10px auto;   /* odstęp na mobile (góra/dół 10px, wyśrodkowany) */
    max-width: 100%;     /* pełna szerokość na mobile */
}

@media (min-width: 992px) {
    .barwy-img {
        margin: 10px 0 10px 20px;  /* góra 10px, prawo 0, dół 10px, lewa 20px */
        max-width: 70%;            /* obraz mniejszy na desktopie */
    }
}
.full-width-bg {
    background-color: white;
    width: 100%;
}
.barwy-img {
    display: block;
    margin: 10px auto;
    max-width: 100%;
}

@media (min-width: 992px) {
    .barwy-img {
        margin: 10px 0 10px 20px;  /* dodany margines z lewej */
        max-width: 70%;            /* obraz mniejszy na desktopie */
    }
}

