/* ===== RESET + PODSTAWY ===== */

body { 
    font-family: Arial, sans-serif; 
    margin:0; 
    padding:0; 
    background:#ffffff; 
    color:#333; 
}

a {
    text-decoration: none;
}

/* ===== HEADER ===== */

header { 
    display:flex; 
    align-items:center; 
    padding:10px 20px; 
    background:#f4f8fc; 
    border-bottom:2px solid #0066A1; 
}

nav a { 
    margin:0 15px; 
    color:#0066A1; 
    font-weight:bold; 
}

nav a:hover { 
    color:#C43C84; 
}

.logo { 
    height:60px; 
}

/* ===== HERO ===== */

.hero { 
    padding:60px 20px; 
    background:#e9f2fb; 
    text-align:center; 
    color:#0066A1; 
}

.hero h1 { margin-bottom: 10px; }

.hero p {
    max-width: 900px;
    margin: 0 auto;
    font-size: 16px;
    color: #004d80;
}

/* ===== PODSTRONY ===== */

.subpage-hero {
    padding-bottom: 40px;
}

.subpage-hero .hero-content {
    max-width: 900px;
    margin: 25px auto 0 auto;
    padding: 0 15px;
    text-align: left;
    color: #003d66;
}

.subpage-hero h2 { color: #004d80; }

/* ===== BANERY – NATURALNE, RESPONSYWNE ===== */

.wide-banner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.wide-banner img {
    width: 100%;        /* NIGDY nie wyjdzie poza ekran */
    height: auto;       /* proporcjonalne skalowanie */
    display: block;
    margin: 0;
    padding: 0;
    border-radius: 8px;
}

/* ===== SLIDER ===== */

.slider-small {
  width: 100%;
  overflow: hidden;
  margin: 30px auto;
  background: #f7f7f7;
  padding: 12px 0;
  max-width: 1200px;
  border-radius: 8px;
}

.slider-track {
  display: flex;
  gap: 15px;
  animation: moveSlider 20s linear infinite;
}

.slider-small img {
  height: 160px;
  object-fit: contain;
  border-radius: 8px;
}

/* Animacja slidera */
@keyframes moveSlider {
  0% { transform: translateX(0); }
  100% { transform: translateX(-120%); }
}

/* ===== FORMULARZ ===== */

form {
    max-width: 600px;
    margin: 30px auto;
    padding: 0 15px;
}

input, textarea {
    width: 100%;
    padding: 10px;
    margin-top: 10px;
    border:1px solid #ccc;
    border-radius: 4px;
}

button {
    margin-top: 15px;
    padding: 12px 25px;
    background:#0066A1;
    color:#fff;
    border:none;
    cursor:pointer;
    border-radius: 4px;
}

/* ===== STOPKA ===== */

.site-footer {
  background: #f2f2f2;
  padding: 40px 20px;
  margin-top: 40px;
  color: #333;
}

.footer-container {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 25px;
}

.footer-company, .footer-contact, .footer-notice {
  flex: 1 1 250px;
}

/* ===== RESPONSYWNOŚĆ ===== */

@media (max-width: 768px) {

  header {
    flex-direction: column;
    text-align: center;
  }

  nav a {
    margin: 8px 8px;
    display: inline-block;
  }

  .logo { height: 50px; }

  /* Mobilne bannery — NIE wychodzą poza ekran */
  .wide-banner {
      width: 100%;
      max-width: 100%;
  }

  .wide-banner img {
      width: 100%;
      height: auto;   /* skaluje naturalnie */
      border-radius: 6px;
  }

  .slider-small img {
      height: 120px;
  }

  .footer-container {
      flex-direction: column;
      text-align: center;
  }
}

@media (max-width: 480px) {

  nav a { display: block; margin: 6px 0; }

  .slider-small img {
      height: 100px;
  }

  .hero h1 { font-size: 20px; }
  .hero p { font-size: 14px; }
}