/* Main footer container */

.temp-footer-container * {
    font-family: 'Roboto' !important;
    hyphens:none;
    word-break:normal;
}

.temp-footer-container {
 background-color: transparent;
 color: #fff;
 display: flex;
 justify-content: space-between;
 padding: 10px 105px; 
 max-width: 1440px;
 margin: auto;
 /* height: 552px; */
}

/* Get a Demo Section */
.temp-footer-demo-section {
 flex: 1;
 padding: 60px 0px 0 0px;;
 max-width: 300px;
}

.temp-footer-demo-heading {
 color: #fff !important;
 font-size: 48px;
 margin-top: 0;
}

.temp-footer-2buttons-wrapper {
 display:flex;
 flex-direction:row;
 gap:85px;
 line-height: 22px !important;
 align-items: center;
 flex-wrap: nowrap;
 padding:0px 20px;
 margin-left: 7px;
}

.temp-footer-2buttons-wrapper p{
 margin-block-start: 0 !important;
 margin-block-end: 0 !important;
}


.temp-footer-followus-container {
 margin-top: 15%;
}

.temp-footer-demo-text {
 font-size: 16px;
 font-weight: 400;
 line-height: 170%;
 margin-block-start: 0 !important;
 margin-block-end: 0 !important;
 padding-right: 12px;
}


.temp-footer-demo-button {
 align-items: center;
 background-color: #fff;
 border-radius: 8px;
 color: #004c97;
 display: inline-flex;
 font-family: 'Roboto';
 font-size: 16px;
 line-height: 22px;
 gap: 3px;
 padding: 10px 16px;
 text-decoration: none;
 transition: all 0.3s ease-in-out !important;
font-weight:500;
}
.temp-footer-demo-button:hover {
color : #fff !important;
background-color: rgba(255, 255, 255, 0.1);
transform: scale(1.05) !important;
}
.temp-footer-demo-button:hover svg{
stroke: #fff !important; 
}

/* Vertical line and right content wrapper */
.temp-footer-right-container {
 border-left-style: solid;
 border-left-width: 1px;
 display: flex;
 flex-direction: column;
 flex: 3;
 min-width: 200px;
 padding-top: 13px;
 padding-bottom: 20px;
 margin-top: 50px;
 border-color: rgba(214, 215, 217, 0.3);
}

/* Logo section */
.temp-footer-logo-section {
 padding: 0 0 0 20px;
 text-align: left;
 margin-bottom: 20px;
 margin-left: 7px;
}

.temp-footer-logo-section img {
 max-width: 100%;
 height: auto;
}

/* Grid container for 4 columns */
.temp-footer-grid-container {
 display: grid;
 flex-wrap: wrap;
 gap: 25px !important;
 grid-template-columns: repeat(4, 1fr);
 /* height: 100%; */
 margin-left: 7px;
}

/* Common column styling */
.temp-footer-column {
 display: flex;
 flex-direction: column;
 flex: 1;
 height: 100%;
 justify-content: space-between;
 padding: 20px;
}

/* Regular column without special layout */
.temp-footer-simple-column {
 flex: 1;
 height: 100%;
 padding: 20px;
 min-width: 200px;
}

/* Section headings */
.temp-footer-column-heading {
 color: #fff;
 font-size: 20px;
 margin-top: 0;
 font-weight: 600;
 white-space: nowrap;
 margin-bottom: 25px;
 line-height: 100%;
}

/* Smaller heading (Follow Us) */
.temp-footer-small-heading {
 color: #fff !important;
 font-size: 16px;
 font-weight: 600;
 margin-block-end: 0 !important;
}

/* Link container */
.temp-footer-link-container {
 font-size: 16px;
 padding: 0;
 line-height: 170%;
}

/* Individual link items */
.temp-footer-link-item {
 margin-bottom: 10px;
}

/* Link styling */
.temp-footer-link {
 position: relative;
 color: #fff;
 font-family: 'Roboto';
 text-decoration: none;
 transition: color 0.3s ease !important;
}



.temp-footer-link:hover {
 color: rgba(0, 156, 222, 1) !important;
}

.temp-footer-link:hover::after {
 width: 100%;
 left: 0;
}

/* Contact button */
.temp-footer-contact-button {
 align-items: center;
 border-radius: 8px;
 border-style: solid;
 border-width: 1px;
 color: #fff;
 display: inline-flex;
 font-family:'Roboto';
 font-size: 14px;
 gap: 3px;
 padding: 10px 26px;
 text-decoration: none;
 box-sizing: border-box;
 letter-spacing:0.01em;
 font-weight: 500;
 transition: all 0.3s ease-in-out !important;
}

.temp-footer-contact-button:hover {
 background-color: rgba(255, 255, 255, 0.1);
 transform: scale(1.05); 
}

/* Breach button */
.temp-footer-breach-button {
 align-items: center;
 border-radius: 8px;
 border-style: solid;
 border-width: 1px;
 color: #fff;
 display: inline-flex;
 font-family: 'Roboto';
 font-size: 14px;
 gap: 3px;
 padding: 10px 26px;
 text-decoration: none;
 box-sizing: border-box;
 letter-spacing:0.01em;
 font-weight: 500;
 transition: all 0.3s ease-in-out !important;
}

