

@charset "utf-8";


@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Tangerine:wght@400;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Rubik+Doodle+Shadow&family=Tangerine:wght@400;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Junge&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+Display:ital,wght@0,100..900;1,100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400..900&family=Rubik+Mono+One&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400..900&display=swap');


@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,opsz,wght@0,18..144,300..900;1,18..144,300..900&display=swap');






*{
     
	transition: 1s;
    box-sizing: border-box;/*padding nie zwiększa szer. boxu*/
    margin: 0;
    padding: 0  ;
    
}

html.no-snap {
  scroll-snap-type: none !important;
}

html{
	font-family: "Poppins", sans-serif;
	font-size: 15px; /* 1rem = 10px */
	
	scroll-behavior:smooth; /* płynne przewijanie */


  scroll-snap-type: y mandatory;   /* twardy snap */
  /* -webkit-overflow-scrolling: touch; */
  touch-action: pan-y;
    
}
body{
    
	font-size: 1.6rem;
   position: relative;
   /*background-image: url("../images/Background.jpg");
   background-size: cover;    */         
    width: 100vw;
    min-height: 100vh; /* zamiast height: 100vh */
    height: auto;
    

}


.background-wrapper {
  background-image: url("../images/Background.jpg");
  background-size: cover;
  display: flex;
    min-height: 100%;
    height: auto;
    width: 100%;
    opacity: 0;
  
    z-index: -10;
    animation: backgrand 1s ease-in forwards;

    
}

@keyframes backgrand {
  to {
    opacity: 1;
  }
}




nav{

    
    display: flex;
    position: fixed;
    width: 100%;
	
    justify-content:center;
    align-items: flex-start;
    /* min-height: 7.2%; */
    min-height: 4.5rem;

	  top: 0; /*do górnej krawędzi*/
	  padding: 1rem;
     will-change: opacity;
    margin-left: 0;
   
	background-color: black;
    z-index: 10;

    animation: nav .35s ease-in ;
   

}




.nav_wrapper{
    position: relative;
       
       top:0;
       right: 0;
     
       z-index: 10;

    }




    .logo-kontener{

        display: flex;
     position: fixed;
       /* max-height: 50px;
      max-width: 50px; */
      height: 10%;
      gap: 1rem;
      
      left: 10%;
      
        
    }


    .logo-kontener img{
          display: flex;
     position: relative;
      max-height: 50px;
      max-width: 50px;
      height: 5rem ;
     
      top: -5%;
      

    }

    .logo-kontener p{

      opacity: 1;
       font-family: "Noto Serif Display", serif;
       font-weight: 600;
    }





        .logo-kontener {

    color: whitesmoke;

        }

@keyframes nav {
  from {
    opacity: 0;
    
  }
  to {
    opacity: 1;
  }
}

nav ol{
	display: flex;
	gap: 2vw;
   
    
    
  
}

nav ol li{

}

nav ol li a{


                        background-color: black;
                        color: white;
                        position: relative;
                        z-index: 5;
                        /*border-radius: 5px; zaokraglone krawedzie*/
                        text-shadow: 2px 2px 4px rgba(1, 24, 38, 0.7);

                        padding: 0 0.75rem;
                    
                        text-decoration: none; /*usuwa podkreśl.*/
                        text-shadow:none;
                        margin-right: 1rem;
                        
                        /*
                            font-family:    "Rubik Doodle Shadow", system-ui;
                            font-weight:    400;
                            font-style:     normal;
                        */
                    font-family: "Noto Serif Display", serif;
                    /* font-family:    "Rubik Doodle Shadow", system-ui; */
                      /* font-family: "Poppins", sans-serif; */
                    font-optical-sizing: auto;
                    font-weight: 700;
                    font-style:bold;
                    font-variation-settings:
                    "wdth" 100;
                    height: 100%;

            
    }





nav ol li a:hover{
    background-color: white;
    color: black;
    /*text-transform: none;
    font-size: 1.8rem;
    border-radius: 5px; */
    transition: .5s;
    
    padding-bottom: 1rem;
    padding-top: 1rem;
   /* padding-bottom: 1rem;
       height:max-content;*/
      
} 


.hidden {
  display: none;
}

