.elementor-kit-11{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-0f06c77:#2B2B2B;--e-global-color-204393a:#1470AF;--e-global-color-523b617:#FFFFFF;--e-global-color-407a6d2:#000000;--e-global-color-e936707:#FAFAFA;--e-global-color-7e560fa:#EDEFF9;--e-global-color-db32a8f:#1470AF;--e-global-color-80a5095:#1B9DD2;--e-global-color-203e40d:#0A77B8;--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-11 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);}@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 *//* ==================================================
   SERVICE CARD STYLING (Resting & Hover)
================================================== */

.service-card {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 30px;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 
    0 2px 4px rgba(0, 0, 0, 0.02),
    0 8px 16px rgba(0, 0, 0, 0.06),
    0 16px 32px rgba(0, 0, 0, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
  transition: all 0.35s ease-in-out !important;
  cursor: default;
}

/* Hover State */
.service-card:hover {
  background-color: #1470AF !important;
  transform: translateY(-8px) !important;
  box-shadow: 0 15px 35px rgba(20, 112, 175, 0.3) !important;
}

/* Text Colors on Hover */
.service-card:hover h1,
.service-card:hover h2,
.service-card:hover h3,
.service-card:hover h4,
.service-card:hover h5,
.service-card:hover h6,
.service-card:hover p,
.service-card:hover span,
.service-card:hover a {
  color: #ffffff !important;
  transition: color 0.35s ease-in-out !important;
}

/* Icon Colors on Hover */
.service-card:hover a svg,
.service-card:hover a svg path,
.service-card:hover .button-icon-end {
  fill: #ffffff !important;
  stroke: #ffffff !important;
  color: #ffffff !important;
  transition: all 0.35s ease-in-out !important;
}

.service-card img,
.service-card svg,
.service-card:hover img,
.service-card:hover svg {
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}
/* ==================================================
   PORTFOLIO CARD BASE STYLING
================================================== */

.portfolio-card-custom {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 15px !important;
  -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
  isolation: isolate !important;
  cursor: default !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* --------------------------------------------------
   UNIQUE BACKGROUND IMAGES PER CARD
-------------------------------------------------- */

.portfolio-card-custom.card-1 {
  background-image: url("YOUR_IMAGE_URL_HERE_1.jpg") !important;
}

.portfolio-card-custom.card-2 {
  background-image: url("YOUR_IMAGE_URL_HERE_2.jpg") !important;
}

.portfolio-card-custom.card-3 {
  background-image: url("YOUR_IMAGE_URL_HERE_3.jpg") !important;
}

/* --------------------------------------------------
   DARK OVERLAY GRADIENT
-------------------------------------------------- */

.portfolio-card-custom::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(0deg, rgba(0,0,0,0.85) 30%, rgba(0,0,0,0.2) 100%) !important;
  z-index: 1 !important;
  transition: opacity 0.4s ease !important;
  pointer-events: none !important;
  border-radius: 15px !important;
}

/* Ensures content sits above the dark overlay */
.portfolio-card-custom > * {
  position: relative !important;
  z-index: 2 !important;
}

/* --------------------------------------------------
   TEXT ANIMATIONS (Hide by Default, Show on Hover)
-------------------------------------------------- */

.portfolio-card-custom .elementor-widget-heading,
.portfolio-card-custom .elementor-widget-text-editor,
.portfolio-card-custom .elementor-widget-button,
.portfolio-card-custom .portfolio-badge {
  opacity: 0 !important;
  transform: translateY(80px) !important;
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

.portfolio-card-custom:hover .elementor-widget-heading,
.portfolio-card-custom:hover .elementor-widget-text-editor,
.portfolio-card-custom:hover .elementor-widget-button,
.portfolio-card-custom:hover .portfolio-badge {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* --------------------------------------------------
   CURSOR OVERRIDES
-------------------------------------------------- */

.portfolio-card-custom .elementor-button,
.portfolio-card-custom .elementor-widget-button .elementor-button,
.portfolio-card-custom a,
.portfolio-card-custom a * {
  cursor: pointer !important;
}

/* --------------------------------------------------
   BACKGROUND IMAGE ZOOM ON HOVER
-------------------------------------------------- */

.portfolio-card-custom {
  transition: transform 0.4s ease, background-size 0.4s ease !important;
}

.portfolio-card-custom:hover {
  transform: scale(1.03) !important;
}
/* Underline to Blue Pill Badge Effect */
u, .highlight-text u {
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    background-color: #1470AF !important;
    color: #ffffff !important;
    padding: 6px 20px !important;
    border-radius: 200px !important;
    transform: rotate(-3deg) !important;
    line-height: 1.2 !important;
}
button[type="submit"] {
    background: #1b9dd2 !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
    transition: background 0.3s ease !important;
}/* End custom CSS */