@charset "utf-8";
/* CSS Document */

:root {
  --bg: #242424;
  --trans-bg:rgba(255,255,255,.15);
  --primary: #2563eb;
  --primary-color: #fff; /* Ciemny granat/szary */
  --primary-light: #dbeafe;
  --secondary-color: #161616; /* Jasny niebieski */
  --light: #f8fafc;
  --light-bg: #efefef;
  --accent: #06b6d4;
  --accent-color: #66c3d0;
  --text-color: #333;
  --dark: #1e293b;
  --dark-bg:#212121;
  --dark-text: #1e293b;
  --white: #fff;
  --gray: #999;
  --grafit: #444;
  --card-bg: #fff;
  --card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --transition: all 0.3s ease;
  --gap: 16px;

}

 body {
      position: relative;
      scroll-behavior: smooth; /* płynne przewijanie */
     
     font-family: "Poppins", sans-serif;
      font-optical-sizing:auto;
      font-weight: 400;
      font-style: normal;}

.small{font-size:12px;}
.lead{font-size:.9rem !important; font-weight:400;}



#map{
	width:100%;
	height:44vh;
    border:1px solid #ececec;}

hr{display:block; width:100%; height:1px; border:0px !important; border-top:1px solid #300;margin:0 auto; background: none;}

#contact a {color:#000;text-decoration: none;}

section{min-height: 80vh;padding:6em 0;align-content: center; justify-content: center;}
section#slider{min-height: 250px;padding:8em 0 4em 0;align-content: center; justify-content: center;}
section::after{z-index:2;position: fixed;  background-image: url("assets/images/watermark.png");background-attachment: scroll; background-position: center center; background-repeat: no-repeat; background-size: cover;}



#slider .carousel-inner{
    width: 100%;
    height: 100%;
    padding-top: 0; /* wymusza kwadrat */
    overflow: hidden;
  aspect-ratio: 1 / 1;
}

.square-container {
    position: relative;
    width: 100%;
    height: 100%;
    padding-top: 0; /* wymusza kwadrat */
    overflow: hidden;
  aspect-ratio: 1 / 1;
  }
  .square-content {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
  }
  .carousel-item {
    height: 100% !important;
  }
  .square-content img,
  .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

video{width:100%; height:100%; overflow: hidden;}

.navbar{z-index:99;position:fixed;left:0;top:0;width:100%;padding:10px 0;border-bottom:1px dashed rgba(255,255,255,.2);box-shadow:0 2px 5px rgba(0,0,0,.25);}
.dropdown-menu.show{position: absolute !important;top:10px;right:10px;}

/* Navbar */
nav.navbar {transition: all 0.3s ease;}
li.nav-item{padding:5px 10px;}


.about-text {padding: 2rem;   }
.about-image img {border-radius: 0.75rem;box-shadow: 0 8px 20px rgba(0,0,0,0.1);width: 100%;height: auto;object-fit: cover;}


#contact{
    background:#fcfcfc;
    color: #444;}

#contact h2 {
    color: var(--white);}

#contact .container {
    max-width: 700px;
    text-align: center;}

#contact-form {
    margin-top: 10px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px;}

.form-group {
    text-align: left;
}

.form-group label {
    display: block;
    margin-bottom: 4px;
    font-size: 15px;
    font-weight: 300;
    color: var(--gray);
}

.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="tel"],
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 8px;
    border: none;
    border-radius: 5px;
    background-color:var(--trans-bg);
    color: var(--white);
    font-family: var(--font-body);
    font-size: .9em;
    outline: none;
    transition: border-color 0.3s ease;
}

option{color:#000;}

.form-group input::placeholder,
.form-group select::placeholder,
.form-group textarea::placeholder {
/*    color: rgba(255,255,255,.2);*/
    color: #000;
}

.form-group input:focus,
.form-group textarea:focus {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.5);
}

.form-group textarea {
    resize: vertical;
}

#contact-form button {
    width: 100%;
    max-width: 300px;
    margin: 10px auto 0;
    padding: 10px 30px;
    font-size: 1em;
    border: none;
    cursor: pointer;
    border-radius: 5px;
    background-color: var(--secondary-color);
    color: var(--grafit);
    font-family: var(--font-heading);
    font-weight: 700;
    transition: background-color 0.3s ease;
}

#contact-form button:hover {
    background-color: var(--accent-color);}

.clearfix{display:block;width:100%;height:40px;}

.social-icons a {
     color:var(--gray) !important;
      font-size: 2rem;
      margin: 0 1rem;
      transition: transform 0.3s, color 0.3s;
    }

    .social-icons a:hover {
      transform: scale(1.2);
    }

    /* Przykładowe kolory, możesz zmienić */
    .social-facebook { color: #3b5998; }
    .social-instagram { color: #E1306C; }
    .social-youtube { color: #FF0000; }


.foot{text-align: center; font-size:13px;padding:15px 0;}
.foot a{text-decoration:none; font-weight:400; color:#888;}



@media (max-width: 768px) {
#about .lead{font-size:1.1rem;font-weight: 300; white-space: normal; word-break:normal; }    
#carousel{width:100%; max-width:360px; overflow: hidden; max-height: 120px !important;padding:1em 0;align-content: center; justify-content: center;background:#dbdbdb;}    
}



#menu-list.active { display: block; } /* przykład dla toggle-menu */





#carousel{width:100%; max-height: 120px !important;padding:1em 0;align-content: center; justify-content: center;background:#dbdbdb;}



    .carousel__track {
      display: flex;
      gap: 60px;
      animation: scroll 16s linear infinite;
    }
    .carousel__slide {
      flex: 0 0 auto;
    }
    .logo {
      width: auto; height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .logo img {
      max-width: 100%;
      max-height: 100%;
      display: block;
    }
    @keyframes scroll {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }