.elementor-kit-18{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-18 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* FX Notes – Title Gradient */
.fx-title-gradient {
  background: linear-gradient(90deg, #9593EA 0%, #cc9ad5 50%, #D5A1C2 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  display: inline-block; /* keeps gradient tight to text */
}

/* If the heading is a link */
.fx-title-gradient a {
  background: inherit;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* FX Notes – Shimmer Button */
.fx-shimmer-btn {
  position: relative;
  overflow: hidden;
}

/* Shine layer */
.fx-shimmer-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 120%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent 30%,
    rgba(255, 255, 255, 0.35),
    transparent 70%
  );
  transition: transform 0.6s ease;
  transform: translateX(0);
}

/* Hover → left to right */
.fx-shimmer-btn:hover::before {
  transform: translateX(200%);
}

/* Mouse out → right to left */
.fx-shimmer-btn:not(:hover)::before {
  transition: transform 0.6s ease;
}


.fx-footer-socials {
  display: flex;
  gap: 22px;              /* spacing between icons */
  align-items: center;
}

.fx-footer-socials a {
  display: inline-flex;
  align-items: center;
  line-height: 0;
}

.fx-footer-socials img {
  width: 26px;            /* icon size */
  height: 26px;
  display: block;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.fx-footer-socials a:hover img {
  opacity: 0.7;
  transform: translateY(-1px);
}

/* Toggle container */
.plan-toggle {
  display: inline-flex;
  border: 1px solid #e7e7ff;
  border-radius: 14px;
  overflow: hidden;
}

/* Toggle links */
.price-toggle {
  padding: 10px 22px;
  font-weight: 600;
  color: #2b2f4b;
  text-decoration: none;
  transition: all .25s ease;
}

/* Active toggle */
.price-toggle.active,
.price-toggle.active a {
  background: linear-gradient(90deg,#A595E3,#A595E3);
  color: #ffffff !important;
}

/* ===== FX Contact Form (Elementor) ===== */

/* Page/section background container */
.fx-contact-container{
  min-height: 100vh;
  background: linear-gradient(135deg, #f9fafb 0%, rgba(243, 232, 255, 0.3) 50%, rgba(252, 231, 243, 0.3) 100%);
  padding: 80px 16px;
}

/* Center + max width wrapper (optional but recommended) */
.fx-contact-wrapper{
  max-width: 600px;
  margin: 0 auto;
}

/* Gradient border “card” effect around the Elementor form */
.fx-contact-form{
  position: relative;
  padding: 2px;
  border-radius: 16px;
  background: linear-gradient(135deg, #9593EA 0%, #cc9ad5 50%, #D5A1C2 100%);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

/* White inner card */
.fx-contact-form .elementor-form-fields-wrapper{
  background: #fff;
  border-radius: 14px;
  padding: 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

@media (min-width: 1024px){
  .fx-contact-form .elementor-form-fields-wrapper{
    padding: 40px;
  }
}

/* Make all fields full width by default */
.fx-contact-form .elementor-field-group{
  width: 100%;
  margin: 0 !important;
}

/* 2-column row on desktop (Name + Email) */
@media (min-width: 640px){
  .fx-contact-form .elementor-field-group.fx-half{
    width: calc(50% - 10px);
  }
}

/* Inputs/select/textarea styling */
.fx-contact-form input.elementor-field,
.fx-contact-form select.elementor-field,
.fx-contact-form textarea.elementor-field{
  width: 100%;
  padding: 16px 20px;
  border: 2px solid #E5E7EB;
  border-radius: 12px;
  background: rgba(249, 250, 251, 0.5);
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  transition: all 0.3s ease;
  box-shadow: none !important;
}

.fx-contact-form input.elementor-field:hover,
.fx-contact-form select.elementor-field:hover,
.fx-contact-form textarea.elementor-field:hover{
  border-color: #D1D5DB;
}

.fx-contact-form input.elementor-field:focus,
.fx-contact-form select.elementor-field:focus,
.fx-contact-form textarea.elementor-field:focus{
  outline: none;
  border-color: #A595E3;
  background: #fff;
  box-shadow: 0 10px 15px -3px rgba(165, 149, 227, 0.3) !important;
}

/* Select dropdown arrow styling */
.fx-contact-form select.elementor-field{
  appearance: none;
  cursor: pointer;
  color: #374151;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236B7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 20px;
  padding-right: 40px;
}

/* Textarea sizing */
.fx-contact-form textarea.elementor-field{
  resize: none;
  min-height: 150px;
}

/* Submit button */
.fx-contact-form button[type="submit"].elementor-button{
  width: 100%;
  padding: 16px;
  background: linear-gradient(135deg, #9593EA 0%, #cc9ad5 50%, #D5A1C2 100%);
  color: #fff;
  font-weight: 600;
  font-size: 16px;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
}

.fx-contact-form button[type="submit"].elementor-button:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 25px -5px rgba(149, 147, 234, 0.4);
}

.fx-contact-form button[type="submit"].elementor-button:active{
  transform: translateY(0);
}

/* Remove Elementor label spacing if you’re using placeholders only */
.fx-contact-form .elementor-field-label{
  display: none;
}

/* ===== Fix Elementor SELECT styling (dropdown) ===== */

/* Target the select inside Elementor's select wrapper */
.fx-contact-form .elementor-select-wrapper select.elementor-field-textual{
  width: 100%;
  padding: 16px 40px 16px 20px;  /* room for arrow on the right */
  border: 2px solid #E5E7EB;
  border-radius: 12px;
  background: rgba(249, 250, 251, 0.5);
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  line-height: 1.2;
  color: #374151;

  /* remove native styling */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  /* kill any theme background arrows */
  background-image: none !important;
  box-shadow: none !important;
}

/* Hover/focus states to match inputs */
.fx-contact-form .elementor-select-wrapper select.elementor-field-textual:hover{
  border-color: #D1D5DB;
}

.fx-contact-form .elementor-select-wrapper select.elementor-field-textual:focus{
  outline: none;
  border-color: #A595E3;
  background: #fff;
  box-shadow: 0 10px 15px -3px rgba(165, 149, 227, 0.3) !important;
}

/* Ensure wrapper doesn't add weird borders/padding */
.fx-contact-form .elementor-select-wrapper{
  position: relative;
}

/* Style + position Elementor's SVG caret */
.fx-contact-form .elementor-select-wrapper .select-caret-down-wrapper{
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none; /* click goes to select */
  display: flex;
  align-items: center;
}

/* Size + soften the caret */
.fx-contact-form .elementor-select-wrapper .select-caret-down-wrapper svg{
  width: 18px;
  height: 18px;
  opacity: 0.7;
}

/* If Elementor adds any pseudo "before" decorations, kill them */
.fx-contact-form .elementor-select-wrapper.remove-before:before,
.fx-contact-form .elementor-select-wrapper.remove-before:after{
  display: none !important;
  content: none !important;
}


/* ===== True gradient border overlay (keeps existing styles) ===== */

.fx-gradient-border{
  position: relative;
  border-radius: 28px;   /* match your current rounding */
  z-index: 0;            /* creates stacking context */
}

/* Gradient border layer */
.fx-gradient-border::before{
  content: "";
  position: absolute;
  inset: 0;              /* cover the container */
  padding: 2px;          /* border thickness */
  border-radius: inherit;
  background: linear-gradient(135deg, #9593EA 0%, #cc9ad5 50%, #D5A1C2 100%);
  pointer-events: none;
  z-index: -1;

  /* Mask out the middle so only the "border" remains */
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}/* End custom CSS */