/* =========================
   Video Form CTA
========================= */

.video-form-cta{
    position: relative;
    overflow-x: visible;
    min-height: 520px;
    color: #fff;
    position: relative;
}

.video-form-cta::after{
  content: "";
  position: absolute;
  left: -3px;
  top: -2px;
  height: 350px;
  background: linear-gradient(180deg, rgba(14, 7, 11, 1) 0%, rgb(198 0 0 / 0%) 100%);
  width: 110%;
  filter: blur(1px);
}

.video-form-cta::before{
  content: "";
  position: absolute;
  left: -1px;
  bottom: -2px;
  height: 350px;
  background: linear-gradient(0deg, rgba(14, 7, 11, 1) 0%, rgb(198 0 0 / 0%) 100%);
  width: 100%;
  filter: blur(1px);
      z-index: 1;
}

.video-form-cta .vfc-bg{
  position: absolute;
  inset: 0;
  z-index: 0;
  
}

.video-form-cta .vfc-video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-form-cta .vfc-overlay{
    position: absolute;
    inset: 0;
    background: linear-gradient(270deg, #0e070b 10%, #0e070b33 100%);
}

.video-form-cta .vfc-container{
  position: relative;
  z-index: 1;
  max-width: 1638px;
  margin: 0 auto;
  padding: 179px 72px 24px;
}

.video-form-cta .vfc-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.video-form-cta .vfc-heading{
    margin: 0;
    font-family: "Mona Sans", sans-serif;
    font-weight: 300;
    font-size: 72px;
    line-height: 140%;
    color: #FFF;
    margin-right: -40px;
    position: relative;
    z-index: 3;
}

@media (max-width: 1440px){
  .video-form-cta .vfc-heading{
    font-size: 64px;
  }
}

/* =========================
   Form panel
========================= */

.video-form-cta .vfc-form-panel{
  position: relative;
}

.video-form-cta .vfc-form-content{
  position: relative;
  z-index: 2;
  padding: 40px 0px 40px 108px;
}

.video-form-cta .vfc-form-title{
    margin: 0 0 24px;
    color: #FFFFFF;
    font-family: "SF UI Display", sans-serif;
    font-weight: 200;
    font-size: 32px;
    line-height: 120%;
    text-transform: uppercase;
    text-align: center;
}

.video-form-cta .vfc-form-text{
    margin: 0 0 40px;
    color: #FFFFFF99;
    font-family: "SF UI Display", sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
}

.video-form-cta .vfc-form-missing{
  margin: 0;
  color: rgba(255,255,255,.75);
  font-size: 14px;
}

/* =========================
   Triangles (animated opposite)
========================= */

.video-form-cta .vfc-triangle{
  position: absolute;
  z-index: 1;
  pointer-events: none;
  user-select: none;
  opacity: 1;
  will-change: transform;
}

.video-form-cta .vfc-triangle--pink{
  min-width: 1200px;
  right: -370px;
  top: -120px;
  animation: vfcFloatPink 3s ease-in-out infinite alternate;
}

.video-form-cta .vfc-triangle--black{
    position: absolute;
    min-width: 1200px;
    right: -370px;
    top: -140px;
    opacity: 1;
    animation: vfcFloatBlack 3s ease-in-out infinite alternate;
}

@keyframes vfcFloatPink{
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(6deg); }
}

@keyframes vfcFloatBlack{
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-10deg); }
}

/* =========================
   Fluent Forms basic polish (safe)
========================= */

.video-form-cta .vfc-form .ff-el-group{ margin-bottom: 24px; }

.video-form-cta .vfc-form input[type="text"],
.video-form-cta .vfc-form input[type="email"],
.video-form-cta .vfc-form input[type="tel"],
.video-form-cta .vfc-form textarea,
.video-form-cta .vfc-form select{
    border-bottom: 1px solid #342E31;
    border-color: #342E31 !important;
    border-top: none;
    border-left: none;
    border-right: none;
    padding: 12px 16px;
    font-family: "SF UI Display", sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    background-color: transparent;
        border-radius: 0;
}

.video-form-cta .vfc-form input[type="text"]:focus,
.video-form-cta .vfc-form input[type="email"]:focus,
.video-form-cta .vfc-form input[type="tel"]:focus,
.video-form-cta .vfc-form textarea:focus,
.video-form-cta .vfc-form select:focus{
  background-color: transparent;
}

.video-form-cta .vfc-form .ff-el-input--content{
  position: relative;
}

