body { background: url('../img/bg.jpg') #174600 top left no-repeat; font-family: 'Open Sans'; color: #fff;  }
.root { width: 100%; overflow: hidden; }
header { position: relative; z-index: 10; min-height: 200px; }
.navbar-brand { margin-left: 13%; }
.navbar { margin-right: 55px; font-size: 30px; }
.navbar ul li { padding: 0px 24px; border-right: 1px solid white; color: #fff; font-weight: 300; font-family: 'Open Sans'; } 
.navbar ul li a, .navbar ul li a:hover, .navbar ul li a:active, .navbar ul li a:focus { line-height: 32px; text-decoration: none; text-transform: uppercase; color: #fff; font-weight: 300; font-family: 'Open Sans'; }
.navbar ul li:last-child, .navbar ul li.no-border { border-right: 0px; }
.navbar ul li:last-child { padding: 0px; }
.nav-link-inline  { display: inline-block; padding: 0px 4px; }
.navbar ul li .nav-link-inline:last-child { padding-right: 0px; }
.product-text { font-size: 20px; line-height: 34px; margin-bottom: 100px; }
.bx-wrapper { border-radius: 8px; background: transparent; margin: 0px 55px; margin-bottom: 55px; max-width: 1920px; }
.navbar-toggler { background-color: white; }

.absolute-title { position: absolute; max-width: 1350px; left: 50%; transform: translate(-50%, -50%); width: 100%; overflow: hidden; }
.absolute-title.normal { margin-top: 100px;}
.absolute-title h2 { text-transform: uppercase; color: white; font-size: 30px; padding: 0px 20px; font-weight: 300; display: inline-block; text-align: center; }
.absolute-title h2.with-background { background-color: #174600; }
.absolute-title h2::before {
  content: "";
  position: absolute;
  top: 46%; /* Wypośrodkowanie w pionie */
  left: 0;
  width: 41%; /* Kreska jest szeroka jak cały viewport */
  height: 2px;
  background-color: #fff;
  transform: translateY(-50%); /* Dopasowanie do środka tekstu */
  z-index: -1; /* Umieszczenie pod tytułem */
}

.absolute-title h2::after {
  content: "";
  position: absolute;
  top: 46%; /* Wypośrodkowanie w pionie */
  right: 0;
  width: 41%; /* Kreska jest szeroka jak cały viewport */
  height: 2px;
  background-color: #fff;
  transform: translateY(-50%); /* Dopasowanie do środka tekstu */
  z-index: -1; /* Umieszczenie pod tytułem */
}

.products {
    padding-bottom: 100px;
}
.products .row .col-12 { padding-top: 60px; }
.products p { color: white; font-size: 20px; padding-top: 15px; margin: 0px auto; text-align: left; display: inline-block; }

.news {
    padding-top: 60px;
    padding-bottom: 0px;
}
.news h3 { font-size: 24px; padding: 20px 0px 30px 0px; }
.news p { font-size: 20px; line-height: 30px; }
.news .row .col-12:first-child p { margin-right: 10px; }
.contact-left { float: left; position: absolute; left: 0px; bottom: 0px; }
.contact-right { float: right;  position: absolute; right: 0px; bottom: 0px; }
.contact-bg {   background: url('../img/contact-bg.jpg') center top no-repeat; }
.contact {  padding-top: 200px; font-size: 20px; line-height: 30px; text-align: center; }
.contact .logotypes { margin-bottom: 35px; }
.contact a, .contact a:focus, .contact a:visited, .contact a:active, .contact a:hover { color: white; text-decoration: none; }
.contact-text { display: inline-block; margin: 0px auto; text-align: left; padding-left: 200px; }
.leaf1 { position: absolute; left: 0px; margin-top: -250px; z-index: 101; }
.leaf2 { position: absolute; right: 0px; margin-top: -100px; z-index: 101; }
.leaf3 { position: absolute; right: 0px; margin-top: -100px; z-index: 101; }
.egg { position: absolute; right: 0px; z-index: 101; margin-top: -200px; }

.contact { height: 1030px; }
.footer p { font-size: 18px; line-height: 80px; text-align: right; }
.pagination { padding-top: 15px; background: transparent; border: 0px; }
.pagination li a, .pagination li a:active, .pagination li a:focus, .pagination li a:visited, .pagination li a:hover { background: transparent; color: white; border: 0px; }
.pagination li.active a, .pagination li.active a:active, .pagination li.active a:focus, .pagination li.active a:visited, .pagination li.active a:hover {
      outline: none !important;
  box-shadow: none !important;
  border-color: transparent !important;
    
    color: #000; background: transparent; }
.pagination .page-item.active .page-link {
  background-color: transparent !important;
  color: #000 !important; /* kolor tekstu */
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;  
}
.pagination .page-link:focus,
.pagination .page-link:active,
.pagination .page-item.active .page-link {
  outline: none !important;
  box-shadow: none !important;
  background-color: transparent !important;
  border-color: transparent !important;
}

.footer-image { display: none; }
.social { padding-top: 40px; max-width: 500px; text-align: center; }
.person { padding-top: 55px; }
.person-img { float: left; }
.person-img img { padding-right: 15px; }
.person-description { width: 450px; float: left; }



#newsModal .custom-modal {  
    max-width: min(90vw, 1400px); 
    width: 100%;
}

 /* 🔹 ograniczenie wysokości i wygląd */
  .custom-modal-content {
    min-height: 60vh;
    max-height: 80vh; /* max 80% ekranu */
    background: url('../img/news-bg.jpg') #174600 top left no-repeat; 
    color: #fff;
    border-radius: 1rem;
    border: 2px solid white;
    overflow-y: auto; /* scroll, jeśli treść za długa */
  }

  /* 🔹 ładniejsze przewijanie */
  .custom-modal-content::-webkit-scrollbar {
    width: 8px;
  }
  .custom-modal-content::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 4px;
  }
  
  /* Biały krzyżyk (Bootstrap 5) */
.btn-close {
  filter: invert(1) brightness(200%); /* zamienia ciemny na biały */
}

/* Opcjonalnie: efekt hover */
.btn-close:hover {
  opacity: 0.8;
}

.modal-header,
.modal-footer {
  border: none !important;
}

.news-content { max-width: 1150px; width: 90%; padding-top: 40px; text-align: left; margin: 0px auto; }
.news-content img { text-align: center; margin: 0px auto; display: block; }
.news-content h2 { padding: 20px 0px; font-size: 30px; }
.news-content p { padding-bottom: 20px; font-size: 20px; }

  @media (max-width: 768px) {
    .custom-modal {
      max-width: 95vw !important;
    }
    .custom-modal-content {
      max-height: 85vh !important;
    }
  }
  
@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1350px;
    }
}

@media (max-width: 1700px) {
.navbar-brand { margin-left: 5%; }    
.egg { margin-top: -120px; width: 200px; }
}

@media (max-width: 1540px) {
 .navbar {font-size: 18px; }
 .navbar ul li img { max-height: 32px; }
.egg { margin-top: -50px; width: 110px; }
}

@media (max-width: 1370px) {
    .absolute-title h2::after { right: 20px; width: calc(41% - 20px); }
    .absolute-title h2::before { left: 20px; width: calc(41% - 20px); }    
}

@media (max-width: 1300px) {
.leaf1 { max-width: 200px; margin-top: -160px; }
.leaf2 { max-width: 200px; margin-top: -50px; }
    
}

@media (max-width: 1240px) {
    header { min-height: 100px; }
    .navbar-brand img { max-height: 100px; }
    .absolute-title h2::after { right: 20px; width: calc(39% - 20px); }
    .absolute-title h2::before { left: 20px; width: calc(39% - 20px); }        
}

@media (max-width: 1200px) {
    .leaf3 { max-width: 150px; margin-top: 0px; }    
}

@media (max-width: 1024px) {
 .navbar {font-size: 16px; }    
}

@media (max-width: 991px) {
    .absolute-title { margin-top: 15px; }
    header { min-height: 150px; }
    .navbar-brand img { max-height: 150px; }
    .navbar ul li { border-right: 0px; font-size: 24px; text-align: center; }
    .navbar ul li a, .navbar ul li a:hover, .navbar ul li a:active, .navbar ul li a:focus { line-height: 48px; }
    .bx-wrapper { margin: 0px 0px; margin-bottom: 55px; }
    .absolute-title.normal { margin-top: 20px; }
    .absolute-title h2::after { right: 20px; width: calc(37% - 20px); }
    .absolute-title h2::before { left: 20px; width: calc(37% - 20px); }      
    .products { padding-bottom: 20px; }
    .product-text { margin-bottom: 25px; }
    .products .row .col-12 { padding-top: 20px; }
    .products .col-12 { text-align: center; padding: 20px 0px; }
    .products .row:last-child { padding-top: 0px; }
    .news .row .col-12:first-child p { margin-right: 0px; }
    .footer p { font-size: 12px; line-height: 24px; text-align: center; }
    .navbar { margin-right: 0px; }
    .leaf1 { max-width: 150px; margin-top: -130px; }
    .leaf2 { max-width: 150px; margin-top: -40px; }
    .leaf3 { max-width: 150px; margin-top: -90px; }
    .egg { margin-top: -100px; width: 110px; }
    .contact-bg {   background: transparent; }   
    .footer-image { display: block; text-align: center; margin: 0px auto; }
    .social { max-width: 100%; position: absolute; text-align: center; left: 0px; width: 100%; }
    .contact-text { padding-left: 0px; }
    .contact { height: auto; padding-top: 60px; }
    .news-container .col-12 { margin-bottom: 20px; }
    .news-container .col-12:last-child { margin-bottom: 0px; }
    .news-content { width: 100%; }
    
}

@media (max-width: 800px) {
    .absolute-title h2::after { right: 20px; width: calc(34% - 20px); }
    .absolute-title h2::before { left: 20px; width: calc(34% - 20px); }       
    .leaf1 { max-width: 100px; margin-top: -90px; }
    .leaf2 { max-width: 100px; margin-top: -40px; }
}

@media (max-width: 770px) {
    .contact { text-align: center; }
    .contact-text { text-align: center; display: block; }
    .person-img { float: none; width: 100%; text-align: center; }
    .person-img img { padding: 0px; padding-bottom: 20px; }
    .person-description { width: 100%; text-align: center; }
}

@media (max-width: 680px) {
    .absolute-title { margin-top: 15px; }
    .absolute-title h2 { font-size: 24px; }
    .absolute-title h2::after { right: 20px; width: calc(30% - 20px); }
    .absolute-title h2::before { left: 20px; width: calc(30% - 20px); }       
}

@media (max-width: 580px) {
    .leaf3 { max-width: 100px; margin-top: -70px; }    
}

@media (max-width: 500px) {
    .absolute-title { margin-top: 15px;  }
    .absolute-title h2 { font-size: 18px; }
    .absolute-title h2::after { right: 20px; width: calc(30% - 20px); }
    .absolute-title h2::before { left: 20px; width: calc(30% - 20px); }           
    .product-text { font-size: 20px; line-height: 24px; }
    .news h3 { font-size: 22px; padding: 20px 0px 30px 0px; }
    .news p { font-size: 18px; line-height: 30px; }
    .products p { font-size: 18px; }    
    .news-content p { font-size: 18px; }
    .news-content h2 { font-size: 24px; }
}

@media (max-width: 440px) {
    .navbar-brand img { max-height: 70px; }
    header { min-height: 70px; }
    .absolute-title h2::after { right: 20px; width: calc(25% - 20px); }
    .absolute-title h2::before { left: 20px; width: calc(25% - 20px); }      
    .leaf1 { max-width: 70px; margin-top: -40px; }
    .leaf2 { max-width: 70px; }
    .leaf3 { max-width: 70px; margin-top: -30px; }
    .egg { margin-top: -50px; width: 70px; }    
}

@media (max-width: 380px) {
    .leaf1 { display: none; }
    .leaf2 { display: none; }
    .leaf3 { display: none; }
    .egg { display: none;  }    
}