*,
*::before,
*::after {
  box-sizing: border-box;
}

:root {
  --background: 0 0% 100%;
  --foreground: 220 15% 15%;
  --card: 0 0% 100%;
  --card-foreground: 220 15% 15%;
  --popover: 0 0% 100%;
  --popover-foreground: 220 15% 15%;
  --primary: 220 70% 45%;
  --primary-foreground: 0 0% 100%;
  --primary-glow: 220 70% 55%;
  --secondary: 220 15% 95%;
  --secondary-foreground: 220 70% 45%;
  --muted: 220 15% 95%;
  --muted-foreground: 220 10% 50%;
  --accent: 45 100% 45%;
  --accent-foreground: 220 70% 30%;
  --accent-glow: 45 100% 55%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 0 0% 100%;
  --border: 220 15% 90%;
  --input: 220 15% 90%;
  --ring: 220 70% 45%;
  --radius: 0.5rem;
  --gradient-hero: linear-gradient(135deg, hsl(220 70% 45%), hsl(220 80% 30%));
  --gradient-accent: linear-gradient(
    135deg,
    hsl(45 100% 50%),
    hsl(45 100% 60%)
  );
  --gradient-subtle: linear-gradient(180deg, hsl(0 0% 100%), hsl(220 15% 98%));
  --gradient-dark: linear-gradient(135deg, hsl(220 50% 20%), hsl(220 60% 15%));
  --shadow-elegant: 0 10px 30px -10px hsl(220 70% 45% / 0.2);
  --shadow-glow: 0 0 40px hsl(220 70% 55% / 0.15);
  --shadow-accent: 0 10px 30px -10px hsl(45 100% 50% / 0.3);
  --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --sidebar-background: 0 0% 98%;
  --sidebar-foreground: 240 5.3% 26.1%;
  --sidebar-primary: 240 5.9% 10%;
  --sidebar-primary-foreground: 0 0% 98%;
  --sidebar-accent: 240 4.8% 95.9%;
  --sidebar-accent-foreground: 240 5.9% 10%;
  --sidebar-border: 220 13% 91%;
  --sidebar-ring: 217.2 91.2% 59.8%;

  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
}

#softlite-block-ql7vp1yg {
  display: none !important;
}

html {
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  font-family: "Segoe UI", ui-sans-serif, system-ui, -apple-system,
    BlinkMacSystemFont;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border-width: 0px;
}

button {
  font-family: inherit;
  transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.15s;
}

.hiddenBilling {
  display: none !important;
}

.borderLight {
  border: 1px solid hsl(var(--border));
}

.borderBottomLight {
  border-bottom: 1px solid hsl(var(--border));
}

nav .menu button:hover {
  color: hsl(var(--primary)) !important;
}

.hero {
  min-height: 100vh !important;
}

.hero .pOne,
.hero .pTwo {
  margin-bottom: 1rem !important;
}

.mBOne {
  margin-bottom: 1rem !important;
}

.animateIcon {
  animation: 2s cubic-bezier(0.4, 0, 0.6, 1) 0s infinite normal none running
    pulse;
}

@keyframes pulse {
  0%,
  100% {
    opacity: 1; /* Fully visible */
  }
  50% {
    opacity: 0.5; /* Half transparent */
  }
}

.animateIcon svg {
  width: 2rem;
}

.services > div {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.5s;
  animation-duration: 0.5s;
}

.services > div:hover {
  --tw-shadow-color: var(--shadow-glow);
  --tw-shadow: var(--tw-shadow-colored);
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.services .dubaiCta button {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.5s;
  animation-duration: 0.5s;
}

.services .dubaiCta button:hover {
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.services .terminCta button {
  width: 100% !important;
  justify-content: center;
}

.services .terminCta {
  width: 100% !important;
}

.benefits > div {
  border: 2px solid hsl(var(--primary) / 0.2);
}

.benefits > div img {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.5s;
  animation-duration: 0.5s;
}

.benefits > div {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.3s;
}

.benefits > div:hover img {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.benefits > div:hover {
  border-color: hsl(var(--primary) / 0.4);
}

.audience > div {
  border: 2px solid hsl(var(--primary) / 0.2);
}

.audience > div img {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.5s;
  animation-duration: 0.5s;
}

.audience > div {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.3s;
}

.audience > div:hover img {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.audience > div:hover {
  border-color: hsl(var(--primary) / 0.4);
}

.process > div {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.3s;
}

.process > div:hover {
  --tw-translate-y: -0.5rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y))
    rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y))
    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.ctaCall {
  text-decoration: none;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.3s;
}

.ctaCall:hover {
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1),
    0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color),
    0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
  background-color: #ffffffe6 !important;
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  transform: scale(1.05);
}

footer button {
  transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.15s;
}

footer button:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

footer #softlite-block-e201hprm {
  display: none !important;
}

footer .vjltfr7o a {
  color: #fff;
  text-decoration: none;
}

.envelope svg {
  width: 2.5rem;
}

.pageTwoSecOne {
  border: 1px solid hsl(var(--border));
}

.pageTwoSecTwo > div {
  border: 2px solid hsl(var(--primary) / 0.2);
}

.pageTwoSecThree {
  border: 1px solid hsl(var(--border));
}

