/* ========================================
   FOOTER STYLES
   Based on TSM Design System v1.0
   ======================================== */

/* ----------------------------------------
   Final CTA Section (Before Footer)
   ---------------------------------------- */
.final-cta-section {
    background: linear-gradient(178deg, #FEA1B9 0%, #EE2968 100%);
    padding: var(--space-48) var(--space-16);
    border-radius: var(--radius-3xl);
    margin: auto;
    position: relative;
    overflow: hidden;
    width: 1194px;
    height: 650px;
}

.cta-content-wrapper {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: var(--space-48);
  align-items: center;
}

/* CTA Left: Image & Text */
.cta-left {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
}

.cta-image {
  display: flex;
  justify-content: center;
}

.cta-avatar {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  border: 6px solid  var(--surface-base);
  object-fit: cover;
  box-shadow: var(--shadow-lg);
}

.cta-title {
  font-family: var(--font-headings);
  font-size: var(--fs-h1);
  font-weight: var(--weight-semibold);
  line-height: var(--lh-tight);
  color: white;
  margin-bottom: var(--space-16);
}

.cta-description {
  font-family: var(--font-body);
  font-size: var(--fs-lg);
  line-height: var(--lh-relaxed);
  color: white;
  opacity: 0.95;
}

/* CTA Right: Steps & Form */
.cta-right {
  display: flex;
  flex-direction: column;
/*   gap: var(--space-38); */
}

.cta-steps {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
}

.cta-step {
  display: flex;
  gap: var(--space-20);
/*   align-items: flex-start; */
	align-items:center;
}

.step-number {
  font-family: var(--font-heading);
/*   font-size: var(--fs-h2-md); */
  font-weight: var(--weight-bold);
/*   line-height: 1; */
  color: pink;
  opacity: 0.9;
  flex-shrink: 0;
  font-size: var(--fs-h6);
  width:90px;
}

.step-content h3 {
  font-family: var(--font-heading);
  font-size: var(--fs-lg);
  font-weight: var(--weight-semibold);
  color: white;
/*   margin-bottom: var(--space-4); */
}

.step-content p {
  font-family: var(--font-body);
  font-size: var(--fs-base);
  line-height: var(--lh-relaxed);
/* 	line-height: 18px; */
  color: white;
  opacity: 0.9;
}

/* CTA Form */
.cta-form form {
  display: flex;
/*   gap: var(--space-12); */
  position:relative;
  margin-bottom: var(--space-48);
  align-items:center;
  width:396px;
	@media (max-width: 767px) {
  width:100%;
}
}

.cta-input {
  flex: 1;
  height: 45px;
  padding-left:var(--space-25);
  border: none;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-size: var(--fs-base);
  background: white;
  box-shadow: var(--shadow-sm);
		@media (max-width: 767px) {
  flex:unset !important;
  padding-left:var(--space-12) !important;
}
}

.cta-input::placeholder {
  color: var(--text-muted);
}
#wpforms-862-field_3{
	border-radius: var(--radius-lg)
}
.btn-cta {
  height: 39px;
  width:48.74%;
  padding: 0 var(--space-32);
  background: var(--color-cyan-default);
  color: white;
  border: none;
  font-family: var(--font-body);
  font-size: var(--fs-base);
  font-weight: var(--weight-semibold);
  cursor: pointer;
  white-space: nowrap;
  transition: all var(--duration-normal) var(--ease-out);
  box-shadow: var(--shadow-md);
  position:absolute;
  right:var(--space-4);
  border-radius: var(--radius-full);
	
@media (max-width: 767px) {
  top:var(--space-56);
  right:0;
}
}

.btn-cta:hover {
  background: var(--color-cyan-hover);
/*   transform: translateY(-2px); */
  box-shadow: var(--shadow-lg);
}

.cta-tagline {
  font-family: var(--font-body);
  font-size: var(--fs-base);
  color: white;
  text-align: left;
  opacity: 0.95;
		@media (max-width: 767px) {
  padding-top:var(--space-32)
}
}
.button-with-text{
	padding-top:var(--space-32);
	/* CTA Button */
.btn-hero-cta {
display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--color-blue);
    color: var(--text-inverse);
    font-family: var(--font-headings);
    font-size: var(--fs-body);
    font-weight: var(--weight-semibold);
    padding: var(--space-8) var(--space-16);
    border-radius: 40px;
    text-decoration: none;
    transition: all var(--duration-fast) var(--ease-out);
    white-space: nowrap;
}