/* HAMBURGER MENU layout 
//////////////////////////////////////////////////////////// */

.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
    padding: 5px;
    position: relative;
    right: -45%;
    z-index: 1001;
}

.hamburger span {
    width: 25px;
    height: 3px;
    background: white;
    margin: 3px 0;
    transition: all 0.3s ease;
    border-radius: 2px;
    
}


.close-menu {
    display: none;
    position: fixed;
    top: 1.5%;
    /* top: 20px; */
    /* right: 20px; */
    right: 4.1%;
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 1001;
    padding: 0;
}

.close-menu span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 3px;
    background: white;
    border-radius: 2px;
    transition: all 0.3s ease;
}

.close-menu span:nth-child(1) {
    transform: translate(-50%, -50%) rotate(45deg);
}

.close-menu span:nth-child(2) {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.close-menu:hover span {
    background: #4a90e2;
}




.theme{
    
    /* min-height: 100vh; */
    height: auto;
    width: 100vw;
    /*background-color: white;
    background: linear-gradient( to top, #ffffff, #72788b);
    background: radial-gradient(circle at center, #fff 80%, #3e6da7);*/
    margin: 0 auto;    
    background-color: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
    
    z-index: -2;
    opacity: 0.98;
    overflow-y:auto;
    overflow-x: hidden;
   
    border-radius: 8px;
     border-right: 2px solid black;
     border-left: 2px solid black;
  animation: unroll .8s ease-out forwards;
  box-shadow: -20px 0 35px rgba(0, 0, 0, 1), 20px 0 35px rgba(0, 0, 0, 1);
  scroll-snap-align:start ;
  scroll-snap-stop:normal;

  

}

@keyframes unroll {
  from {
    height: 0;
     
    
  }
  to {
    height: 100vh;
    transform: scaleY(1);
  }
}


.section {
    display: flex;

	justify-content: center; 
   min-height: 100vh;
   height: auto;
   min-width: 100vw;
	
	/*scroll-margin-top: 0rem;*/
/*
	padding-top: 2rem;
	padding-bottom: 2rem;

	margin-top: 7rem;
	margin-bottom: 7rem;
*/

}



 #Transport{


    position: relative;
   margin-top: 5rem;
   padding-top: 4rem;
 
    width: 100%;
    height: 100%;
    margin: 0 0 0 0;
  
    
    color: black;
   justify-content: start;
   align-items: start;
    display: flex;
      overflow-y: hidden;
  /* scroll-snap-align: start;
  scroll-snap-stop: normal;     */
} 


/* New wrapper container */
.ribbon-wrapper {
    position: absolute;
    top: 16%;
    left: -1%;
    z-index: 10;
    font-size: 1.2rem;
     pointer-events: none;
}

