*{
   margin: 0;
   padding :0;
	box-sizing: border-box;
}

body {


  line-height: 1.7;
  color: #4a4a4a;
  font-weight: 400;
  font-size: 1rem;
  font-family: "Arial", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.content-container {
	padding: 0 20px;
  margin: 0 auto;
	max-width: 1200px;
}

.main-navigation {
   position: fixed;
   top: 0;
    width: 100%;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
   z-index: 1000;
   transition: all 0.3s ease;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.nav-wrapper {
  display   :       flex;
   justify-content: space-between;
   align-items: center;
    padding: 15px 20px;
   max-width: 1200px;
    margin: 0 auto;
}

.logo-section {
	display: flex;
   align-items: center;
    gap: 12px;
}  

.company-logo {


  width: 40px;

	   height: 40px;

	   object-fit: contain;


}

.brand-name {
  font-size: 1.5rem;
   font-weight  :       700;
  color :     #2c3e50;
    text-transform: uppercase;
   letter-spacing: 1px;


}

.nav-links {
   display: flex;
    list-style: none;
   gap: 30px;
}

.nav-item {

	   padding: 10px 18px;
   transition: all 0.3s ease;
    text-decoration: none;
   gap: 8px;
                    color: #2c3e50;
   display: flex;
   align-items: center;
   border-radius: 6px;
    font-weight: 500;
	}

.nav-item.active {
    background: #3498db;
  color: white;


}

.nav-item:hover {
    background: #e74c3c;
   color: white;
  transform: translateY(-2px);
}

.nav-icon {
  filter: brightness(0) saturate(100%);
   transition: filter 0.3s ease;
}

.nav-item:hover .nav-icon,
.nav-item.active .nav-icon {
  filter: brightness(0) saturate(100%) invert(100%); 

}

.mobile-menu-toggle {
  display: none;
  flex-direction: column;
   cursor     : pointer;
   gap     : 4px;
    padding: 8px; 

}

.burger-line {
  width: 25px;
	height: 3px;
  background: #2c3e50;
          transition: all 0.3s ease;
  border-radius: 2px;
}


.hero-banner {
    padding: 200px 0 180px;
   margin-top:     70px;
          position: relative;
  overflow: hidden;


}

.industrial-bg {
  background-color: #34495e;

	  background-image: url("../headshots/welding_robots_automated_systems_4.webp");

	    background-repeat: no-repeat;

	  background-position: center;

	                    background-size: cover;

	    position   :      relative;
}

.industrial-bg::before {
  content: '';
    position     :      absolute;
	 top: 0;
    left: 0;
    right   :      0;
   bottom: 0;
  background: linear-gradient(135deg, rgba(52, 73, 94, 0.8), rgba(44, 62, 80, 0.6));
}

.hero-content-wrapper {
 position: relative;
  z-index: 2;
}

.hero-text-block {
  padding-left: 100px;
        max-width: 600px;
    margin-left: auto;
}

.hero-banner h1 {
     color: #fff;
	 text-transform: uppercase;
  font-family: "Arial", sans-serif;
    font-size: 4.5rem;
    font-weight     :700;
  line-height: 1.1;
  margin-bottom: 20px;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);

}

.hero-banner h2 {
    color: #fff;
  font-family: "Arial", sans-serif;
	text-transform: uppercase;
    font-size: 3rem;
  font-weight: 700;
    margin-bottom: 30px;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}

.cta-button-wrapper {


  margin-top: 40px;}

.primary-cta-btn {
  color: #fff;
	  background: linear-gradient(135deg, #e74c3c, #c0392b);
	  font-family: "Arial", sans-serif;
	   text-transform: uppercase;
	   font-size   :      14px;
	   font-weight: 600;
	  border: 2px solid transparent;
	  display: inline-flex;
	                    align-items: center;
	   gap: 10px;
	   padding: 15px 30px;
	    border-radius: 5px;
		 text-decoration: none;
	   transition: all 0.5s;
	  box-shadow: 0 4px 15px rgba(231, 76, 60, 0.3);


}

.primary-cta-btn:hover {
	 color: #e74c3c;
  background: transparent;
  border     :     2px solid #e74c3c;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(231, 76, 60, 0.4);
}

.primary-cta-btn img
{
  filter: brightness(0) saturate(100%) invert(100%);
    transition: filter 0.3s ease;
}

.primary-cta-btn:hover img	{
  filter: brightness(0) saturate(100%) invert(25%) sepia(85%) saturate(2578%) hue-rotate(346deg);
}

.company-overview {
   padding: 7em 0;
     background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

.section-layout {
   display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items     :     center;
}

.section-heading-wrapper
	{
   position: relative;
}

.section-title {
    font-size: 2.5rem;
  position: relative;
  padding-top: 30px;
   z-index: 2;
   text-transform: uppercase;
    font-weight: 800;
  color: #2c3e50;
   margin-bottom: 30px;
}

.section-title::before {
  width: 80px;
   height: 3px;
  background: linear-gradient(90deg, #e74c3c, #f39c12);
  content: "";
  position : absolute;
    top: 0;
  left: 0;
  border-radius: 2px;
}

.text-content-area p {
  margin-bottom: 20px;
   font-size  :1.1rem;
  line-height: 1.6;
}

.feature-highlights {
        display: flex;
    flex-direction: column;
  gap: 15px;
    margin-top: 30px;
}

.feature-item {
  display: flex;
   align-items: center;
    gap: 12px;
   padding: 12px 0; 
	
}

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

.feature-item span {
     font-weight: 600;
     color: #2c3e50;


}

.visual-content-area {
  position  :     relative;
}

.primary-image,
.overlay-image {
       max-width: 100%;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
	
}

.overlay-image {
  bottom: -20%;
    right   :        -10%;
    max-width:     70%;
  position: absolute;
  border: 10px solid #fff;
  box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}

.process-section


{
   padding: 5em 0;
    background :       #fff;
}

.process-header {
   max-width: 600px;
    margin: 0 auto 50px;
}

.process-header h2 {
	font-size: 2.5rem;
   color: #2c3e50;
    margin-bottom: 20px;
}

.process-workflow{
	display: flex;
   justify-content: space-between;
   align-items: center;
}

.workflow-step {
    width: 20%;
    display   :   inline-block;
  text-align: center;
   position: relative;
}

.workflow-step::after {
          width: 100%;
   height: 4px;
  content: "";
  position  :      absolute;
  z-index: -1;
   top: 27px;
  background: linear-gradient(90deg, #3498db, #2980b9);
	border-radius: 3px;
}  

.workflow-step:last-child::after {
  display: none;
}

.step-indicator {
	  z-index: 1;
    width: 64px;
    height: 64px;
  border: 4px solid #3498db;
  background: #fff;
  border-radius: 50%;
	color: #3498db;
   display: block;
  position: relative;
    margin   :       0 auto 12px auto;
   transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(52, 152, 219, 0.3);


}

.workflow-step:hover .step-indicator {
	   background: #3498db;
  color: #fff;
  transform: scale(1.1);


}

.step-indicator img
{
          position: absolute;
  top: 8px;
        left: 8px;
  filter: brightness(0) saturate(100%) invert(41%) sepia(82%) saturate(2100%) hue-rotate(200deg);
	transition: filter 0.3s ease;
}

.workflow-step:hover .step-indicator img {

  filter: brightness(0) saturate(100%) invert(100%);
     }

.step-indicator > span {
   position: absolute;
    bottom: 4px;
   right: 4px;
	font-size: 0.8rem;
    font-weight: 700;
   background :  #e74c3c;
	 color: white;
    width: 20px;
   height: 20px;
   border-radius: 50%;
   display: flex;
    align-items: center;
    justify-content: center;
}

.step-description {
    display:   block;
    font-weight: 600;
	color: #2c3e50;
    font-size: 14px;
  line-height: 1.4;
   margin-top    : 8px;
}

.workflow-step:hover .step-description {
  color: #3498db;
}

.equipment-showcase {
	 padding: 7.5rem 0;
	 background: #f8f9fa;
}

.gallery-header {
   max-width     :700px;
  margin: 0 auto 50px;
}

.equipment-title {
    position: relative;
   padding-bottom: 35px;
  margin-bottom: 35px;
   font-size: 2.8rem;
  color: #2c3e50;
    text-align: center;
}

.equipment-title::after {
    bottom: 0;
  left: 50%;
  transform: translateX(-50%);
    width: 60px;
   height :     4px;
  background: linear-gradient(90deg, #e74c3c, #f39c12);
  content: "";
    position: absolute;
    border-radius: 2px;
}

.gallery-description {
   font-size: 1.1rem;
	line-height :   1.6;
    color: #666; 
	
}

.equipment-gallery-grid{
       display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
   gap: 30px;
}

.equipment-card {
    display:  block;
    transition: all 0.4s ease;
    text-decoration  :   none;
      color: inherit;
  background: white;
   border-radius    :  10px;
  overflow: hidden;
  box-shadow: 0 5px 20px rgba(0,0,0,0.1);
   position: relative;

}

.equipment-card:hover     {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}

.card-icon	{
    position: absolute;
   top: 20px;
    right   :  20px;
  background: rgba(255,255,255,0.9);
  padding: 10px;
  border-radius: 50%;
  z-index: 2;
}

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

.equipment-card img:not(.card-icon img) {
  max-width: 100%;
    height: 200px;
  object-fit: cover;
    transition :      transform 0.3s ease;
}

.equipment-card:hover img:not(.card-icon img) {
  transform: scale(1.05);
}

.equipment-card h2 {


   font-size: 1.3rem;
	line-height: 1.6;
  color: #2c3e50;
  margin: 20px;
  margin-bottom: 8px;
     }

.equipment-card span {
    font-size: 14px;
          color: #7f8c8d;
  margin: 0 20px 20px;
   display: block;
}

.cta-section {
   padding: 130px 0;
   text-align: center;
 position: relative;
} 

.industrial-cta-bg{
  background-image: url("../headshots/cnc_machines_manufacturing_floor_1.webp");
   background-repeat: no-repeat;
   background-position: center;
	background-size: cover;
   position: relative;
}

.industrial-cta-bg::before {
  content: ''; 
	  position: absolute; 
	  top: 0; 
	     left: 0; 
	   right : 0; 
	    bottom: 0; 
	  background: linear-gradient(135deg, rgba(231, 76, 60, 0.9), rgba(192, 57, 43, 0.8));
}

.cta-content-wrapper  {
	position: relative;
   z-index: 2;
}

.cta-text-block h2 {
   color: #fff;
  font-family: "Arial", serif;
   font-size: 2.8rem;
  font-weight: 700;
   margin-bottom  :        20px;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

.cta-subtitle {
  color: #fff;
  font-family: "Arial", sans-serif;
  font-size: 1.4rem;
   font-weight: 400;
                    font-style: italic;
  text-transform: capitalize;
        margin-bottom: 30px;
   opacity: 0.9;
}

.cta-action-btn {
   color: #2c3e50;
  background: linear-gradient(135deg, #f39c12, #e67e22);
  font-family: "Arial", sans-serif;
   text-transform: uppercase;
  font-size: 14px;
	font-weight: 600;
   border: 2px solid transparent;
    display: inline-flex;
   align-items: center;
    gap: 10px;
   padding: 15px 35px;
    transition: all 0.5s;
   text-decoration: none;
  border-radius: 4px;
  box-shadow: 0 4px 15px rgba(243, 156, 18, 0.3);
} 

.cta-action-btn:hover
	{
   color: #f39c12;
    background: transparent;
    border: 2px solid #f39c12;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(243, 156, 18, 0.4);
}

.cta-action-btn img {
  filter: brightness(0) saturate(100%) invert(22%) sepia(13%) saturate(1115%) hue-rotate(172deg);
  transition: filter 0.3s ease;
}

.cta-action-btn:hover img {
  filter: brightness(0) saturate(100%) invert(69%) sepia(96%) saturate(2034%) hue-rotate(22deg);
}

.main-footer {
   font-size: 17px;
    padding: 7.5em 0 2em;
   z-index: 0;
	position: relative;
}

.industrial-footer-bg   {
  background-image: url("../headshots/industrial_conveyor_systems_production_1.webp");
       background-repeat     :    no-repeat;
	 background-position:    center;
   background-size: cover;
}

.footer-overlay  
  {
   position: absolute;
  top: 0;
   left: 0;
    right    :0;
    bottom :   0;
  content: '';
    opacity:        0.95;
  background: linear-gradient(135deg, #2c3e50, #34495e);
}

.footer-content-grid {
    display: grid;
   grid-template-columns: 2fr 1fr 1fr 1.5fr;
   gap  :    40px;
   position: relative;
    z-index: 2;
  margin-bottom: 50px;
	
}

.footer-brand {
    font-weight: normal;
  color: #fff;
  margin-bottom: 22px;
  font-size: 1.8rem;
  font-weight: 700;
       text-transform: uppercase;
    letter-spacing: 1px;
}

.footer-heading {
	font-weight: normal;
   color: #fff;
  margin-bottom: 22px;
 font-size: 1.3rem;
   font-weight: 600;
}

.footer-brand-area p {
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 30px;
    line-height : 1.6;
}

.social-links-list {
        display: flex;
    list-style: none;
  gap:      15px;
}

.social-item a {
               height: 45px;
   width: 45px;
  display: flex;
          align-items:center;
    justify-content: center;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
    transition   :      all 0.3s ease;
}

.social-item img {
   width: 24px;
    height: 24px;
  filter: brightness(0) saturate(100%) invert(100%);
}

.social-item a:hover {
	  background: rgba(255, 255, 255, 0.2);
  transform: translateY(-2px);


}

.footer-menu {
    list-style: none;
}

.footer-menu li {
                    margin-bottom: 12px;
}

.footer-link {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  transition: all 0.3s ease;
    padding: 5px 0;
  display: block;
}

.footer-link:hover {
    color: #fff;
    padding-left: 5px;
}

.contact-details ul {
  list-style: none;
}

.contact-details li {

	  display     :  flex;
  align-items   :  flex-start;
  gap: 12px;
    margin-bottom: 16px;
  color: rgba(255, 255, 255, 0.8);
   transition    :      color 0.3s ease;
	}

.contact-details li:hover {
  color: #fff;
}

.contact-details img {
    margin-top :2px;
  filter: brightness(0) saturate(100%) invert(100%);
}

.contact-text {
	flex: 1;
}

.contact-details a {
   color: inherit;
   text-decoration: none;
   display: flex;
   align-items: flex-start;
    gap  :      12px;
   transition: color 0.3s ease;
}

.contact-details a:hover {
  color: #3498db;
}

.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
       padding-top: 30px;
   	 position: relative;
           z-index: 2;
}  

.copyright-text {
    text-align: center;
}

.copyright-text p {
  color: rgba(255, 255, 255, 0.7);
   font-size: 14px; 
	
}@media (max-width: 1024px) {
    .hero-text-block {
        padding-left: 50px;
    }

    .hero-banner h1 {
        font-size: 3.5rem;
    }

    .hero-banner h2 {
        font-size: 2.5rem;
    }
}

@media (max-width: 768px) {
    .nav-links {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: white;
        flex-direction: column;
        padding: 20px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    }

    .nav-links.active {
        display: flex;
    }

    .mobile-menu-toggle {
        display: flex;
    }

    .mobile-menu-toggle.active .burger-line:nth-child(1) {
        transform: rotate(-45deg) translate(-5px, 6px);
    }

    .mobile-menu-toggle.active .burger-line:nth-child(2) {
        opacity: 0;
    }

    .mobile-menu-toggle.active .burger-line:nth-child(3) {
        transform: rotate(45deg) translate(-5px, -6px);
    }

    .section-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .hero-text-block {
        padding-left: 0;
        text-align: center;
    }

    .hero-banner h1 {
        font-size: 2.8rem;
    }

    .hero-banner h2 {
        font-size: 2rem;
    }

    .process-workflow {
        flex-direction: column;
        gap: 40px;
    }

    .workflow-step {
        width: 100%;
    }

    .workflow-step::after {
        display: none;
    }

    .feature-highlights {
        margin-top: 20px;
    }

    .footer-content-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

@media (max-width: 480px) {
    .hero-banner {
        padding: 120px 0 100px;
    }

    .hero-banner h1 {
        font-size: 2.2rem;
        line-height: 1.2;
    }

    .hero-banner h2 {
        font-size: 1.6rem;
    }

    .section-title {
        font-size: 2rem;
    }

    .equipment-title {
        font-size: 2.2rem;
    }

    .cta-text-block h2 {
        font-size: 2.2rem;
    }

    .equipment-gallery-grid {
        grid-template-columns: 1fr;
    }

    .feature-highlights {
        margin-top: 15px;
    }
}.simple-text-section {
    padding: 120px 0 80px; 
	    margin-top: 70px; 
	  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 50%, #dee2e6 100%);
}

.services-intro {
   position: relative;
}

.services-intro::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.1;
   z-index: 1;
}

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

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

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

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

.simple-text-content		{
  text-align: center;
  max-width: 800px;
    margin: 0 auto;
}

.text-title {
	   font-size: 3rem;
  color  :   #2c3e50;
  font-weight: 600;
  font-family: "Arial", serif;
   margin-bottom: 25px;
  text-transform: uppercase;
   letter-spacing: 1px;
    position  :        relative;

}

.text-title::after {
  content: '';
    position  :  absolute;
  bottom: -10px;
    left: 50%;
  transform: translateX(-50%);
    width: 80px;
  height: 3px;
  background: linear-gradient(90deg, #e74c3c, #f39c12);
  border-radius: 2px;
}

.text-description {

	    font-size: 1.2rem;
  font-family: "Arial", sans-serif;
   color: #34495e;
	 font-weight: 400;
	 line-height: 1.8;
	margin: 0 0 20px 0;}

.text-content {
   font-size: 1rem;
	  font-family: "Arial", sans-serif;
	    color: #5d6d7e;
	   font-weight: 400;
	  line-height: 1.7;
	      margin: 0 0 35px 0;
}

.primary-btn {
	  display: inline-block;
  text-transform: uppercase;
    border-radius: 4px;
	 font-weight: 700;
    transition: all 0.4s ease;
   text-decoration: none;
     color: #2c3e50;
    font-size: 14px;
   background    :        transparent;
  overflow: hidden;
  padding: 12px 30px 10px;
   border: 2px solid #e74c3c;
   position: relative;
     }

.primary-btn::before	{
  content: '';
  position: absolute;
   top: 0;
    left: -100%;
  width    :      100%;
    height  :  100%;
  background: linear-gradient(90deg, #e74c3c, #c0392b);
  transition: left 0.4s ease;
  z-index: -1;
}

.primary-btn:hover::before {
	 left: 0;
}

.primary-btn:hover {

	   color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(231, 76, 60, 0.3);


}



.services-section {
  padding: 120px 0 80px;
   background: #ffffff;
   position: relative;
}

.services-section::before {
  content: '';
   position: absolute;
   top: 0;
    left: 0;
  width: 100%;
    height: 200px;
  background: linear-gradient(180deg, #f8f9fa 0%, transparent 100%);
}

.services-item {
  margin-bottom: 80px;
       position: relative;
  transition: all 0.4s ease;
}

.services-item:hover {
  transform: translateY(-5px);
}

.services-item .si-pic {
	 height: 280px;
	 position: relative;
    border-radius  :     8px;
  overflow: hidden;
  box-shadow: 0 5px 20px rgba(0,0,0,0.1);
   transition: all 0.4s ease;
}

.services-item:hover .si-pic{

  box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}

.services-item .si-pic .service-icon     {
   width: 80px;
	 height: 80px;
  background: linear-gradient(135deg, #e74c3c, #c0392b);
        text-align: center;
   line-height: 80px;
   border-radius: 50%;
  position:      absolute;
  bottom   :       -40px;
   left  :       50%;
  transform: translateX(-40px);
   transition    :   all 0.4s ease;
  box-shadow: 0 5px 20px rgba(231, 76, 60, 0.3);
    display: flex;
  align-items :    center;
    justify-content: center;
}

.services-item:hover .service-icon {
  transform: translateX(-40px) scale(1.1);
  box-shadow: 0 10px 30px rgba(231, 76, 60, 0.4);
}

.service-icon img {

  filter: brightness(0) saturate(100%) invert(100%);
   transition: all 0.3s ease;
}

.services-item:hover .service-icon img {
  transform: rotate(360deg);
}

.services-item .si-text {
    text-align: center;
  padding-top: 60px;
    padding-left: 15px;
	 padding-right: 15px;
}

.services-item .si-text h3 {
				 color: #2c3e50;

	     font-weight: 600;

	  margin-bottom: 20px;

	  font-size: 1.4rem;

	   line-height    : 1.4;

	      transition: color 0.3s ease;

}

.services-item:hover .si-text h3
	{
  color     :      #e74c3c;
}

.services-item .si-text p
	{
   color: #5d6d7e;
	font-size: 14px;
  line-height: 1.8;
  font-family: "Arial", sans-serif;

}

.section-title {
    text-align: center;
   margin-bottom: 70px;
   position: relative;
}

.section-title span {
	color: #7f8c8d;
   display: block;
   font-size: 14px;
  letter-spacing: 3px;
  text-transform    :   uppercase;
   font-weight: 600;
    margin-bottom: 10px;
} 

.section-title h2 {
    color: #2c3e50;
   font-size: 3rem;
   line-height: 1.2;
   font-weight: 700;
  margin-top: 10px;
  margin-bottom: 25px;
    text-transform: uppercase;
     position: relative;
}

.section-title h2::after {
  content: '';
  position  :absolute;
    bottom: -15px;
  left :50%;
  transform: translateX(-50%);
   width: 60px;
   height: 4px;
  background: linear-gradient(90deg, #3498db, #2980b9);
  border-radius: 2px;
}

.set-bg {
	background-repeat: no-repeat;
    background-size: cover;
  background-position   : center center;
    position :      relative;
}

.set-bg::before {
  content: '';
	   position: absolute;
	  top: 0;
	  left: 0;
	    right: 0;
	   bottom    :   0;
	  background: rgba(44, 62, 80, 0.3);
	  transition: background 0.4s ease;
}

.services-item:hover .set-bg::before {
	  background: rgba(231, 76, 60, 0.2);
     }@media (max-width: 1024px) {
    .text-title {
        font-size: 2.5rem;
    }

    .section-title h2 {
        font-size: 2.5rem;
    }

    .col-lg-4 {
        width: 50%;
        margin-bottom: 30px;
    }
}

@media (max-width: 768px) {
    .simple-text-section {
        padding: 100px 0 60px;
    }

    .services-section {
        padding: 80px 0 60px;
    }

    .text-title {
        font-size: 2rem;
        margin-bottom: 20px;
    }

    .text-description {
        font-size: 1.1rem;
    }

    .section-title h2 {
        font-size: 2rem;
    }

    .col-lg-4 {
        width: 100%;
        margin-bottom: 40px;
    }

    .services-item {
        margin-bottom: 60px;
    }

    .services-item .si-pic {
        height: 240px;
    }

    .section-title {
        margin-bottom: 50px;
    }
}

@media (max-width: 480px) {
    .simple-text-section {
        padding: 80px 0 40px;
    }

    .services-section {
        padding: 60px 0 40px;
    }

    .text-title {
        font-size: 1.8rem;
    }

    .text-description {
        font-size: 1rem;
    }

    .section-title h2 {
        font-size: 1.8rem;
    }

    .services-item .si-pic {
        height: 200px;
    }

    .services-item .si-text {
        padding-top: 50px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .services-item .si-text h3 {
        font-size: 1.2rem;
        margin-bottom: 15px;
    }

    .container {
        padding: 0 15px;
    }
}

@keyframes serviceSlideIn {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}.services-item {
                  animation: serviceSlideIn 0.8s ease forwards;
}

.services-item:nth-child(1) {
  animation-delay: 0.1s;
}

.services-item:nth-child(2)  
  {
   animation-delay: 0.2s;
}

.services-item:nth-child(3) {
   animation-delay: 0.3s;
}

.services-item:nth-child(4) {
  animation-delay     :0.4s;
}

.services-item:nth-child(5) {
   animation-delay: 0.5s;
}

.services-item:nth-child(6) {


         animation-delay   :        0.6s;


}

.services-item:focus-within {
    outline: 2px solid #3498db;
     outline-offset     :       4px;
}

.primary-btn:focus {
    outline: 2px solid #3498db;
  outline-offset:    3px;
}
@media print {
    .simple-text-section,
    .services-section {
        padding: 20px 0;
        background: white !important;
    }

    .services-item .si-pic {
        height: auto;
        box-shadow: none;
    }

    .service-icon {
        position: static !important;
        transform: none !important;
        margin: 10px auto;
    }
}.legal-section {
  padding: 120px 0 80px;
  margin-top     :   70px;
  background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    position: relative;
}

.legal-section::before {
  content: '';
      position: absolute;
     top: 0;
      left: 0;
       right: 0;
      height: 200px;
     background: linear-gradient(135deg, rgba(231, 76, 60, 0.05), rgba(52, 152, 219, 0.05));
     z-index :   1;
}

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

.legal-header {
   text-align: center;
         margin-bottom: 60px;
	position: relative;

}

.breadcrumb {
	display     :  flex;
    align-items: center;
    justify-content   :       center;
  gap: 8px;
  margin-bottom: 25px;
	font-size  :       14px;
    color: #6c757d;
}

.breadcrumb-link {
       color: #e74c3c;
  text-decoration: none;
    display: flex;
   align-items: center;
  gap: 5px;
  transition: color 0.3s ease;
	}

.breadcrumb-link:hover {
   color:#c0392b;
}

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

.breadcrumb img:not(.breadcrumb-link img) {
  filter: brightness(0) saturate(100%) invert(47%) sepia(8%) saturate(665%) hue-rotate(314deg);
}

.legal-title {
      font-size     :    3rem;
	color: #2c3e50;
    font-weight: 700;
   margin-bottom: 15px;
  display: flex;
    align-items: center;
  justify-content: center;
    gap: 15px;
    text-transform: uppercase;
  letter-spacing: 1px;


}

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


}

.legal-subtitle {
  font-size: 1.2rem;
   color: #5d6d7e;
    margin-bottom: 20px;
  font-weight: 400;
}

.update-notice {
  display: inline-flex;
    align-items: center;
   gap: 8px;
	 background: #e8f4fd;
   color: #2980b9;
                    padding: 8px 16px;
  border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
  border: 1px solid #d6eaf8;
}

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


.legal-content {
   background: white;
   border-radius: 12px;
    padding: 50px 40px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
   line-height: 1.7;
	
}

.disclaimer-intro {
  background: linear-gradient(135deg, #fff3cd, #ffeeba);

   border-left: 4px solid #ffc107;

   padding: 25px;

	 border-radius: 8px;

   margin-bottom  :     40px;

	display: flex;

                    align-items : flex-start;

   gap: 20px;
}

.icon-box {
  background: white;
  padding: 12px;
    border-radius:       8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    flex-shrink: 0;}

.icon-box img {
  filter: brightness(0) saturate(100%) invert(69%) sepia(96%) saturate(2034%) hue-rotate(22deg);
}

.disclaimer-intro p {
        margin: 0;
  color: #856404;
  font-weight: 500;
   font-size: 1.05rem;
	
}



.privacy-pledge {
  background: linear-gradient(135deg, #d1ecf1, #bee5eb);
    border: 2px solid #17a2b8;
  border-radius: 12px;
  padding: 30px;
		 margin-bottom     :     40px;
   display: flex;
    align-items: flex-start;
    gap: 20px;
    position: relative;
}

.privacy-pledge::before {


  content: '';

    position: absolute;

    top: -2px;

   left: -2px;

   right: -2px;

   bottom: -2px;

  background: linear-gradient(45deg, #17a2b8, #138496);

    border-radius: 12px;

  z-index: -1;

   opacity: 0.1;
}

.pledge-icon {
  background: white;
    padding: 15px;
   border-radius: 50%;
  box-shadow: 0 4px 12px rgba(23, 162, 184, 0.3);
  flex-shrink: 0;
}

.pledge-icon img {
  filter: brightness(0) saturate(100%) invert(45%) sepia(98%) saturate(1582%) hue-rotate(162deg);
}

.pledge-content h2
{
    color: #0c5460;
  font-size: 1.8rem;
   font-weight: 600;
   margin-bottom: 15px;
}

.pledge-content p {
    color: #0c5460; 
	    margin: 0; 
	   font-size: 1.1rem; 
	
}

.legal-section-content {
  margin-bottom: 40px;
    padding-bottom: 30px;
	border-bottom: 1px solid #e9ecef;
}

.legal-section-content:last-of-type {
   border-bottom: none;
   margin-bottom: 20px;
}

.legal-section-content h2 {
	color: #2c3e50;
       font-size: 1.6rem;
   font-weight: 600;
    margin-bottom: 20px;
	display: flex;
  align-items: center;
   gap: 12px;
    padding-bottom: 10px;
	border-bottom: 2px solid #e74c3c;
    width: fit-content;
}

.legal-section-content h2 img {
  filter: brightness(0) saturate(100%) invert(25%) sepia(85%) saturate(2578%) hue-rotate(346deg);
}

.legal-section-content p {
     color: #4a4a4a;
  margin-bottom: 15px;
   font-size: 15px;
    line-height: 1.7;}

.legal-section-content p:last-child {
    margin-bottom: 0;
}

.contact-notice

{
  background: linear-gradient(135deg, #e8f5e8, #d4edda);
    border: 2px solid #28a745;
  border-radius: 12px;
   padding: 30px;
   margin-top: 40px;
}

.notice-content {
  display     :   flex;
  align-items: flex-start;
    gap     :        20px;
}

.notice-icon {
    background  :   white;
	padding: 15px;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(40, 167, 69, 0.3);
    flex-shrink    :        0;
}

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

}

.notice-text h3  {


  color: #155724;
	font-size: 1.4rem;
  font-weight: 600;
    margin-bottom  :10px;

}

.notice-text p {
  margin-bottom: 20px;
  color: #155724;
   line-height:       1.6;
}

.contact-btn {

  display: inline-flex;
    align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #e74c3c, #c0392b);
  color: white;
   padding: 12px 20px;
    border-radius: 6px;
   text-decoration: none;
					font-weight: 600;
    text-transform: uppercase;
   font-size: 13px;
	 transition:    all 0.3s ease;
	letter-spacing: 0.5px;
	}

.contact-btn:hover
	{
  background: linear-gradient(135deg, #c0392b, #a93226);
  transform: translateY(-2px);
  box-shadow: 0 4px 15px rgba(231, 76, 60, 0.4);
   color: white;
   text-decoration: none;
}

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

strong {
  color: #2c3e50;
   font-weight: 600;
}

p strong {
  background: rgba(231, 76, 60, 0.1);
	padding: 2px 6px;
   border-radius: 3px;
}@media (max-width: 768px) {
    .legal-section {
        padding: 100px 0 60px;
    }

    .container {
        max-width: 100%;
        padding: 0 15px;
    }

    .legal-content {
        padding: 30px 20px;
    }

    .legal-title {
        font-size: 2.2rem;
        flex-direction: column;
        gap: 10px;
    }

    .legal-title img {
        order: -1;
    }

    .disclaimer-intro,
    .privacy-pledge,
    .contact-notice {
        flex-direction: column;
        text-align: center;
    }

    .notice-content {
        flex-direction: column;
        text-align: center;
    }

    .legal-section-content h2 {
        font-size: 1.4rem;
        flex-direction: column;
        gap: 8px;
        width: 100%;
        text-align: center;
        padding-bottom: 15px;
    }

    .breadcrumb {
        flex-wrap: wrap;
    }
}

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

    .legal-header {
        margin-bottom: 40px;
    }

    .legal-title {
        font-size: 1.8rem;
    }

    .legal-subtitle {
        font-size: 1rem;
    }

    .legal-content {
        padding: 25px 15px;
    }

    .disclaimer-intro,
    .privacy-pledge,
    .contact-notice {
        padding: 20px 15px;
    }

    .legal-section-content h2 {
        font-size: 1.2rem;
    }

    .legal-section-content {
        margin-bottom: 30px;
        padding-bottom: 20px;
    }

    .contact-btn {
        padding: 10px 16px;
        font-size: 12px;
    }
}

@media print {
    .legal-section {
        padding: 20px 0;
        background: white !important;
    }

    .legal-section::before {
        display: none;
    }

    .legal-content {
        box-shadow: none;
        padding: 20px;
    }

    .contact-notice,
    .disclaimer-intro,
    .privacy-pledge {
        background: white !important;
        border: 1px solid #ddd;
    }

    .contact-btn {
        display: none;
    }

    .breadcrumb {
        display: none;
    }

    .legal-title img,
    .legal-section-content h2 img,
    .icon-box img,
    .pledge-icon img,
    .notice-icon img {
        display: none;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}.legal-header,
.legal-content {
   animation: fadeInUp 0.8s ease forwards;
}

.legal-section-content {
     animation: fadeInUp 0.6s ease forwards;
}

.legal-section-content:nth-child(1) {
   animation-delay: 0.1s;
}

.legal-section-content:nth-child(2)
	{
  animation-delay: 0.2s;
}

.legal-section-content:nth-child(3) {
      animation-delay: 0.3s;
     }


.legal-section-content:nth-child(4) {
    animation-delay: 0.4s;
}

.legal-section-content:nth-child(5) {
  animation-delay: 0.5s;

}

.legal-section-content:nth-child(6) {
   animation-delay: 0.6s;
}

.contact-btn:focus,
.breadcrumb-link:focus

{
    outline: 2px solid #3498db;
   outline-offset: 2px;
}

::selection {
  background: rgba(231, 76, 60, 0.2);
  color: #2c3e50;
}