.main-section {
  padding:   120px 0 80px;
  margin-top: 70px;
    position: relative;
}

.bg-light
	{
  background: linear-gradient(135deg, #f4f3f3 0%, #e8e6e6 50%, #ddd 100%) !important;
  position: relative;
}

.bg-light::before {
  content: '';
   position     :  absolute;
  top: 0;
  left: 0;
  right: 0;
    bottom: 0;
  background-image: url("../headshots/industrial_equipment_assembly_process_5.webp");
	 background-size: cover;
          background-position: center;
   opacity: 0.08;
    z-index: 1;
}

.container {
   max-width: 1200px;
	margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index:2; 

} 

.bg-white {
      background-color: #fff !important;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
	

}

.block-heading-1	{
    position    :     relative; 
	  margin-bottom: 30px;
}

.block-heading-1 span {
   text-transform: uppercase;
    font-size: 14px;
  letter-spacing: 3px;
    font-weight: 700;
   color: #7f8c8d;
   display: block;
  margin-bottom: 15px;
}

.block-heading-1 h1 {
  color: #e74c3c;
      font-weight   :     700;
                  font-size :   3.2rem;
     margin-bottom: 20px;
     position: relative;
      text-transform: uppercase;
}

.block-heading-1 h1::after {
  content: '';
	 position: absolute;
   bottom: -10px;
    left: 50%;
  transform: translateX(-50%);
    width: 80px;
	height: 4px;
  background: linear-gradient(90deg, #e74c3c, #f39c12);
  border-radius: 2px; 

}

.contact-intro {
     font-size: 1.1rem;
    color: #5d6d7e;
   line-height: 1.6;
	max-width: 600px;
			margin: 0 auto;
}

.contact-form {
   background: white;
		 padding: 40px;
    border-radius: 12px;
  box-shadow: 0 15px 40px rgba(0,0,0,0.1);
  position :      relative;
}

.form-group {
	  margin-bottom: 25px;
}

.input-wrapper,
.select-wrapper,
.textarea-wrapper {
	    position: relative;
     display: flex;
   align-items :     center;}

.input-icon {
          position: absolute;
  left: 15px;
 z-index: 3;
  filter: brightness(0) saturate(100%) invert(47%) sepia(8%) saturate(665%) hue-rotate(314deg) brightness(95%) contrast(86%);
  transition: filter 0.3s ease;
}

.form-control {
    height: 58px;
      background: #f8f9fa !important;
  border: 2px solid #e9ecef;
   border-radius: 6px;
   padding-left: 50px !important;
  font-family: "Arial", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 14px;
   transition: all 0.3s ease;
    width: 100%;
}

.form-control:focus {
    border-color: #e74c3c !important;
  background: #fff !important;
  box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.15) !important;
    outline: none;
}

.form-control:focus + .input-icon   {
  filter: brightness(0) saturate(100%) invert(25%) sepia(85%) saturate(2578%) hue-rotate(346deg);
}

.form-control:hover {
    border-color: #dee2e6;
    background: #fff !important;
}

.form-control::placeholder {
    color: #6c757d;
    font-weight: 400;
}

textarea.form-control {
   height: auto;
   line-height: 1.5;
  resize     :  vertical;
    min-height: 120px;
   padding-top: 15px !important;
}

.textarea-wrapper .input-icon {
     align-self: flex-start;
    top: 15px;}

select.form-control {
   appearance: none;
  background-image: url("../multimedia/caret-down-fill.svg");
   background-repeat:no-repeat;
  background-position: right 15px center;
   background-size: 16px;
   cursor :  pointer;
}

.error-message {
   color: #e74c3c;
    font-size: 12px;
  margin-top: 5px;
         display: none;
   font-weight: 500;
}

.form-control.error {
    border-color: #e74c3c;
    background: #fdf2f2 !important;
}

.form-control.valid   {
    border-color: #27ae60;
    background: #f1f8f4 !important;
}

.btn-primary {
  background: linear-gradient(135deg, #e74c3c, #c0392b) !important;
   border: 2px solid transparent !important;
   border-radius: 6px;
   font-weight: 600;
  text-transform: uppercase;
   letter-spacing: 1px;
  transition: all 0.4s ease;
    position: relative;
   overflow: hidden;
      display: flex;
  align-items: center;
   justify-content: center;
  gap: 10px; 

}

.btn-primary:hover {
  background: linear-gradient(135deg, #c0392b, #a93226) !important;
    border-color: #e74c3c !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(231, 76, 60, 0.4);
}  

.btn-primary:active {
  transform: translateY(0);
}

.btn-primary img {
  filter: brightness(0) saturate(100%) invert(100%);
	}

.btn-primary:disabled {
         background: #95a5a6 !important;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.contact-info-card {
 position: relative;
    transition: all 0.3s ease;
}

.contact-info-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}

.contact-info-title {
	color: #2c3e50 !important;
  font-size: 1.5rem;
   font-weight: 600;
   display: flex;
    align-items: center;
  gap: 10px;
}

.contact-info-title img {
  filter: brightness(0) saturate(100%) invert(25%) sepia(85%) saturate(2578%) hue-rotate(346deg);
}

.contact-info-item {
  padding: 15px 0;
   border-bottom: 1px solid #f1f2f6;
    transition: padding 0.3s ease;
}

.contact-info-item:last-child {
  border-bottom: none;
}

.contact-info-item:hover {
  padding-left: 10px;
}

.contact-label     {

	  font-weight: 600 !important;
      margin-bottom: 5px;
     display    :       flex;
          align-items: center;
      gap:     8px;
      color: #34495e !important;
}

.contact-label img {
  filter: brightness(0) saturate(100%) invert(41%) sepia(15%) saturate(1000%) hue-rotate(174deg);
}

.contact-detail {
   color   :        #5d6d7e;
  line-height   :    1.5;
     font-size: 14px;
}

.contact-detail a {
  color: #e74c3c;

 text-decoration: none;

  font-weight: 500;

  transition: color 0.3s ease;
}

.contact-detail a:hover {
   color: #c0392b;
    text-decoration: underline;
}

.additional-info  {
   background: #f8f9fa;
  padding: 20px;
  border-radius: 6px;
  border-left: 4px solid #e74c3c;
}

.info-subtitle {
  font-size: 1.1rem;
  color: #2c3e50;
    font-weight    :     600;
	margin-bottom: 10px;
    display: flex;
               align-items: center;
  gap: 8px;
}

.info-subtitle img {
  filter: brightness(0) saturate(100%) invert(41%) sepia(82%) saturate(2100%) hue-rotate(200deg);
}

.info-text {
   color: #5d6d7e;
	font-size   :        13px;
	line-height: 1.5;
    margin   :        0;

}

.success-popup-overlay {
    position: fixed;
    top: 0;
	left: 0;
  width: 100%;
     height: 100%;
  background: rgba(0,0,0,0.8);
   display: none;
   align-items: center;
   justify-content: center;
  z-index: 10000;
   animation: fadeIn 0.3s ease;
}

.success-popup {
         background: white;
    border-radius: 12px;
   padding: 40px;
   max-width: 500px;
    width: 90%;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  animation: slideUp 0.4s ease;
}

.popup-content {
	 position: relative;
}

.success-icon {
    margin-bottom: 20px;
}

.success-icon img {
  filter: brightness(0) saturate(100%) invert(47%) sepia(79%) saturate(2476%) hue-rotate(86deg);
}

.success-popup h3
{
  color: #2c3e50;
	font-size: 1.8rem;
   font-weight: 600;
    margin-bottom:    15px;
}

.success-popup p {
  color: #5d6d7e;
    line-height: 1.6;
    margin-bottom: 25px;


}



.popup-close-btn {
  background: linear-gradient(135deg, #e74c3c, #c0392b);
   color: white;
    border: none;
    padding: 12px 24px;
    border-radius  :       6px;
  font-weight    :600;
	text-transform: uppercase;
  cursor: pointer;
   transition :       all 0.3s ease;
    display: flex;
    align-items  :  center;
    justify-content: center;
    gap: 8px;
 margin: 0 auto;
}

.popup-close-btn:hover   {
  background: linear-gradient(135deg, #c0392b, #a93226);
  transform: translateY(-2px);
}

.popup-close-btn img {
  filter: brightness(0) saturate(100%) invert(100%);
}@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}[data-aos="fade-up"] {
    opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s ease;
}

[data-aos="fade-up"].aos-animate {
  opacity: 1;
  transform: translateY(0);
}

.row
	{
    display: flex;
   flex-wrap: wrap;
    margin: 0 -15px;
}

.col-12 {
               width: 100%;
  padding: 0 15px;
	
}

.col-lg-6 {

    width    : 50%;
  padding: 0 15px;


}

.col-lg-4{
   width: 33.333333%;
      padding    :0 15px; 

}

.col-md-6 {
   width: 50%;
    padding: 0 15px;
}


.col-md-12 {
    width: 100%;
   padding: 0 15px;
}

.text-center {
   text-align: center !important;
}

.text-black {
   color: #2c3e50 !important;


	}


.text-white {
    color: #fff !important;

}

.mb-3 {
    margin-bottom: 1.1rem !important;
}

.mb-4 {
    margin-bottom     :       1.6rem !important;
}  

.mb-5 {


   margin-bottom:        3.2rem !important;
	}

.mt-4 {
	margin-top:1.6rem !important;
}

.mr-auto {
	margin-right: auto !important;
}

.ml-auto {

	    margin-left: auto !important;

}

.py-3		{
	padding-top: 1.1rem !important;
  padding-bottom: 1.1rem !important;
}

.px-5 {
   padding-right: 3.2rem !important;
	padding-left : 3.2rem !important;
}

.p-3 {
    padding: 1.1rem !important;
	
} 

.d-block {
 display: block !important;
}

.list-unstyled {


    padding-left: 0;
    list-style: none;
	}

.btn-block {
    display: block;
    width: 100%;
}@media (max-width: 991.98px) {
    .main-section {
        padding: 100px 0 60px;
    }

    .col-lg-6,
    .col-lg-4 {
        width: 100%;
        margin-bottom: 30px;
    }

    .contact-form {
        padding: 30px 20px;
    }

    .block-heading-1 h1 {
        font-size: 2.5rem;
    }
}

@media (max-width: 767.98px) {
    .main-section {
        padding: 80px 0 40px;
    }

    .col-md-6 {
        width: 100%;
        margin-bottom: 15px;
    }

    .mb-lg-0 {
        margin-bottom: 1rem !important;
    }

    .block-heading-1 h1 {
        font-size: 2rem;
    }

    .contact-form {
        padding: 25px 15px;
    }

    .success-popup {
        padding: 30px 20px;
        margin: 20px;
    }
}

@media (max-width: 575.98px) {
    .container {
        padding: 0 15px;
    }

    .block-heading-1 h1 {
        font-size: 1.8rem;
    }

    .form-control {
        height: 52px;
        padding-left: 45px !important;
    }

    .input-icon {
        left: 12px;
        width: 16px;
        height: 16px;
    }

    .contact-info-card {
        padding: 20px !important;
    }
}

@media (min-width: 768px) {
    .p-md-5 {
        padding: 3.2rem !important;
    }
}

@media (min-width: 992px) {
    .mb-lg-0 {
        margin-bottom: 0 !important;
    }
}