/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: ProCreator
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.3.0.1744719002
Updated: 2025-04-15 12:10:02

*/

/* Gradient color text class */

.custom-gradient-text {
  display: inline-block;
  background: 
    linear-gradient(92.54deg, #FFFFFF 0%, rgba(255, 255, 255, 0.671875) 0.01%, #CB1616 0.02%, #EE2D7E 99.99%),
    linear-gradient(0deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  transition: all 0.3s ease;
}

.custom-gradient-text:hover,
.custom-gradient-text:active {
  background: 
    linear-gradient(92.54deg, #FFFFFF 0%, rgba(255, 255, 255, 0.671875) 0.01%, #CB1616 0.02%, #EE2D7E 99.99%),
    linear-gradient(0deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

span.highlighter{
  color: #E92A6F !important;
}

/* Footer Imp links with Hover icon - start */
.footer-imp-links .elementor-icon-list-item:hover .elementor-icon-list-text,
.footer-imp-links .elementor-icon-list-item:active .elementor-icon-list-text {
  background: 
    linear-gradient(92.54deg, #FFFFFF 0%, rgba(255, 255, 255, 0.671875) 0.01%, #CB1616 0.02%, #EE2D7E 99.99%),
    linear-gradient(0deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  transition: all 0.3s ease;
}

.footer-imp-links .elementor-icon-list-item:hover .elementor-icon-list-text::after {
  content: "→";
  margin-left: 8px;
	font-size:22px;
  display: inline-block;
	vertical-align: middle;
  background: 
    linear-gradient(92.54deg, #FFFFFF 0%, rgba(255, 255, 255, 0.671875) 0.01%, #CB1616 0.02%, #EE2D7E 99.99%),
    linear-gradient(0deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  transition: all 0.3s ease;
}

/* Footer Imp links with Hover icon - end */

/* Header active links start */
.header-menu .elementor-item.elementor-item-active {
    font-weight: 700 !important;
    position: relative !important;
}

.header-menu .elementor-item.elementor-item-active::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    bottom: 0 !important;
    height: 2px !important;
    width: 100% !important;
    background: linear-gradient(180deg, #FF00D9 0%, #FF4400 100%) !important;
}


/* Header active links end */

/* Homepage- logo banners start */

.logo-banners-section {
  background: linear-gradient(
    92.28deg,
    #FFFFFF -28.69%,
    rgba(255, 255, 255, 0.671875) -28.68%,
    #CB1616 -28.67%,
    #6407B7 87.26%
  );
}

.logo-banners-section-back {
  background: linear-gradient(
    92.28deg,
    rgba(255, 255, 255, 0.4) -28.69%,     /* 40% opacity */
    rgba(255, 255, 255, 0.4) -28.68%,     /* 40% opacity */
    rgba(203, 22, 22, 0.4) -28.67%,       /* #CB1616 @ 40% */
    rgba(100, 7, 183, 0.4) 87.26%         /* #6407B7 @ 40% */
  ) !important;
}

/* Homepage- logo banners end */


/* Homepage - Blog post container - code start */
.blog-posts-container .elementor-posts .elementor-post__card .elementor-post__thumbnail {
  padding: 1px !important;
}
.blog-posts-container .elementor-post__card {
  height: 524px !important;
}

.blog-posts-container .elementor-post__card {
  background-color: transparent !important;
  border: 1px solid transparent !important;
  overflow: hidden !important;
  background-clip: padding-box !important;
  position: relative !important;
  z-index: 1 !important;
}

.blog-posts-container .elementor-post__card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  padding: 1px !important;
  background: 
    radial-gradient(94.31% 66.31% at -53.25% 10.23%, #FFFFFF 0%, rgba(255, 255, 255, 0.06) 100%),
    radial-gradient(86.84% 30.42% at 129.28% 66.93%, #E92A6E 0%, rgba(238, 45, 125, 0) 100%),
    radial-gradient(41.06% 41.06% at 51.09% -22.85%, #000000 0%, rgba(255, 255, 255, 0) 100%) !important;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
  -webkit-mask-composite: xor !important;
  mask-composite: exclude !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

@media (max-width: 768px) {
  .blog-posts-container .elementor-posts .elementor-post__card .elementor-post__thumbnail{
    height: 200px !important;
  }
}

/* Homepage - Blog post container - code end */

/* Counter box */

.blurbannerwithborder {
  background:
    linear-gradient(#0c0e13, #0c0e13) padding-box,  /* content background */
    linear-gradient(135deg, #e92a6e, #ffffff, #000000) border-box; /* border */
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 30px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px); /* for Safari */
}


/* Newletter form Elementor */

#form-field-email{
  position: absolute;
  left: -70px;
}
.newsletter-wrapper{
  padding-top: 10px !important;
}

.elementor-form .elementor-message-success {
  position: absolute;
  bottom: -55px;
  left: 0;
  width: 100%;
  text-align: center;
}

/* when selecting email input field */
#form-field-email:focus {
  border: none !important; /* White border */
  outline: none !important;             /* Removes default blue glow */
  box-shadow: none !important;          /* Prevents any shadow overrides */
  background-color: transparent;        /* Optional: for consistency */
}

/* When autofilling the email field */
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #2b2b2b inset !important; /* Match your form background */
  box-shadow: 0 0 0 1000px #2b2b2b inset !important;
  -webkit-text-fill-color: #ffffff !important; /* Optional: keeps text white */
  transition: background-color 5000s ease-in-out 0s; /* Prevents flash */
}


@media (max-width: 768px) {
  #form-field-submit{
    position: absolute;
    left: -30px;
    top: -20px;
    padding: 5px 20px;
  }
}


/* Intelligence page cards 4 */

/* Targeting the parent container */
.intelligence-page {
  display: flex;
  flex-wrap: wrap;
}

/* Ensuring all child blocks inside intelligence-page are same height */
.intelligence-page .blurbannerwithborder {
  height: 275px;
  box-sizing: border-box;
  flex: 1 1 275px; /* Allows for responsiveness */
  display: flex;
  flex-direction: column;
}


/* Contact form */

.url-color{
  color: #FFFFFF;
  text-decoration: underline !important;
}


/* Global Container - gradient border with blur background - start */

.global-gradient-border{
  border: 1px solid transparent;

  border-color: transparent; /* we'll use border-image instead */
  border-image-source: radial-gradient(
      circle at 20% 0%,
      white 0%,
      rgba(255, 255, 255, 0.08) 30%,
      rgba(238, 45, 125, 0.3) 60%,
      rgba(0, 0, 0, 0.2) 90%,
      rgba(255, 255, 255, 0) 100%
      );
      border-image-slice: 1; /* ensures entire image is used for border */
      border-image-repeat: stretch; /* makes sure the gradient stretches */
      border-image-width: 1; /* default is 1, explicitly setting here */
      border-image-outset: 0; /* default, no extra space outside the border */
      box-sizing: border-box; 
    }

  .global-background-blur {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(
        circle at 8% 0%,
        rgba(255, 255, 255, 0.08),
        rgba(255, 255, 255, 0) 100%
    );
    z-index: -1;
  }

/*  Global Container - gradient border with blur background - start */