.hidden-fields-container {
  display: none;
}

.contact-form .row {
  margin-bottom: 1rem;
}

.contact-form .row label {
  color: rgb(33, 36, 44);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}

.contact-form .row input,
.contact-form .row textarea {
  border: 1px solid hsl(var(--input));
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-right-width: 1px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border-top-width: 1px;
  display: flex;
  font-size: 14px;
  height: 40px;
  line-height: 20px;
  margin-top: 8px;
  padding-bottom: 8px;
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 8px;
  width: 100%;
  padding-block-start: 8px;
  padding-block-end: 8px;
  padding-inline-start: 12px;
  padding-inline-end: 12px;
  flex-direction: row;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
}

.contact-form .row textarea {
  min-height: 100px;
}

.contact-form .row > span {
  display: block;
}

form .contact-form .submitField {
  align-items: center;
  appearance: button;
  background-color: rgba(0, 0, 0, 0);
  background-image: linear-gradient(135deg, rgb(34, 88, 195), rgb(15, 56, 138));
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px,
    rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px;
  color: rgb(255, 255, 255);
  column-gap: 8px;
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 600;
  height: 44px;
  justify-content: center;
  line-height: 20px;
  padding-bottom: 0px;
  padding-left: 32px;
  padding-right: 32px;
  padding-top: 0px;
  row-gap: 8px;
  width: 100%;
  padding-inline-start: 32px;
  padding-inline-end: 32px;
  grid-column-gap: 8px;
  background-size: auto;
  flex-direction: row;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
}

.contact-form .bottomRow {
  color: rgb(115, 123, 140);
  font-size: 12px;
  line-height: 16px;
  margin-top: 16px;
  text-align: center;
}

.contact-form .wpcf7-not-valid-tip,
.formHome .wpcf7-not-valid-tip {
  font-size: 14px;
  color: #de0b0b;
}

.wpcf7-response-output {
  color: #de0b0b;
}

.screen-reader-response {
  display: none;
}

form[data-status="sent"] .wpcf7-response-output {
  color: green;
}

form[data-status="sent"] .contact-form,
form[data-status="sent"] .formHome {
  display: none;
}

.formHome .row {
  margin-bottom: 1rem;
}

.formHome .row label {
  color: rgb(255, 255, 255);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}
.formHome .row input,
.formHome .row select,
.formHome .row textarea {
  background-color: rgba(255, 255, 255, 0.1);
  border-bottom-color: rgba(255, 255, 255, 0.2);
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  border-bottom-width: 1px;
  border-left-color: rgba(255, 255, 255, 0.2);
  border-left-width: 1px;
  border-right-color: rgba(255, 255, 255, 0.2);
  border-right-width: 1px;
  border-top-color: rgba(255, 255, 255, 0.2);
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border-top-width: 1px;
  color: rgb(255, 255, 255);
  display: flex;
  font-size: 14px;
  height: 40px;
  line-height: 20px;
  margin-top: 8px;
  padding-bottom: 8px;
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 8px;
  width: 100%;
  padding-block-start: 8px;
  padding-block-end: 8px;
  padding-inline-start: 12px;
  padding-inline-end: 12px;
  flex-direction: row;
}

.formHome .row textarea {
  min-height: 100px;
}

.formHome .row select option {
  background-color: #132444;
  color: #fff; /* dark text */
  appearance: none; /* removes browser default arrow in some cases */
}

form .formHome .submitBtn {
  align-items: center;
  appearance: button;
  background-color: rgb(230, 172, 0);
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  color: rgb(23, 59, 130);
  column-gap: 8px;
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 600;
  height: 40px;
  justify-content: center;
  line-height: 20px;
  margin-top: 16px;
  padding-bottom: 8px;
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 8px;
  row-gap: 8px;
  width: 100%;
  padding-block-start: 8px;
  padding-block-end: 8px;
  padding-inline-start: 16px;
  padding-inline-end: 16px;
  grid-column-gap: 8px;
}

.formHome .submitBtn :hover {
  background-color: hsl(var(--accent) / 0.9);
}

@media all and (max-width: 1120px) {
  h1 {
    font-size: 2rem !important;
    line-height: 1.5em !important;
  }

  h2 {
    font-size: 1.6rem !important;
    line-height: 1.3em !important;
  }

  .half {
    grid-template-columns: 1fr !important;
    flex-direction: row !important;
  }
}

@media all and (max-width: 640px) {
  body {
    margin-top: 0 !important;
  }

  nav .menu > div:not(:last-child) {
    display: none !important;
  }

  #softlite-block-a2fcez2k {
    height: auto !important;
  }
}

.lang {
  position: relative;
  display: inline-block;
}

.lang ul {
  background-color: #0f1f3d;
  padding: 10px 15px;
  margin: 0;
  position: absolute;
  top: 25px;
  left: 10px;
  display: none;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  z-index: 10;
}

.lang ul li {
  list-style-type: none;
}

.lang ul li:first-child {
  margin-bottom: 5px;
}

.lang ul li a {
  color: #fff;
  text-decoration: none;
}

.lang ul li a:hover {
  text-decoration: underline;
}

.lang ul li.active a {
  font-weight: bold;
  text-decoration: underline;
}

.lang:hover ul,
.lang:focus-within ul {
  display: block;
}