.btn-hero-cta:hover {
  background: var(--color-blue);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(35, 119, 255, 0.45);
}

.btn-hero-cta:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(35, 119, 255, 0.3);
}

	p{
		padding-top:var(--space-16);
		color:white;
	}
}

/* CTA Links */
.cta-links {
  display: flex;
  gap: var(--space-96);
  justify-content: left;
  padding-top:30px;
}

.cta-link {
  font-family: var(--font-body);
  font-size: var(--fs-base);
  font-weight: var(--weight-medium);
  color: white;
  background-color: transparent;
  text-decoration: underline;
  text-underline-offset: 4px;
  transition: opacity var(--duration-fast) var(--ease-out);
}

.cta-link:hover {
  opacity: 0.8;
}

/* ----------------------------------------
   Main Footer
   ---------------------------------------- */
.site-footer {
    background:  #383739;
    color: var(--surface-base);
    padding: var(--space-64) 0 var(--space-32);
    margin-top: -225px;
    height: auto;
    padding-top: 267px;
}

/* Footer Columns - First column (brand) has more space */

@media (max-width: 768px) {
	.footer-columns{
	padding-bottom:var(--space-20)
	}
}

.footer-columns {
  display: flex;
  justify-content: space-between;
  gap: var(--space-8);
  margin-bottom: var(--space-48);
}

.footer-column {
  display: flex;
  flex-direction: column;
}

/* First column: Logo & Address */
.footer-column:first-child {
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
}

.footer-brand {
  max-width: 300px;
}

.footer-logo {
  margin-bottom: var(--space-16);
}

.footer-address {
  font-style: normal;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  line-height: var(--lh-relaxed);
  color: var(--surface-base);
}

.footer-address a {
  color: rgba(255, 255, 255, 0.9);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
}

.footer-address a:hover {
  color: var(--color-brand-primary);
}

.footer-heading {
  font-family: var(--font-heading);
  font-size: var(--fs-base);
  font-weight: var(--weight-semibold);
  color: white;
/*   margin-bottom: var(--space-20); */
  text-transform: none;
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.footer-links li {
  margin: 0;
}

.footer-links a {
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--weight-normal);
  color: var(--surface-base);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
  display: inline-block;
}

.footer-links a:hover {
  color: var(--color-brand-primary);
}

/* Footer Bottom: Legal & Social */
.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: var(--space-32);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-legal {
  display: flex;
  gap: var(--space-6);
  flex-wrap: wrap;
}
.divider {
  display: inline-block;
  width: 1px;
  height: 14px;          /* control height here */
  background: #999;
  vertical-align: middle;
}

.footer-legal a {
  font-family: var(--font-body);
  font-size: var(--fs-body-sm);
  color: var(--surface-base);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
}

.footer-legal a:hover {
  color: var(--color-brand-primary);
}

/* Footer Social */
@media (max-width: 768px) {
	.footer-social{
		gap: var(--space-4) !important;
	}
}

.footer-social {
  display: flex;
  gap: var(--space-8);
}
.form-container .col-30 .footer-social a{
	width: 25px;
	height: 25px
}
.footer-social a, .footer-social .social-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
/*   background: rgba(255, 255, 255, 0.1); */
  color: white;
  transition: all var(--duration-fast) var(--ease-out);
}

.social-icon {
	position: relative;
	display: inline-block;
	width: 24px;
	height: 24px;
}

.social-icon img {
	position: absolute;
	width:100%;
/* 	height:100%; */
	object-fit:cover;
}

.social-icon .icon-hover {
	opacity: 0;
	transition: opacity 0.2s ease;
}

.social-icon:hover .icon-hover {
	opacity: 1;
}


.footer-social a:hover {
/*   background: var(--color-brand-primary); */
  transform: translateY(-2px);
}


@media (max-width: 768px) {
.copyright{
	flex-direction:column;
	gap:var(--space-20) !important;
		
	}
.copyright .right-text{
	width: 100% !important;
	
	}
.copyright .left-text{
   width: 100% !important;
	padding-bottom:var(--space-32);
	text-align: left !important;
	}
}
.copyright{
    display: flex;
    align-items: center;
    gap: var(--space-51);
    padding-top: var(--space-48);
    font-family: var(--font-body);
    font-size: var(--fs-body-sm);
    color: rgba(255, 255, 255, 0.7);
    transition: color var(--duration-fast) var(--ease-out);
}
.copyright a:hover{
	color: var(--color-brand-primary);
}
.copyright .right-text{
	 width: 70%;
	
	}