/* Update ribbon - remove absolute positioning */
.ribbon {
    position: relative; /* Changed from absolute */
    background: linear-gradient(135deg, #4781d7, #c0392b);
    color: white;
    padding: 1rem 3rem 1rem 5rem;
    transform: rotate(-15deg);
    box-shadow: 0 10px 20px rgba(231, 76, 60, 0.3);
    /* Remove top and left properties */
     pointer-events: none;
}

.ribbon h1 {

 pointer-events: none;
}

/* Update subtitle - now relative to wrapper */
.subtitle-3 {
    position: absolute;
    top: 115%;        /* Relative to ribbon-wrapper, not viewport */
    left: 20%;       /* Relative to ribbon-wrapper, not viewport */
    font-size: 1.6rem;
    color: #2c3e50;
    font-weight: 700;
    font-style: italic;
    transform: rotate(-15deg);
    /* Remove the viewport-based positioning */
     pointer-events: none;
}





    @keyframes ribbon {
            from {
                transform: rotate(-15deg) translateY(-100%);
                opacity: 0;
            }
            to {
                transform: rotate(-15deg) translateY(0);
                opacity: 1;
            }
          
        }


.Trans-pudlo{

  margin: 1rem;
  margin-top: 5rem;
  display: flex;
  /* justify-content: space-evenly; */
  height: 100%;
  width: 95%;
  
}


.Trans-pudlo > * {


  flex: 1;
  max-width: 50%;
}
.Trans-fotka{

  width: 80%;   
  height: 100%;
 justify-content: center;
 align-items: center;
 pointer-events: none;

}

.Trans-fotka img{
  position:relative;
  top:20% ;
  left: -7%;
   width: 110%;
  pointer-events: none;
  
  
  /* object-fit:contain; wypełnij cały kontener, może przyciąć */
  

}


.tekst-box{
  position: relative;
  margin: 1rem;
  top:5%;
  left: 2%;
  width: 100%;
  

}

.tekst-box-header {

  width: 100%;
  height: 20%;
}

.tekst-box-header h1{
  position: absolute;
  left: -70%;
  top: -13%;
  margin-bottom: 0.7rem;
  font-size: 4rem;
  box-shadow: 10px 15px 10px rgba(1,1,1,10);
  text-shadow: 10px 15px 10px rgba(1,1,1,10);
  z-index: 50;
}

.tekst-box-header h2{
position: absolute;
  font-size: 2.5rem;
  top: 1%;
  left: -50%;
   box-shadow: 10px 15px 10px rgba(1,1,1,10);
     z-index: 50;
}




.tekst-box-body{
height: 70%;
width: 100%;

}


/********************************************************
***************************************************************
*********************************************************/



#Firma{

      /* padding: 5rem;
    padding-top: 4rem;*/

    position: relative;
   margin-top: 5rem;
   padding-top: 4rem;
 
    width: 100%;
       min-height: 100vh;
    height: auto;
    margin: 0 0 0 0;
  
    
    color: black;
       flex-direction: column;
   justify-content: center;
   align-items: center;
    display: flex;
       overflow-y: hidden;


         /* scroll-snap-align: start;
  scroll-snap-stop: normal;     */

}




