.hidden {
     display: none;
 }

 .contact-hosting {
     font-size: 20px;
     font-weight: 400;
     line-height: 38.73px;
     color: #292929;

 }

 section.rating-section {
     padding: 0;
     margin: 78px 0;
 }

 .high-q-server {
     /*margin-top: 70px;*/
     margin-bottom: 70px;
 }

 section.customer-support {
     margin-bottom: 30px;
     margin-top: 0;
 }

 .padding-heading {
     padding: 0px !important;
 }

 .lists-hosting {
     margin-top: 25px !important;
 }



 .section-p {
     height: 30vh !important;
     top: 300px !important;
     margin-top: 80px;
 }

 section.established {
     padding-bottom: 25px;
 }

 .review-content {
     margin: 70px 0;
 }

 button.nav-link.teb-bg-purple {
     background: #f6f6f6;
     font-size: 17px;
     font-weight: 600;
     line-height: 30px;
     padding: 20px 0;
     color: #292929;
     width: 100%;
 }

 button.nav-link.active.teb-bg-purple {
     background: #fff;
     font-size: 17px;
     font-weight: 500;
     line-height: 30px;
     padding: 20px 0;
     width: 100%;
 }

 div.price-container {
     margin-bottom: 16px;
 }

 section.faq {
     margin-bottom: 0;
 }

 section.table-comparison {
     position: -webkit-sticky;
     position: sticky;
     top: 0;
     background-color: #fff;
     z-index: 99999;
     margin-bottom: 0;
 }

 .free_setup {
     position: absolute;
     top: 6rem;
     right: -61px;
     transform: rotate(-90deg);
     padding: 10px 16px;
     border-radius: 10px 10px 0 0;
     width: 162px;
 }

 .row.nav.nav-pills.wid-more {

     margin-bottom: 10px;
 }

 @media only screen and (min-width: 320px) and (max-width: 767px) {
     section.explore-section {
         margin: 0px 0px;
     }

     .row.flex_unset.shared-hosting-m-set {
         margin-top: 0px;
     }
 }

 .highlight {
     color: #5E3ADD;
     font-weight: 500;
 }

 .paragraph {
     text-align: center;
     padding: 0px;
     border-bottom: 1px dashed #5532CD !important;
     cursor: pointer;
 }

 .btn-purpal {
     background-color: #5532CD;
 }


 .custom-tooltip-wrapper {
     position: relative;
     display: inline-block;
     cursor: pointer;
 }

 .custom-tooltip-text {
     position: absolute;
     bottom: -175px;
     /* Adjust based on height */
     left: -30px;
     background-color: #2D253F;
     color: #fff;
     padding: 10px 12px;
     border-radius: 6px;
     font-size: 14px;
     line-height: 1.4;
     width: 275px;
     visibility: hidden;
     opacity: 0;
     transition: opacity 0.3s ease;
     z-index: 999;
     box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.2);
 }

 .custom-tooltip-wrapper:hover .custom-tooltip-text {
     visibility: visible;
     opacity: 1;
 }

 .custom-tooltip-arrow {
     position: absolute;
     top: -5px;
     left: 20px;
     width: 10px;
     height: 10px;
     background-color: #2D253F;
     transform: rotate(45deg);
 }



 .blink:hover {
     animation: none;
 }

 .blink {
     animation: blink 1s steps(1, end) infinite;
 }

 @keyframes blink {
     0% {
         opacity: 1;
     }

     50% {
         opacity: 0;
     }

     100% {
         opacity: 1;
     }
 }



 .second-child {
     background-color: #ffffff;
 }

 .wid-more {
     padding: 4px;
 }

 .fa-check {
     margin-top: 4px;
     width: 20px;
     margin-right: 8px;
     font-size: 23px;
     color: #656161;
 }

 @media(max-width:500px) {
     #planmobile {
         gap: 15px;
     }
 }

 .icon-color {
     color: #4E31AD !important;
 }

 .owl-ai-website-builder .item {
     background: #4DC7A0;
     padding: 30px;
     text-align: center;
     color: #fff;
     border-radius: 10px;
     font-size: 20px;
 }

 .feature_cols_desciption-ai {
     position: relative;
     border-radius: 15px;
     box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
     padding: 1rem 1.5rem;
     overflow: hidden;
     background: #fff;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .feature_cols_desciption-ai:hover {
     transform: translateY(-5px);
     box-shadow: 0 12px 20px rgba(0, 0, 0, 0.15);
 }

 /* top border bar (initially hidden width) */
 .feature_cols_desciption-ai::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     height: 4px;
     width: 0;
     background: #5138CC;
     transition: width 0.6s ease-in-out;
     border-top-left-radius: 15px;
     border-top-right-radius: 15px;
 }

 /* on hover, animate the bar expanding to full width */
 .feature_cols_desciption-ai:hover::before {
     width: 100%;
 }

 /* Icon style (idle state) */
 .icon-wrap img {
     font-size: 2rem;
     color: #7873f5;
     transition: transform 0.3s ease;
 }

 /* ✅ Animate icon only on card hover */
 .feature_cols_desciption-ai:hover .icon-wrap img {
     animation: pulseIcon 1s infinite;
 }

 @keyframes pulseIcon {

     0%,
     100% {
         transform: scale(1);
     }

     50% {
         transform: scale(1.2);
     }
 }

 .zoom-hover-effect {
     display: inline-block;
     padding: 12px 25px;
     background-color: #4E31AD !important;
     color: #fff;
     text-decoration: none;
     border-radius: 10px;
     font-size: 16px;
     font-weight: 600;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .zoom-hover-effect:hover {
     transform: scale(1.1);
     box-shadow: 0 5px 15px rgba(78, 49, 173, 0.4);
 }

 #carouselMobile,
 #carouselExampleAutoplay {
     position: relative;
 }



 .top-right-prev,
 .top-right-next {
     position: absolute;



     top: 10px;
     width: 40px;
     height: 40px;
     background-color: #4927B9;
     color: white;
     border-radius: 50%;
     z-index: 5;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 /* Adjust positions */
 .top-right-prev {
     right: 60px;
     left: auto;
 }

 .top-right-next {
     right: 10px;
 }

 /* Styling for the explore plans button with Animate AI effects and default color #5e3add */
 .link-color-black {
     text-decoration: none;
     color: inherit;
 }

 .btn-yellow.btn-explore-plan {
     --primary-color: hsl(260, 70%, 54%);
     /* #5e3add */
     --border_radius: 9999px;
     --transtion: 0.3s ease-in-out;
     --offset: 2px;

     cursor: pointer;
     position: relative;
     display: inline-flex;
     align-items: center;
     gap: 0.5rem;
     transform-origin: center;
     padding: 1rem 2rem;
     background-color: transparent;
     border: none;
     border-radius: var(--border_radius);
     transform: scale(calc(1 + (var(--active, 0) * 0.1)));
     transition: transform var(--transtion);
 }

 .btn-yellow.btn-explore-plan::before {
     content: "";
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 100%;
     height: 100%;
     background-color: var(--primary-color);
     border-radius: var(--border_radius);
     box-shadow: inset 0 0.5px hsl(0, 0%, 100%), inset 0 -1px 2px 0 hsl(0, 0%, 0%),
         0px 4px 10px -4px hsla(0 0% 0% / calc(1 - var(--active, 0))),
         0 0 0 calc(var(--active, 0) * 0.375rem) hsl(260, 70%, 60% / 0.75);
     /* Lighter #5e3add for glow */
     transition: all var(--transtion);
     z-index: 0;
 }

 .btn-yellow.btn-explore-plan::after {
     content: "";
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 100%;
     height: 100%;
     background-color: hsla(260, 70%, 60%, 0.75);
     /* Lighter #5e3add */
     background-image: radial-gradient(at 51% 89%, hsla(260, 60%, 74%, 1) 0px, transparent 50%),
         radial-gradient(at 100% 100%, hsla(260, 50%, 60%, 1) 0px, transparent 50%),
         radial-gradient(at 22% 91%, hsla(260, 50%, 60%, 1) 0px, transparent 50%);
     background-position: top;
     opacity: var(--active, 0);
     border-radius: var(--border_radius);
     transition: opacity var(--transtion);
     z-index: 2;
 }

 .btn-yellow.btn-explore-plan:is(:hover, :focus-visible) {
     --active: 1;
 }

 .btn-yellow.btn-explore-plan:active {
     transform: scale(1);
 }

 .btn-yellow.btn-explore-plan .dots_border {
     --size_border: calc(100% + 2px);
     overflow: hidden;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: var(--size_border);
     height: var(--size_border);
     background-color: transparent;
     border-radius: var(--border_radius);
     z-index: -10;
 }

 .btn-yellow.btn-explore-plan .dots_border::before {
     content: "";
     position: absolute;
     top: 30%;
     left: 50%;
     transform: translate(-50%, -50%);
     transform-origin: left;
     transform: rotate(0deg);
     width: 100%;
     height: 2rem;
     background-color: white;
     mask: linear-gradient(transparent 0%, white 120%);
     animation: rotate 2s linear infinite;
 }

 @keyframes rotate {
     to {
         transform: rotate(360deg);
     }
 }

 .btn-yellow.btn-explore-plan .sparkle {
     position: relative;
     z-index: 10;
     width: 1.75rem;
 }

 .btn-yellow.btn-explore-plan .sparkle .path {
     fill: currentColor;
     stroke: currentColor;
     transform-origin: center;
     color: hsl(0, 0%, 100%);
 }

 .btn-yellow.btn-explore-plan:is(:hover, :focus) .sparkle .path {
     animation: path 1.5s linear 0.5s infinite;
 }

 .btn-yellow.btn-explore-plan .sparkle .path:nth-child(1) {
     --scale_path_1: 1.2;
 }

 .btn-yellow.btn-explore-plan .sparkle .path:nth-child(2) {
     --scale_path_2: 1.2;
 }

 .btn-yellow.btn-explore-plan .sparkle .path:nth-child(3) {
     --scale_path_3: 1.2;
 }

 @keyframes path {

     0%,
     34%,
     71%,
     100% {
         transform: scale(1);
     }

     17% {
         transform: scale(var(--scale_path_1, 1));
     }

     49% {
         transform: scale(var(--scale_path_2, 1));
     }

     83% {
         transform: scale(var(--scale_path_3, 1));
     }
 }

 .btn-yellow.btn-explore-plan .text_button {
     position: relative;
     z-index: 10;
     background-image: linear-gradient(90deg,
             hsla(0 0% 100% / 1) 0%,
             hsla(0 0% 100% / var(--active, 0)) 299%);
     background-clip: text;
     font-size: 1rem;
     color: transparent;
 }

 .btn-yellow.btn-explore-plan .fa-arrow-right {
     position: relative;
     z-index: 10;
     color: hsl(0, 0%, 100%);
     font-size: 1rem;
     transition: transform var(--transtion);
 }

 .btn-yellow.btn-explore-plan:is(:hover, :focus) .fa-arrow-right {
     transform: translateX(5px);
     /* Arrow moves right on hover */
 }

 /* get stared animation*/

 button.learn-more {
     position: relative;
     display: inline-block;
     cursor: pointer;
     outline: none;
     border: 0;
     vertical-align: middle;
     text-decoration: none;
     background: transparent;
     padding: 0;
     font-size: inherit;
     font-family: inherit;
 }

 .learn-more {
     width: 14rem;
     height: auto;
 }

 .learn-more .circle {
     transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
     position: relative;
     display: block;
     margin: 0;
     width: 3rem;
     height: 3rem;
     background: #5E3ADC;
     border-radius: 1.625rem;
 }

 .learn-more .icon {
     transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
     position: absolute;
     top: 0;
     bottom: 0;
     margin: auto;
     background: #fff;
 }

 .icon.arrow {
     transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
     left: 0.625rem;
     width: 1.125rem;
     height: 0.125rem;
     background: none;
 }

 .learn-more .icon.arrow::before {
     position: absolute;
     content: '';
     top: -0.25rem;
     right: 0.0625rem;
     width: 0.625rem;
     height: 0.625rem;
     border-top: 0.125rem solid #fff;
     border-right: 0.125rem solid #fff;
     transform: rotate(45deg);
 }

 .learn-more .button-text {
     transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
     position: absolute;
     top: 0;
     left: 12px;
     right: 0;
     bottom: 0;
     padding: 0.75rem 0;
     margin: 0 0 0 1.75rem;
     color: #291D51;
     font-weight: 700;
     line-height: 1.6;
     text-align: center;
     text-transform: uppercase;
 }

 /* Simulated hover effect */
 .learn-more.animate .circle {
     width: 100%;
 }

 .learn-more.animate .icon.arrow {
     background: #fff;
     transform: translate(1rem, 0);
 }

 .learn-more.animate .button-text {
     color: #fff;
 }

 .exploreplan-btn {
     position: relative;
     padding: 14px 30px;
     font-size: 16px;
     color: #fff;
     background: #46318B;
     border: 2px solid #46318B;
     border-radius: 12px;
     cursor: pointer;
     overflow: hidden;
     z-index: 1;
     transition: all 0.4s ease;
 }

 .exploreplan-btn::after {
     content: "";
     position: absolute;
     top: -50%;
     left: -50%;
     width: 200%;
     height: 200%;
     background: url('https://www.transparenttextures.com/patterns/white-diamond.png');
     background-size: cover;
     opacity: 0.3;
     z-index: 1;
     pointer-events: none;
 }

 .exploreplan-btn:hover {
     background: #5E3ADC;
     border-color: #5E3ADC;
     color: #fff;
     box-shadow: 0 0 12px #5E3ADC, 0 0 24px rgba(94, 58, 220, 0.4);
 }

 .exploreplan-btn:focus {
     outline: none;
 }

 .exploreplan-btn span {
     position: relative;
     z-index: 3;
 }

 .comparison-table {
     width: 100%;
     margin: 0 auto;
     margin-top: 30px;
     border-radius: 15px;
     overflow: hidden;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
 }

 .comparison-table th {
     background: #000;
     color: #fff;
     font-weight: 600;
     padding: 15px;
     text-align: center;
 }

 .comparison-table td {
     vertical-align: middle;
     padding: 12px;
     text-align: center;
     transition: background-color 0.3s ease;
 }

 .comparison-table tr:hover td {
     background-color: #f8f9fa;
 }

 .comparison-table .icon {
     font-size: 1.2em;
     margin-right: 5px;
 }

 .comparison-table .text-success {
     color: #28a745;
 }

 .comparison-table .text-danger {
     color: #dc3545;
 }

 .comparison-table .text-warning {
     color: #ffc107;
 }

 .comparison-table .table-title {
     text-align: center;
     margin-bottom: 20px;
     font-size: 1.5em;
     font-weight: bold;
 }

 .comparison-table .table-title {
     text-align: center;
     margin-bottom: 20px;
     font-size: 2em;
     font-weight: 700;
     color: #4E31AD;
     text-transform: uppercase;
     letter-spacing: 2px;
 }

 .comparison-table .highlight {
     background-color: #EAE5FF;
     font-weight: 500;
 }

 .comparison-table .bolder {
     font-weight: bold;
 }

 @media screen and (max-width: 767px) {
     .table-responsive {
         display: block;
         width: 100%;
         overflow-x: auto !important;
         -webkit-overflow-scrolling: touch;
     }

     .comparison-table {
         min-width: 600px;
         /* Adjust based on your columns */
     }

     .comparison-table th,
     .comparison-table td {
         white-space: nowrap;
     }
 }

 .guarantee-box {
     max-width: 35%;
     margin: 0 auto;
     margin-top: 2rem;
     padding: 1rem;
     border: 2px solid #47328C;
     border-radius: 15px;
     box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
     background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
     display: flex;
     align-items: center;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
 }



 .guarantee-box:hover {
     transform: translateY(-5px);
     box-shadow: 0 8px 25px rgba(71, 50, 140, 0.2);
 }

 .guarantee-box .icon {
     font-size: 2.5rem;
     color: #47328C;
     margin-right: 1.5rem;
     flex-shrink: 0;
     width: 70px;
 }

 .guarantee-box .text-content {
     text-align: left;
     flex-grow: 1;
 }

 .guarantee-box .text-content h6 {
     font-size: 1.4rem;
     color: #47328C;
     font-weight: 700;
     margin-bottom: 0.5rem;
 }

 .guarantee-box .text-content p {
     font-size: 1rem;
     color: #555;
     margin-bottom: 0px !important;
 }


 @media (max-width: 767px) {
     .guarantee-box {
         max-width: 80%;
     }


     .guarantee-box .text-content p,
     .guarantee-box .text-content h6 {
         font-size: 0.8rem;
     }

     .guarantee-box .icon {
         width: 45px;
         margin-right: 0.5rem;
     }
 }

 div.price-container {
     margin-bottom: 0px !important;
 }

 p.per_month {
     padding-bottom: 0px !important;
 }