.copyright .left-text{
	 width: 30%;
	text-align: right;
	}

/* ----------------------------------------
   Responsive Breakpoints
   ---------------------------------------- */

/* Large Desktop (≥1240px) */
@media (max-width: 1240px) {
  .final-cta-section {
    width: calc(100% - var(--space-40));
    margin: 0 var(--space-20);
  }
}

/* Tablet Large (≤1024px) */
@media (max-width: 1024px) {
  .final-cta-section {
    width: calc(100% - var(--space-32));
    margin: 0 var(--space-16);
    padding: var(--space-60) var(--space-40);
    height: auto;
  }
  
  .cta-content-wrapper {
    grid-template-columns: 1fr;
    gap: var(--space-48);
  }
  
  .cta-left {
    text-align: center;
    align-items: center;
  }
  
  .cta-title {
    font-size: var(--fs-3xl);
  }
  
  .cta-description {
    font-size: 17px;
  }
  
  .site-footer {
    margin-top: -180px;
    padding-top: 220px;
    height: auto;
  }
  
  .footer-columns {
    gap: var(--space-8);
  }
  
  .footer-column:first-child {
    grid-column: 1 / -1;
    margin-bottom: var(--space-24);
  }
}

/* Tablet Small (≤768px) */
@media (max-width: 768px) {
  .final-cta-section {
    width: calc(100% - var(--space-24));
    margin: 0 var(--space-12);
    padding: var(--space-50) var(--space-24);
    border-radius: var(--radius-2xl);
  }
  
  .cta-avatar {
    width: 160px;
    height: 160px;
  }
  
  .cta-title {
    font-size: var(--fs-2xl);
  }
  
  .cta-description {
    font-size: var(--fs-base);
  }
  
  .step-number {
    font-size: var(--fs-4xl);
  }
  
  .step-content h3 {
    font-size: 17px;
  }
  
  .step-content p {
    font-size: var(--fs-sm);
  }
  
  .cta-form form {
    flex-direction: column;
  }
  
  .cta-input,
  .btn-cta {
    width: 100%;
    height: 50px;
  }
  
  .site-footer {
    padding: var(--space-60) 0 var(--space-32);
    margin-top: -150px;
    padding-top: 190px;
  }
  
  .footer-columns {
    gap: var(--space-8);
    margin-bottom: var(--space-40);
  }
  
  .footer-column:first-child {
    grid-column: auto;
    margin-bottom: var(--space-32);
  }
  
  .footer-bottom {
    flex-direction: column;
    gap: var(--space-24);
/*     text-align: center; */
	 text-align:left;
    align-items: flex-start;
  }
  
  .footer-legal {
/*     flex-direction: column; */
    gap: var(--space-12);
  }
}

/* Mobile (≤480px) */
@media (max-width: 480px) {
  .final-cta-section {
    width: calc(100% - var(--space-16));
    margin: 0 var(--space-8);
    padding: var(--space-40) var(--space-20);
    border-radius: var(--radius-xl);
	  .container{
		  padding:unset;
	  }
  }
  
  .cta-avatar {
    width: 140px;
    height: 140px;
  }
  
  .cta-title {
    font-size: var(--fs-xl);
    line-height: 1.3;
  }
  
  .cta-description {
    font-size: var(--fs-base);
  }
  
  .cta-steps {
    gap: var(--space-20);
  }
  
  .step-number {
    font-size: 32px;
  }
  
  .step-content h3 {
    font-size: var(--fs-base);
  }
  
  .step-content p {
    font-size: var(--fs-sm);
  }
  
  .cta-input,
  .btn-cta {
    height: 48px;
    font-size: var(--fs-base);
  }
  
  .cta-input {
    padding: var(--space-18) var(--space-10);
  }
  
  .btn-cta {
    padding: 0 var(--space-24);
  }
  
  .site-footer {
    padding: var(--space-50) 0 var(--space-24);
    margin-top: -120px;
    padding-top: 160px;
  }
  
  .footer-columns {
    gap: var(--space-8);
    flex-direction: column;
  }
  
  .footer-brand {
    max-width: 100%;
  }
  
  .footer-heading {
    font-size: var(--fs-base);
    margin-bottom: var(--space-16);
  }
  
  .footer-links a {
    font-size: var(--fs-sm);
  }
  
  .footer-address {
    font-size: var(--fs-sm);
  }
  
  .footer-social a {
    width: 36px;
    height: 36px;
  }
  
  .footer-social svg {
    width: 18px;
    height: 18px;
  }
}