.Firma-wrapper{
     
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    /* position: relative; */
     /* scroll-snap-type:smooth; */
        overflow: hidden;
        
        

}




 .section-header {
            text-align: center;
            margin-bottom: 20px;
        }

        .section-title {
            font-size: 48px;
            font-weight: bold;
            color: #2c3e50;
            margin-bottom: 10px;
            position: relative;
        }

        .section-title::after {
            content: '';
            width: 80px;
            height: 4px;
            background: linear-gradient(45deg, #4a90e2, #357abd);
            position: absolute;
            bottom: -10px;
            left: 50%;
            transform: translateX(-50%);
        }

        .section-subtitle {
            font-size: 20px;
            color: #7f8c8d;
            max-width: 600px;
            margin: 0 auto;
            line-height: 1.6;
        }

        .services-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 20px;
            /* margin-bottom: 80px; */
        }

        .service-card {
            background: white;
            border-radius: 15px;
            padding: 1rem 0.9rem;
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
            transition: transform 0.3s, box-shadow 0.3s;
            position: relative;
            overflow: hidden;
        }

        .service-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 5px;
            background: linear-gradient(45deg, #4a90e2, #357abd);
        }

        .service-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(0,0,0,0.15);
        }

        .service-icon {
            width: 80px;
            height: 80px;
            background: linear-gradient(45deg, #4a90e2, #357abd);
            border-radius: 50%;
            margin: 0 auto 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 36px;
            color: white;
        }

        .service-title {
            font-size: 24px;
            font-weight: bold;
            color: #2c3e50;
            text-align: center;
            margin-bottom: 20px;
        }

        .service-description {
            color: #7f8c8d;
            line-height: 1.6;
            text-align: center;
            margin-bottom: 30px;
        }

        .service-features {
            list-style: none;
            margin-bottom: 30px;
        }

        .service-features li {
            padding: 8px 0;
            position: relative;
            padding-left: 25px;
            color: #34495e;
        }

        .service-features li::before {
            content: '✓';
            position: absolute;
            left: 0;
            color: #4a90e2;
            font-weight: bold;
        }

        .cta-section {
            background: linear-gradient(135deg, #2c3e50, #34495e);
            color: white;
            padding: 60px 40px;
            border-radius: 20px;
            text-align: center;
            margin-top: 60px;
            margin-bottom: 10px;
            position: relative;
            left: 3%;
            }
        

        .cta-title {
            font-size: 36px;
            font-weight: bold;
            margin-bottom: 20px;
        }

        .cta-description {
            font-size: 18px;
            margin-bottom: 40px;
            opacity: 0.9;
        }

        .cta-buttons {
            display: flex;
            gap: 20px;
            justify-content: center;
            flex-wrap: wrap;
        }

        .btn {
            padding: 15px 30px;
            border: none;
            border-radius: 50px;
            font-size: 16px;
            font-weight: bold;
            cursor: pointer;
            transition: all 0.3s;
            text-decoration: none;
            display: inline-block;
        }

        .btn-primary {
            background: linear-gradient(45deg, #4a90e2, #357abd);
            color: white;
        }

        .btn-primary:hover {
            transform: translateY(-2px);
            box-shadow: 0 10px 20px rgba(74, 144, 226, 0.3);
        }

        .btn-secondary {
            background: transparent;
            color: white;
            border: 2px solid white;
        }

        .btn-secondary:hover {
            background: white;
            color: #2c3e50;
        }

        .features-highlight {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 30px;
            margin: 60px 0;
        }

        .highlight-item {
            text-align: center;
            padding: 30px 20px;
        }

        .highlight-icon {
            width: 60px;
            height: 60px;
            background: linear-gradient(45deg, #4a90e2, #357abd);
            border-radius: 50%;
            margin: 0 auto 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            color: white;
        }

        .highlight-title {
            font-size: 18px;
            font-weight: bold;
            color: #2c3e50;
            margin-bottom: 10px;
        }

        .highlight-text {
            color: #7f8c8d;
            line-height: 1.5;
        }


          /*****************************************************
/*****************************************************
/*****************************************************/



/* .tekst-box p{

  margin-top: 1rem;
  margin-left:3rem;
  
} */

.tekst-box-pap {
  display: flex;
  margin: 1rem;
  margin-bottom: 3rem;
  animation: box 1.5s ease-in ;
  left: -7%;
  width: 100%;
  text-align: center;
  pointer-events: none;
}

.akapit{
width: 100%;
  margin-left: 3%;
  font-weight: bold;
   color: rgb(41, 152, 156);
}

.box-akapit{
position:relative;
width: 100%;
}


@keyframes box {
  from {
    opacity: 0;
  }
  to {
        opacity: 1;
  }
  
}


.tekst-box-pap img {

  width: 7%;
  max-width: 10%;
  max-height: 10%;
  height: 10%;

  

}

.tekst-box-pap p{
  font-size: 1.3rem;
  margin: 0;
  margin-left: 3%;
  padding:0;


}


@keyframes przesun {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}



.wycena{

  width: 30%;
  height: 10%;
  background-color: #0077b5;
  justify-content: center;
  align-items: center;
  display: flex;

    /* background: rgba(255, 255, 255, 0.2);
            color: #2d3748;
            padding: 16px 32px;
            border: 1px solid rgba(255, 255, 255, 0.3);
            border-radius: 15px;
            font-size: 16px;
            font-weight: 600;
            cursor: pointer;
            backdrop-filter: blur(10px);
            transition: all 0.3s ease;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); */

}

   .wycena:hover {
            background: #1e5e81;
            transform: translateY(-2px);
            box-shadow: 10px 15px 25px rgba(0, 0, 0, 0.40);
        }


.wycena a{

 color: white;
  font-weight: 700;
            text-decoration: none; /*usuwa podkreśl.*/

}

/* animacja: lekki obrót w lewo i prawo */
/* @keyframes chustanie {
  0%   { transform: rotate(0deg); }
  12%   { transform: rotate(-2deg); }
  25%  { transform: rotate(-5deg); }
  50%  { transform: rotate(0deg); }
  63%  { transform: rotate(2deg); }
  75%  { transform: rotate(5deg); }
  100% { transform: rotate(0deg); }
} */


/*****************************************************

/*****************************************************
/*****************************************************
/*****************************************************
/*****************************************************
/*****************************************************
/*****************************************************/




    #Kontakt{

       display: flex; 
       flex-direction: column;
       
       padding-top: 1rem;
        
      gap: 3vh;
       
        min-height: 50vh;
        overflow: hidden;
        overflow-y: hidden;
      
          /* scroll-snap-align: start;
  scroll-snap-stop: normal;     */
      
        }




        .wrapper_formularz{
            
    /*background-color: black;*/
        display: flex;
        position: relative;
        justify-content: center;
       
        overflow: hidden;
       
        padding-top: 2rem;
        
        min-height: 75vh;
        
        }
        
    .formularz{
        
     
			
        
           
            
			min-width: 30vw;
			border-radius: 2rem;
            max-height: 50vh;
           
          
			
           
         

    }

    

    

 



/*
#Media_społecznościowe{
    
    max-height: 30vh;
    min-height: 30vh;
   background-color: black;
    display: flex;
    flex-direction: column;
    gap: 5vh;

    

}
*/






footer{

    min-height: 10vh;
    margin-top: 2rem;
    
}

.mediabody h6{

display: flex;
position: relative;
padding-top: 2rem;

justify-content: center;
text-align: center;
overflow: hidden;


font-family: "Orbitron", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal;
    font-size: 1rem;
    color: white;

}

    .mediabody {
        margin-top: 1.5rem;
        padding-top: 1rem;
        
        background-color: black;
       
       display: flex;
       flex-direction: column;
        justify-content: center;
        align-content: center;
        align-self: center;
        
        min-height: 10vh;
        max-width: 100vw;
        min-width: 100vw;
        
      }
      
      .mediabody ul {
        display: flex;
        position: relative;
        align-content: center;
        
        justify-content: center;
        
      }
      
      .mediabody ul li {
        list-style: none;
      }
      /*
      .mediabody ul li a {
        width: 80px;
        height: 80px;
        background-color: #fff;
        text-align: center;
        line-height: 80px;
        font-size: 35px;
        margin: 0 10px;
        display: block;
        border-radius: 50%;
        position: relative;
        overflow: hidden;
        border: 3px solid #fff;
        z-index: 1;
      }
*/
      .mediabody ul li a {
        width: 5rem;
        height: 5rem;
        background-color: #fff;
        text-align: center;
        line-height: 5rem;
        font-size: 3rem;
        margin: 0 1rem;
        display: block;
        border-radius: 50%;
        position: relative;
        overflow: hidden;
        border: 3px solid #fff;
        z-index: 1;
      }
      
      .mediabody ul li a .icon {
        position: relative;
        color: #262626;
        transition: .5s;
        z-index: 3;
      }
      
      .mediabody ul li a:hover .icon {
        color: #fff;
        transform: rotateY(360deg);
      }
      
      .mediabody ul li a:before {
        content: "";
        position: absolute;
        top: 90%;
        left: 0;
        width: 100%;
        height: 100%;
        background: #f00;
        transition: .5s;
        z-index: 2;
      }
      
      .mediabody ul li a:hover:before {
        top: 0;
      }
      
      .mediabody ul li:nth-child(1) a:before{
        background: #3b5999;
      }
      
      
      .mediabody ul li:nth-child(2) a:before {
        background: #f09433; 
        background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
        background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
        background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
      }
      

      /*
      .mediabody ul li:nth-child(2) a:before{
        background: black;
      }*/
      
      .mediabody ul li:nth-child(3) a:before {
        background: #0077b5;
      }
      
      .mediabody ul li:nth-child(4) a:before {
        background: #f09433; 
background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
      }
      


      #przyciski{
        display: flex;
        /* flex-direction: column; */
        justify-content: center;
        align-items: center;
        gap: 1rem;
        margin-left: 3.5rem;
      
    }

    

#przyciski input[type=submit]{
        font-size: 1.5rem;
        font-weight: 900;
        padding: 0.5rem 3vw;
        border: 1;
        /* border-radius: 15rem; */
        
        background-color: black;
        color: white;
        width: 40%;
    

        
    }

#przyciski input[type=reset]{

        width: 3rem;
        height:3rem;
        border-radius: 50% ;
        background-image: url("../images/undo.png");        
        background-size:cover;
        background-color: transparent;
        border-bottom: 0;
        transform: rotate(0deg);
}

