/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Mar 31 2026 | 14:21:57 */
/* Normal State */
.our-icon .elementor-icon svg path {
    stroke: #1d1d1d !important;
    transition: stroke 0.3s ease;
	cursor: pointer;
}

/* Hover State */
.our-icon .elementor-icon:hover svg path {
    stroke: #9134C9 !important;
}
.color-title{
	color: #9134C9;
	font-weight: 700;
}
/* Normal State */
.our-button .elementor-button {
    background-color: #E3D5EC;
    transition: all 0.4s ease;
    cursor: pointer;
}
.our-button span.elementor-button-content-wrapper
 {
    align-items: center;
}
.our-button .elementor-button-icon {
    background-color: rgba(0, 0, 0, 0.05);
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.3s ease;
}

/* Target the SVG icon inside our-button */
.our-button .elementor-button-icon svg {
    fill: #9134C9; /* Initial Purple */
    width: 14px;
    height: auto;
    transition: fill 0.3s ease;
}

.our-button .elementor-button:hover .elementor-button-icon {
    background-color: #A656D1;
    transform: scale(1.05);
}
/* SVG purple */
.our-button .elementor-button .elementor-button-icon svg {
    fill: #9134C9;
}
/* SVG turns white on hover */
.our-button .elementor-button:hover .elementor-button-icon svg {
    fill: #FFFFFF;
}
/* Selection Guide Styling */
/* 1. Base State for the Title */
.guide-card h3 {
    color: #1d1d1d; /* Original black color */
    display: inline-block;
    border-bottom: 1px solid #9134C9; /* Original purple underline */
    padding-bottom: 2px;
    transition: all 0.4s ease;
}

/* 2. Hover State for the Full Card */
.guide-card:hover {
    cursor: pointer;
    /* Optional: add a slight lift or shadow to the card itself */
    transform: translateY(-5px);
    box-shadow: 0px 10px 30px rgba(145, 52, 201, 0.1);
}

/* 3. Changing the Title when Card is hovered */
.guide-card:hover h3 {
    color: #9134C9 !important; /* Title turns purple */
    border-bottom-color: #1d1d1d !important; /* Underline turns black */
}

/* 4. Ensuring smooth transition for the card */
.guide-card {
    transition: all 0.4s ease;
}

/* Lite Purple Button */
.purple-lite-btn .elementor-button {
    /* 1. SEMI-TRANSPARENT BASE */
    background: rgba(145, 52, 201, 0.19) !important; 
    
    /* 2. THE GLASS EFFECT */
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    
    /* 3. SHAPE & BORDER */
    border-radius: 100px; /* Pill shape for buttons/steppers */
    border: 0.5px solid rgba(255, 255, 255, 0.3) !important;
    
    /* 4. OPTIONAL: LINEAR GRADIENT OVERLAY */
    /* This matches the 'Linear' fill seen in your selection colors */
    background-image: linear-gradient(
        180deg, 
        rgba(255, 255, 255, 0.1) 0%, 
        rgba(145, 52, 201, 0.05) 100%
    ) !important;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.purple-lite-btn .elementor-button:hover {
    /* 1. INCREASE BACKGROUND OPACITY SLIGHTLY */
    background: rgba(145, 52, 201, 0.3) !important; 
    
    /* 2. BRIGHTEN THE BORDER */
    border-color: rgba(255, 255, 255, 0.6) !important;

    /* 3. ADD A SOFT OUTER GLOW TO MATCH THE BRAND */
    box-shadow: 0px 8px 20px rgba(145, 52, 201, 0.3);
    
    /* 5. SLIGHTLY INTENSIFY THE GRADIENT */
    background-image: linear-gradient(
        180deg, 
        rgba(255, 255, 255, 0.2) 0%, 
        rgba(145, 52, 201, 0.1) 100%
    ) !important;
}

/* Ensure the transition is smooth */
.purple-lite-btn .elementor-button {
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.wpcf7 form.sent .wpcf7-response-output {
    border-color: green;
    color: #fff;
    margin-top: 10px;
    border-radius: 25px;
}