/* ----------------------------------------
   Accessibility
   ---------------------------------------- */
.cta-link:focus,
.footer-links a:focus,
.footer-legal a:focus,
.footer-social a:focus {
  outline: 2px solid var(--color-brand-primary);
  outline-offset: 2px;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  .btn-cta,
  .cta-link,
  .footer-links a,
  .footer-social a {
    transition: none;
  }
}




/* ----------------------------------------
   WPforms
   ---------------------------------------- */

/* Wrapper */
/* .footer-contact-wrapper {
    position: relative;
    margin: 0 auto;
}

/* Contact button */
.wpforms-contact-btn {
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 10px 20px;
    font-size: 16px;
    background-color: #007bff;
    color: #fff;
    border: none;
    border-radius: 7px;
    cursor: pointer;
}

/* Form container hidden initially */
.footer-contact-form {
    max-height: 0;
    transition: max-height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
    margin-top: 0;
    background: #fff;
    border-radius: 7px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.15);
    padding: 0 15px;
    position: relative;
}

/* Show form */
.footer-contact-form.active {
    max-height: 1000px;
    opacity: 1;
    margin-top: 10px;
    padding: 15px;
}

/* Close button */
.footer-contact-close {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 22px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: #606266;
    z-index: 10;
}

/* WPForms fields compact */
.footer-contact-form .wpforms-field {
    margin-bottom: 12px;
}

/* WPForms submit button full width */
.footer-contact-form .wpforms-submit {
    width: 100%;
    padding: 10px;
    font-size: 16px;
}

/* WPForms inline confirmation */
.footer-contact-form .wpforms-confirmation-container {
    margin-top: 10px;
    padding: 10px;
    background: #eaf7ea;
    border-radius: 7px;
    color: #007bff;
    font-weight: 500;
    text-align: center;
}

.footer-contact-form .wpforms-field {
    padding: 0 !important;
    margin-bottom: 8px; /* smaller spacing */
}

/* Put captcha + submit in one row */
.footer-contact-form .wpforms-submit-container {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
}

/* shrink submit button */
.footer-contact-form .wpforms-submit {
    width: auto;
    padding: 8px 14px;
    height: 38px;
    white-space: nowrap;
}
.footer-contact-form input,
.footer-contact-form textarea {
    font-size: 14px;
    padding: 8px 10px !important;
}

.footer-contact-form .wpforms-field-label {
    display: none; /* since you use placeholders */
}





.footer-contact-form #wpforms-862 {
	    padding: 0;
    margin: 0;
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.6);
 z-index: 9999999999;
  overflow: auto;
}

@media (max-width: 767px) {
#wpforms-862 form {
  	width: 96% !important;
	}
}
.contact-page-form #wpforms-862 form {
		width: 100%;
}
#wpforms-862 form {
  	margin: 5% auto;
  	width: 50%;
	padding: var(--space-40);
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
	flex-direction: column;
	input {
		border-radius: var(--radius-full);
		color: var(--fluentform-secondary);
		font-family: -apple-system,"system-ui",Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
		line-height: 1;
		padding: 11px 15px;
		transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	}
	button {
  background-color: rgba(238, 41, 104, 1);
  border-color: rgba(238, 41, 104, 1);
  color: #ffffff;
  border-radius: 50px;
  padding: 8px 40px;
}

button:hover {
  background-color: #ffffff;
  border-color: rgba(238, 41, 104, 1);
  color: rgba(238, 41, 104, 1);
  background: unset;
  border: 1px solid red;
}
	.wpforms-field-container{
		width: 100%;
	}
}


	@media (max-width: 767px) {
		.hide-on-mobile {
			display: none;
		}
		.footer-columns{
			margin:0 !important;
			flex-direction:column;
		}
		.menu-toggle{
		 margin: 0;
			padding-left: 0 !important;
		}
		.footer-bottom{
			padding-top:var(--space-20);
		}
		
.menu-toggle {
    cursor: pointer;           /* Makes it clear it’s clickable */
    padding: 10px 20px;
    color: #fff;
    border-radius: 8px;
    font-weight: bold;
    display: inline-block;
    user-select: none;         /* Prevents text selection on click */
	margin-bottom: 27px;
	display: flex;
	.menu-text{
			font-size: 14px;
	}
	.menu-icon {
		font-size: 12px;
	}
}
}

@media (min-width: 768px) {
   .hide-on-desktop {
  display: none !important;
 
  }
}