#przyciski input[type=reset]:hover{
        background-color: darkred;
        color: white;
        transform: rotate(360deg);
        /* animation: 0.5s refresh linear forwards; */
    }

@keyframes refresh {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
  
}

#przyciski input[type=submit]:hover{
        background-color: forestgreen;

         transform: translateY(-2px);
            box-shadow: 0 10px 20px rgba(1, 175, 30, 0.3);
        color: #fff;
    }
    


    

    .formularz header{
        background-color: transparent;
        color: black;
        padding: 2rem;
        display: block;
        justify-content: center;
        opacity: 1;

    }
    .formularz header h2{
        font-size: 3rem;
        text-transform: uppercase;
        margin: 0;
        text-align:center;
        justify-content: center; 

          font-family: "Orbitron", bold;
          font-weight: 700;
          font-style: normal;

   
    }
    .formularz main{
        padding: 2rem;
        margin-top: 0;
        padding-top: 0;
    }
    .formularz main label{
        padding: .5rem 1rem;
        display: block;
        color: #aaa;
        font-size: 1.5rem;
    }
    .formularz main input{
        margin-bottom: 1rem;
        width: 100%;
        padding: .5rem 1rem;
        border: 0;
        border-bottom: 1px solid #302e2e;
        font-size: 1.6rem;
    }
    .formularz main input:focus{
        outline: 0;
        background-color: #eee;
        padding-left: 1.5rem;
    }
    ::placeholder{
        font-style: italic;
        font-weight: 300;
        color: #ccc;
        font-size: 1rem;
    }

 
    
    .formularz main textarea{
        resize: vertical;
        width: 100%;
        border: 2px solid #eee;
        border-radius: 0;
        min-height: 10rem;
        font-size: 1rem;
        
    }
    .formularz main textarea:focus{
        outline: 0;
        background-color: #eee;
        
    }

    #zgody{
        margin-bottom: 0.5rem;
       
    }
    #zgody a{
        color: indianred;
    }
    #zgody input{
        /*transform: translateY(3px);
        transform: translate(-10px);*/
        position: relative;
       width: fit-content;
       left: 0;
        margin-bottom: 1rem;
    }

    #zgody label{

        display: inline;
        font-size: 0.8rem;
        color: black;
        text-align: left;
        padding-left: 0;
    }






  /* Media Queries */


 @media (max-width: 1570px)  {

* { transition: none !important; }

html {

 scroll-snap-type: y mandatory; /* zamiast mandatory */
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch; /* włącz na iOS dla momentumu */

}

.theme{
    /* scroll-snap-align:start ;
  scroll-snap-stop:normal; */

  /* usuń: scroll-snap-align:start; */
  /* overflow: hidden;              
  height: auto;                  */


  height: auto !important;
  min-height: auto !important;
  max-height: none !important;
  overflow: visible !important;   
  /* scroll-snap-align: unset;  */

  /* contain: none !important; */

  scroll-snap-align: unset;
  scroll-snap-stop: unset;

}

.section {
  /* height: 100svh; */
  /* scroll-snap-align: start !important; */
  /* scroll-snap-stop: always !important; */
  /* overflow: hidden;        brak wewn. scrollerów na całej sekcji */
  /* min-height: 100vh; */
}




 #Transport{
   
 scroll-snap-align: start !important;
  scroll-snap-stop: normal !important;
   /* overflow-y: auto !important; */
   overflow-x: hidden;

 }

 #Firma{
  scroll-snap-align: start !important;
  scroll-snap-stop: normal !important;
    /* overflow: visible !important; */
    overflow-y: auto !important;
    overflow-x: hidden;
    padding-top: 5rem;
    margin-bottom: 100px;

}
#Kontakt{
    scroll-snap-align: start !important;
  scroll-snap-stop: normal !important;
    overflow: visible !important;
    /* overflow-y: auto; */
    /* overflow-y: visible; */
    overflow-x: hidden;
    /* padding-bottom: 100px; */
    
}



     .logo-kontener p{
    opacity: 0;
      pointer-events: none;
  }

  .Trans-pudlo{
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: auto;
    margin-top: 4rem;
 }