.temp-footer-breach-button:hover {
 background-color: rgba(255, 255, 255, 0.1);
 transform: scale(1.05);
}

/* Contact info text */
.temp-footer-contact-info {
 font-size: 16px;
 margin-block-start: 0 !important;
 margin-block-end: 0 !important;
 line-height: 170%;
 margin-bottom: 10px !important;
}

/* Social icons container */
.temp-footer-social-container {
 align-items: center;
 display: flex;
 flex-direction: row;
 gap: 1rem;
 flex-wrap: wrap;

}
.temp-footer-social-container img{
 transition: all 0.3s ease-in-out !important;
}
.temp-footer-social-container img:hover{
filter: invert(52%) sepia(100%) saturate(518%) hue-rotate(166deg) brightness(96%) contrast(98%);
transform: scale(1.05);

}
/* Social icon link */
.temp-footer-social-link {
 align-items: center;
 display: flex;
 justify-content: center;
}

/* Bottom footer bar */
.temp-footer-bottom {
 background-color: transparent;
 color: #fff;
 display: flex;
 font-family: 'Roboto';
 gap: 60px;
 justify-content: flex-end;
 padding: 0px 130px 15px 0px;
 flex-wrap: wrap;
 max-width: 1440px;
 margin: auto;
}

/* Bottom footer links */
.temp-footer-bottom-link {
 color: #fff;
 font-size: 12px;
 text-decoration: none;
 transition: all 0.3s ease-in-out !important; 
}

.temp-footer-bottom-link:hover {
 color:  #009cde !important;
}

/* Copyright text */
.temp-footer-copyright {
 font-size: 12px;
}


/* Larger screens (1800px and above) - further increased font sizes for very big monitors */
@media screen and (min-width: 1800px) {
 .temp-footer-demo-heading {
     font-size: 48px;
 }
 .temp-footer-container {
     padding: 0;
 }
 
 .temp-footer-demo-text {
     font-size: 16px;
 }
 
 .temp-footer-demo-button {
     font-size: 16px;
     padding: 14px 20px;
 }
 
 .temp-footer-column-heading {
     font-size: 22px;
 }
 
 .temp-footer-small-heading {
     font-size: 20px;
 }
 
 .temp-footer-link-container {
     font-size: 16px;
 }
 
 .temp-footer-contact-button,
 .temp-footer-breach-button {
     font-size: 16px;
     padding: 12px 30px;
 }
 
 
 .temp-footer-2buttons-wrapper{
    gap: 116px;
 }
}

/* Medium-large screens */
@media screen and (max-width: 1199px) {
 .temp-footer-grid-container {
     grid-template-columns: repeat(2, 1fr);
 }

 .temp-footer-grid-container :nth-child(4) {
    margin-left: 0px !important; /* Change this value to whatever you need */
  }
}

  
/* Medium screens (tablets) */
@media screen and (max-width: 992px) {
 .temp-footer-container {
     flex-direction: column;
 }
 
 .temp-footer-demo-section {
     width: 100%;
     text-align: center;
     max-width: none;
 }
 
 .temp-footer-right-container {
     border-left: none;
     border-top-style: solid;
     border-top-width: 1px;
     margin-top: 20px;
     padding-top: 20px;
     width: 100%;
     padding-left: 5px;
 }
 
 .temp-footer-logo-section {
     padding: 0;
     text-align: center;
 }
}

/* Small screens (mobile landscape) */
@media screen and (max-width: 768px) {
.temp-footer-demo-text{
font-size:14px;
}
.temp-footer-link-container {
     font-size: 14px;
 }
.temp-footer-contact-info {
     font-size: 14px;
 }
 
 .temp-footer-bottom-link,
 .temp-footer-copyright {
     font-size: 14px;
 }

 .temp-footer-grid-container {
     grid-template-columns: 1fr;
 }

 .temp-footer-demo-heading{
    margin-bottom: 15px !important;
 }
 
 .temp-footer-demo-heading {
     font-size: 36px;
 }
 
 .temp-footer-column, 
 .temp-footer-simple-column {
     padding: 10px;
 }
 
 .temp-footer-bottom {
     flex-direction: column;
     gap: 10px;
     align-items: center;
     text-align: center;
 }
 .temp-footer-2buttons-wrapper{
    flex-direction: column;
    gap: 20px;
 }
 .temp-footer-2buttons-wrapper p{
    width: 100%;
 }
 .temp-footer-breach-button {
    width: 100%;
    place-content: center;
 }
 .temp-footer-contact-button {
    width: 100%;
    place-content: center;
 }
}

/* Extra small screens (mobile portrait) */
@media screen and (max-width: 480px) {
 .temp-footer-demo-heading {
     font-size: 30px;
 }
 
 .temp-footer-column-heading {
     font-size: 18px;
 }
 
 .temp-footer-container {
     padding: 5% 3%;
 }
 
 .temp-footer-bottom {
     padding: 5%;
 }
}