/* Hero */
.ai-tools-page .hero-bg-gradient{ background: linear-gradient(104.64deg, #CD4A8F -0.75%, #9D7FF6 99.44%); padding: 100px 0 450px; position: relative; overflow: hidden; }
.ai-tools-page .hero-bg-gradient .text{ color: var(--white); text-align: center; margin-bottom: 50px; }
.ai-tools-page .hero-bg-gradient .text h1{ margin: 20px auto; color: var(--white); font-weight: 400; font-size: 46px; line-height: 1.2; max-width: 100%; }
.ai-tools-page .hero-bg-gradient .text h1 span{ display: block; font-style: italic; font-weight: 600; }
.ai-tools-page .hero-bg-gradient .text p{ font-size: 19px; max-width: 700px; margin: 0 auto; line-height: 1.5; }
.ai-tools-page .hero-bg-gradient .lottie-animation{ position: absolute;  bottom: -760px; width: 780px; }

/*Retirement Planning*/
.ai-tools-page .retirement-planning{ background: none; padding: 130px 0 50px; }
.ai-tools-page .retirement-planning .top h3{ color: #041835; margin-bottom: 15px; font-size: 32px; font-weight: 600; text-align: center; }
.ai-tools-page .retirement-planning .top .text-wrapper p{ font-size: 17px; line-height: 1.5; color: #041835; text-align: center; max-width: 800px; margin: 0 auto; }

/* Single Feature */
.ai-tools-page .single-feature{ background: var(--white); padding: 20px 0; }
.ai-tools-page .single-feature .content{ background: linear-gradient(90deg, #D64994 0%, #8663EE 100%); padding: 2px; box-shadow: 0 2px 20px 0 #A0BDFF4D; border-radius: 15px; }
.ai-tools-page .single-feature .box-content{ background: var(--white); display: flex; justify-content: space-between; align-items: center; padding: 70px 50px; border-radius: 13px; box-shadow: 0 2px 20px 0 rgba(160, 189, 255, 0.30); width: 100%; }
.ai-tools-page .single-feature.reverse .box-content{ flex-direction: row-reverse; }
.ai-tools-page .single-feature.reverse .left{ max-width: 500px; margin-right: 30px; padding-left: 60px; }
.ai-tools-page .single-feature .left{ max-width: 500px; margin-left: 30px; padding-right: 60px; }
.ai-tools-page .single-feature .left .title{ color: #041835; font-size: 30px; margin-top: 15px; }
.ai-tools-page .single-feature .left .title span{ display: block; }
.ai-tools-page .single-feature .right{ box-shadow: none; transform: none; cursor: default; width: 650px; height: 420px; }
.ai-tools-page .single-feature .right img{ object-fit: contain; }
.ai-tools-page .single-feature .btn{ background: linear-gradient(90deg, #D64994 0%, #8663EE 100%); color: var(--white); border: none; width: 300px; margin-top: 20px; }

/*Recorded Videos*/
.ai-tools-page .recorded-demos{ padding: 100px 0; margin-top: 60px; background-color: #FAFAFA; }
.ai-tools-page .recorded-demos #video{ position: relative; top: -220px; }
.ai-tools-page .recorded-demos .content{ display:flex; flex-direction:column; align-items:center; }
.ai-tools-page .recorded-demos .title-tag{ background: linear-gradient(90deg, #D64994 0%, #8663EE 100%); text-clip: text; -webkit-background-clip: text; color: transparent; -webkit-text-fill-color: transparent; font-weight:600; font-size:18px; text-align:center; text-transform:uppercase; display:block; padding-bottom:15px; }
.ai-tools-page .recorded-demos .title{ font-size: 36px; text-align:center; color:#041835; padding-bottom:15px; }
.ai-tools-page .recorded-demos p{ font-size:20px; text-align:center; max-width:800px; }
.ai-tools-page .recorded-demos .single-video-demo{ margin-top:30px; display:flex; justify-content:center; position:relative; transition:all 0.3s; }
.ai-tools-page .recorded-demos .single-video-demo iframe{ width:620px; height:345px; border-radius:16px; overflow:hidden; box-shadow:0 4px 8px 0 rgba(18,31,49,0.2); margin-bottom:15px; position:relative; transition:all 0.3s; transform:scale(1); cursor:not-allowed; }
.ai-tools-page .recorded-demos .single-video-demo img{ height:100%; width:100%; object-fit:fill; position:absolute; top:0; left:0; z-index:10; border-radius:8px; cursor:pointer; transition:all 0.3s; }
.ai-tools-page .recorded-demos .single-video-demo:hover img{ transform:scale(1.1); }
.ai-tools-page .recorded-demos .single-video-demo .hide{ display:none; }

/*Planning*/
.ai-tools-page .text-with-img-section{ background: none; padding: 90px 0 0; }
.ai-tools-page .text-with-img-section .top h3{ color: #041835; margin-bottom: 15px; font-size: 32px; font-weight: 600; }
.ai-tools-page .text-with-img-section .top h3 span{ display: block; }

.ai-tools-page .list-of-features { position: relative; z-index: 10; padding: 20px 0 70px; }
.ai-tools-page .list-of-features .content {}
.ai-tools-page .list-of-features ul { display: flex; align-items: stretch; justify-content: center; gap: 20px; flex-wrap: wrap; margin-bottom: 40px; }
.ai-tools-page .list-of-features ul li { width: calc(33.3333% - 20px); display: flex; background-color: var(--white); border-radius: 16px; border: 2px solid #E5ECF6; box-shadow: 0 2px 20px 0 rgba(160, 189, 255, 0.30); padding: 35px 30px; }
.ai-tools-page .list-of-features ul li figure { min-width: 70px; position: relative; }
.ai-tools-page .list-of-features ul li figure img { max-width: 120px; max-height: 80px; }
.ai-tools-page .list-of-features ul li p { font-size: 20px; font-weight: 600; text-align: left; margin-bottom: 24px; }
.ai-tools-page .list-of-features ul li span { color: #717983; font-size: 15px; text-align: left; max-width: 260px; }

/* Prefooter */
.ai-tools-page .pre-footer{ background: linear-gradient(92.31deg, #D64994 -7.38%, #8663EE 104.45%); position: relative; padding: 55px 20px; }
.ai-tools-page .pre-footer:before{ content: ""; display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: url("../img/ai/bg-footer.svg"); background-repeat: no-repeat; background-size: cover; }
.ai-tools-page .pre-footer h3,
.ai-tools-page .pre-footer a{ position: relative; z-index: 1; }
.ai-tools-page .pre-footer h3 span{ display: block; }
.ai-tools-page .pre-footer a{ background: var(--white); border-color: var(--white); }
.ai-tools-page .pre-footer a span{ background: linear-gradient(90deg, #D64994 0%, #8663EE 100%); text-clip: text; -webkit-background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.ai-tools-page .pre-footer a:hover span{ color: var(--white); background: transparent; text-clip: none; -webkit-background-clip: none; -webkit-text-fill-color: initial; }

@media screen and (max-width: 1280px){

    /* Hero */
    .ai-tools-page .hero-bg-gradient .text h1{ font-size: 42px; }
    .ai-tools-page .hero-bg-gradient .text p{ font-size: 18px; }

    /* Features */
    .ai-tools-page .list-of-features{ padding: 20px 20px 100px; }

    /* Single Feature */
    .ai-tools-page .single-feature{ padding: 20px; }
    .ai-tools-page .single-feature .left{ max-width: 450px; }
    .ai-tools-page .single-feature .left .title{ font-size: 32px; }
    .ai-tools-page .single-feature .left .text-content{ font-size: 15px; }
    .ai-tools-page .single-feature .right{ width: 500px; height: 315px; }
    .ai-tools-page .single-feature .right:hover{ transform: none; }

    /* Flexible Planning */
    .ai-tools-page .list-of-features ul li p{ font-size: 20px; }
    .ai-tools-page .list-of-features ul li span{ font-size: 17px; }
    
    .ai-tools-page .text-with-img-section{ padding: 70px 20px 0; }
    .ai-tools-page .text-with-img-section .top h3{ font-size: 32px; text-align: center; }
    .ai-tools-page .text-with-img-section .top .text-wrapper p{ font-size: 16px; }

}

@media screen and (max-width: 1024px){

    /* Hero */
    .ai-tools-page .hero-bg-gradient .text{ padding: 0 20px; }
    .ai-tools-page .hero-bg-gradient .text h1{ font-size: 38px; }
    .ai-tools-page .hero-bg-gradient .text h1 span{ display: inline;}
    .ai-tools-page .hero-bg-gradient .text p{ font-size: 16px; }
    .ai-tools-page .hero-bg-gradient .lottie-animation { bottom: -670px; width: 680px; }

    /* Single Feature */
    .ai-tools-page .single-feature .left{ max-width: 100%; margin-top: 30px; margin-left: 0; padding-right: 0; margin-bottom: 0; }
    .ai-tools-page .single-feature .left .title{ font-size: 28px; }
    .ai-tools-page .single-feature .left .title span{ display: inline; }
    .ai-tools-page .single-feature .left .text-content{ font-size: 14px; }
    .ai-tools-page .single-feature .right{ width: 100%; height: auto; padding-top: 65%; position: relative; }
    .ai-tools-page .single-feature .right iframe{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
    
    .ai-tools-page .single-feature .box-content{ padding: 30px; }
    .ai-tools-page .single-feature .box-content,
    .ai-tools-page .single-feature.reverse .box-content{ flex-direction: column-reverse; }
    .ai-tools-page .single-feature.reverse .left{ max-width: 100%; margin: 0; padding: 0; margin-top: 30px; }
    .ai-tools-page .single-feature .btn{ width: 100%; }

    /* Prefooter */
    .ai-tools-page .pre-footer h3 span{ display: inline; }

    /* Flexible Planning */
    .ai-tools-page .list-of-features{ padding: 20px 20px 60px; }
    .ai-tools-page .list-of-features ul{ flex-direction: column; }
    .ai-tools-page .list-of-features ul li{ width: 100%; flex-direction: column; }
    .ai-tools-page .list-of-features ul li p{ font-size: 19px; }
    .ai-tools-page .list-of-features ul li span{ font-size: 16px; }

    .ai-tools-page .text-with-img-section .top h3{ font-size: 28px; }
    .ai-tools-page .text-with-img-section .top h3 span{ display: inline; }
    .ai-tools-page .text-with-img-section .top .text-wrapper p{ font-size: 15px; }

    /*Recorded Videos*/
    .ai-tools-page .recorded-demos #video{ position: relative; top: -180px; }
    .ai-tools-page .recorded-demos{ padding: 30px 40px; }
    .ai-tools-page .recorded-demos .title-tag { font-size: 14px; }
    .ai-tools-page .recorded-demos .title { font-size: 24px; max-width: 90%; }
    .ai-tools-page .recorded-demos .videos { margin-top: 0; }
    .ai-tools-page .recorded-demos p{ font-size: 16px; }
    .ai-tools-page .recorded-demos .single-video-demo{ position: relative; width: 100%; padding-top: 60%; }
    .ai-tools-page .recorded-demos .single-video-demo:hover img{ transform: none; }
    .ai-tools-page .recorded-demos .single-video-demo img{ width: 100%; height: 100%; object-fit: contain; position: absolute; top: 0; left: 0; }
    .ai-tools-page .recorded-demos .single-video-demo iframe{ width: 98%; height: 98%; position: absolute; top: 1%; left: 1%; }

    /* Retirement Planning */
    .ai-tools-page .retirement-planning{ padding: 90px 20px 30px; }
    .ai-tools-page .retirement-planning .top h3{ font-size: 28px; }
    .ai-tools-page .retirement-planning .top .text-wrapper p{ font-size: 15px; max-width: 100%; }

}

@media screen and (max-width: 768px){

    /* Hero */
    .ai-tools-page .hero-bg-gradient{ padding: 80px 0 310px; }
    .ai-tools-page .hero-bg-gradient .text h1{ font-size: 32px; }
    .ai-tools-page .hero-bg-gradient .text p{ font-size: 16px; }
    .ai-tools-page .hero-bg-gradient .lottie-animation { bottom: -560px; width: 600px; }

}


@media screen and (max-width: 540px){

    
}