.Trans-pudlo > * {
    
    max-width: 70%;
 
}
 .Trans-fotka img {
    left: 5%;
    top:15%;
   
 }

 

 .tekst-box-body
{
    /* width: 90%; */
    margin-top: 1rem;
  
    
}

.tekst-box {

  padding-bottom: 150px;

}
.Firma-wrapper{
    padding-bottom: 150px;
}


 .tekst-box-header h1{
  font-size: 3rem;
  left: -60%;
  top: -10%;
 }

 .tekst-box-header h2{
  font-size: 2rem;
  left: -50%;
  top: 0%;
 }

 .tekst-box-pap img {
    width: 10%;
    max-width: 15%;
    max-height: 15%;
    height: 15%;
}

/* Update ribbon - remove absolute positioning */
.ribbon {
  display: flex;
    justify-content: center;
    position: relative; /* Changed from absolute */



    background: linear-gradient(135deg, #4781d7, #c0392b);
    color: white;
    padding: 1rem 3rem 1rem 5rem;
    transform: rotate(0deg);
    box-shadow: 0 10px 20px rgba(231, 76, 60, 0.3);
    /* Remove top and left properties */
     pointer-events: none;
}

.ribbon-wrapper {
  position: relative;
  width: 100vw;
  margin-bottom: 5vh;
  /* top: 16%; */
  /* left: -1%; */
  z-index: 10;
  font-size: 1.2rem;
  pointer-events: none;
}

.ribbon h1 {

 pointer-events: none;
}

/* Update subtitle - now relative to wrapper */
.subtitle-3 {
    position: absolute;
    top: 115%;        /* Relative to ribbon-wrapper, not viewport */
    left: 20%;       /* Relative to ribbon-wrapper, not viewport */
    font-size: 1.6rem;
    color: #2c3e50;
    font-weight: 700;
    font-style: italic;
    transform: rotate(0deg);
    /* Remove the viewport-based positioning */
     pointer-events: none;
}



.subtitle-3{
  top: 105%;
}


.wrapper_formularz {


    min-height: 800px;
}

.service-card{

   scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
}

footer {
    scroll-snap-align: start;
  scroll-snap-stop: always;  /* łatwiej go trafić */
}


 }

  @media (max-width: 1280px)  {

/* .ribbon-wrapper{

  font-size: 1.8rem;
} */



    .subtitle-3{
  top: 100%;
  font-size: 1.5rem;
}
.ribbon h1 {
    font-size: 1.9rem;

  }

}
  @media (max-width: 1024px) {
  .theme {
    width: 100vw;
  }

  /* .subtitle-3{
    top: 40%;
  } */

  .cta-section {
    position: relative;
    left: 7%;
    margin-bottom: 100px;
     scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
  }

.Trans-pudlo > * {
    
    max-width: 95%;
}

.tekst-box-body
{
    width: 90%;
    margin-top: 1rem;
    position: relative;
    left: -3%;
  
    
}

.tekst-box-pap img{
    width: 7%;
    max-width: 15%;
    max-height: 15%;
    height: 10%;
}
.akapit{
    font-size: 1.3rem;
}

.tekst-box-pap p{

    font-size: 1rem;
   
}

 .Trans-fotka img {
    left: 5%;
    top:20%;
   
 }


  .tekst-wewnetrzny {
    font-size: 1.8vw;
    width: 80%;
  }

  .logo-kontener p{
    opacity: 0;
    pointer-events: none;
  
  }

  .cta-title {

    font-size: 1.8rem;
    display: flex;
    justify-content: center;

  }




/* HAMURGER
...............................................
.............................................. */

    .hamburger {
        display: flex;
    }

    .hamburger.hidden {
        display: none;
    }

    .close-menu.active {
        display: block;
    }

    /* Target the correct navigation structure */
    .nav_wrapper ol {
      list-style: none;
      text-decoration: none   ;
        position: fixed;
        top: 0;
        right: -100%;
        height: 100vh;
        width: 100vw;
        background: #1a1a1a;
        opacity: 0.95;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        
        transition: right 0.5s ease;
        z-index: 1000;
        box-shadow: -5px 0 15px rgba(0,0,0,0.3);
        gap: 60px; 
    }

    .nav_wrapper ol.active {
        right: 0;
    }

    .nav_wrapper ol li a {
        font-size: 24px;
        opacity: 0;
        transform: translateX(50px);
        transition: all 0.5s ease;
        background-color: transparent;
        
    }

    .nav_wrapper ol.active li a {
        opacity: 1;
        transform: translateX(0);
    }

    .nav_wrapper ol.active li:nth-child(1) a {
        transition-delay: 0.1s;
    }

    .nav_wrapper ol.active li:nth-child(2) a {
        transition-delay: 0.2s;
    }

    .nav_wrapper ol.active li:nth-child(3) a {
        transition-delay: 0.3s;
    }


  .section-title {
    font-size: 2.5rem;
  }


.ribbon-wrapper {
  
  top: 16%;
}

    .subtitle-3{
  top: 100%;
  font-size: 1.5rem;
}
.ribbon h1 {
    font-size: 1.9rem;

  }



/* KONTAKT */

  .formularz header h2 {

    display: flex;
    font-size: 2rem;
  }





     #przyciski input[type="submit"] {
  font-size: 1.3rem;
 
  width: 60%;

}



}