.video-form-cta .vfc-form .ff-el-is-error input[type="text"], 
.video-form-cta .vfc-form .ff-el-is-error input[type="email"], 
.video-form-cta .vfc-form .ff-el-is-error input[type="tel"], 
.video-form-cta .vfc-form .ff-el-is-error textarea, 
.video-form-cta .vfc-form .ff-el-is-error select{
    border-bottom: 1px solid #B4080B !important;
}


.video-form-cta .vfc-form .error{
    position: absolute;
    font-size: 0 !important;
    top: 0;
    right: 0;
    width: 24px;
    height: 24px;
    background-image: url(/wp-content/uploads/2026/02/material-symbols_error-outline-rounded.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.video-form-cta .vfc-form input[type="text"]::placeholder,
.video-form-cta .vfc-form input[type="email"]::placeholder,
.video-form-cta .vfc-form input[type="tel"]::placeholder,
.video-form-cta .vfc-form textarea::placeholder,
.video-form-cta .vfc-form select::placeholder{
    color: #FFFFFF99;
}

.video-form-cta .vfc-form textarea{ min-height: 90px; resize: vertical; }

.video-form-cta .vfc-form input::placeholder,
.video-form-cta .vfc-form textarea::placeholder{
  color: rgba(255,255,255,0.45);
}

.video-form-cta .vfc-form button,
.video-form-cta .vfc-form input[type="submit"]{
    background-color: #E51467 !important;
    border: 1px solid #E51467 !important;
    color: #fff !important;
    padding: 12px 24px;
    border-radius: 0;
    cursor: pointer;
    text-transform: none;
    font-family: "SF UI Display", sans-serif;
    font-weight: 300;
    font-size: 16px !important;
    line-height: 24px;
    transition: all 0.5s;
        margin-bottom: 16px;
}

.video-form-cta .vfc-form button:hover,
.video-form-cta .vfc-form input[type="submit"]:hover{
  background-color: #FFF!important;
  color: #E51467 !important;  
  border: 1px solid #FFF !important;
      min-width: auto !important;
}

.video-form-cta .form-bottom-text p{
    margin: 0;
    font-family: "SF UI Display", sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 20px;
    color: #FFFFFF;
}

/* =========================
   Responsive
========================= */

@media (max-width: 1524px){
  .video-form-cta .vfc-triangle--pink{
    right: -430px;
  }
  .video-form-cta .vfc-triangle--black {
    right: -430px;
  } 
}

@media (max-width: 1471px){
  .video-form-cta .vfc-triangle--pink{
    right: -540px;
  }
  .video-form-cta .vfc-triangle--black {
    right: -540px;
  } 
}

@media (max-width: 1220px){
  .video-form-cta .vfc-form-content {
      padding: 40px 0px 40px 20px;
  }
  .video-form-cta .vfc-heading{
    font-size: 64px;
            z-index: 2;
        position: relative;
  }
  
}

@media (max-width: 1150px){
  .video-form-cta .vfc-triangle--pink {
      top: -90px;
  }
  .video-form-cta .vfc-triangle--black {
    top: -90px;
  } 
}

@media (max-width: 1024px){
  .video-form-cta .vfc-grid{
    grid-template-columns: 1fr;
    gap: 180px;
  }
  .video-form-cta .vfc-heading{
    max-width: 18ch;
  }

  .video-form-cta .vfc-right{
    position: relative;
  }

  .video-form-cta .vfc-triangle--pink {
    min-width: 1500px;
    height: 1100px;
    right: 0;
    top: -116px;
    left: -100px;
  }

  .video-form-cta .vfc-triangle--black {
    min-width: 1500px;
    height: 1100px;
    right: 0;
    top: -143px;
    left: -154px;
  }

  .video-form-cta .vfc-overlay{
    background: none;
  }
}

@media (max-width: 767px){
  .video-form-cta .vfc-container{
            padding: 100px 16px 40px;
  }
  .video-form-cta .vfc-form-content{
    padding: 28px 18px 22px;
  }


  .video-form-cta .vfc-heading{
    font-size: 42px;
    text-align: center;
    margin: 0 auto;
  }

  .video-form-cta .vfc-form-title{
    font-size: 24px;
  }

  .video-form-cta .vfc-video{
        max-height: 400px;
  }
}


html[lang^="ar"] .video-form-cta .vfc-triangle--pink{
  left: -370px;
  right: auto;
}

html[lang^="ar"] .video-form-cta .vfc-triangle--black{
  left: -370px;
  right: auto;
}

html[lang^="ar"] .video-form-cta .vfc-form-content{
  padding: 40px 108px 40px 0;
}

@media (max-width: 1220px){
	html[lang^="ar"] .video-form-cta .vfc-form-content{
		padding: 40px 0;
	}

}