/* HAMURGER KONIEC
...............................................
.............................................. */

  



@media (max-width: 768px) {
  .theme {

    /* height: auto;
    overflow: visible; */
  }

    .logo-kontener p{
    opacity: 0;
    pointer-events: none;
  
  }

  .tekst-box-pap img{
    width: 10%;
    max-width: 15%;
    max-height: 15%;
    height: 15%;
}

 .Trans-fotka img {
    left: 0%;
    top: 26%;
    width: 115%;
    margin-top: 2rem;
    margin-bottom: 1rem;
  }


  .ribbon-wrapper{

    top:18%;
  }

/* ribbon */
    .subtitle-3{
  top: 100%;
  font-size: 1.3rem;
}
.ribbon{
  top:14%
}
.ribbon h1 {
    font-size: 1.5rem;

  }



  .pierwsza,
  .druga {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .pierwsza img,
  .druga img {
    min-width: 90%;
    max-height: none;
    border-radius: 20px;
    mask-image: none;
    -webkit-mask-image: none;
  }

  .pierwsza p,
  .druga p {
    max-width: 90%;
    min-width: unset;
    background-position-y: center;
    font-size: 1.1rem;
  }

  .tekst-wewnetrzny {
    font-size: 1.1rem;
    width: 90%;
  }


        .section-title {
                font-size: 36px;
            }
            
            .services-grid {
                grid-template-columns: 1fr;
            }
            
            .cta-buttons {
                flex-direction: column;
                align-items: center;
            }
            
            .nav-links {
                gap: 20px;
            }


}

@media (max-width: 594px)
{

  .ribbon-wrapper{

    top:18%;
  }

/* ribbon */
    .subtitle-3{
  top: 100%;
  font-size: 1.2rem;
}
.ribbon{
  top:14%
}
.ribbon h1 {
    font-size: 1.3rem;

  }

.Trans-pudlo > * {
    
    max-width: 95%;
}



    .Trans-fotka img {
    left: -5%;
    top: 28%;
    width: 120%;
    }


     #przyciski input[type="submit"] {
  font-size: 1.3rem;
 
  width: 60%;

}


  #zgody label
  {
    font-size: 0.8rem;
   
  }
 .mediabody h6{
  font-size: 0.8rem;
 }

}


@media (max-width: 448px)

{

  .akapit {
    font-size: 1.1rem;
  }

   .tekst-box-pap p {
    font-size: 0.9rem;
  }

 .cta-title {
    font-size: 1.5rem;

 }
 .cta-description {
  font-size: 0.9rem;
 }


.btn {

  font-size: .8rem;
}



  .ribbon-wrapper{

    top:14%;
 
  }

/* ribbon */
    .subtitle-3{
  top: 100%;
  font-size: 1.1rem;
}
.ribbon{
  top:14%;
  padding: 1rem 1rem 1rem 1rem;
}
.ribbon h1 {
    font-size: 1.2rem;

  }

  

 .Trans-fotka img {
    left: -11%;
    top: 28%;
    width: 125%;
  }

  /* kontakt */

  #zgody label
  {
    font-size: 0.6rem;
   
  }
 .mediabody h6{
  font-size: 0.6rem;
 }



}





@media (max-width: 350px){

  .ribbon {
    top: 16%;
  }

.ribbon h1 {
    font-size: 0.9rem;


}


  .Trans-fotka img {
    left: -15%;
    top: 28%;
    width: 120%;
  }


 .subtitle-3 {
    top:110%;
    font-size: 0.8rem;
  }


 }


