.elementor-62 .elementor-element.elementor-element-14e396b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-7f46a89{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-ce4a92e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-5ac64ad{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-b5cca7d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-3b84116{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-1eb02cc{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-c7aae73{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-8046de1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-25e4a4d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-ab9e0d6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-aaa2a34{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-d7edbac{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-62 .elementor-element.elementor-element-28205aa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for container, class: .elementor-element-14e396b *//*==================================================
SECTION 01 - HERO
PART A
==================================================*/

.jc-hero{

    position:relative;
    overflow:hidden;

    padding:140px 0 120px;

    background:
    linear-gradient(180deg,#111827 0%,#172235 100%);

}


/*==========================
CONTAINER
==========================*/

.jc-hero .jc-container{

    position:relative;
    z-index:5;

}


/*==========================
BACKGROUND GRID
==========================*/

.jc-hero::before{

    content:"";

    position:absolute;
    inset:0;

    background-image:

    linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),

    linear-gradient(
    90deg,
    rgba(255,255,255,.02) 1px,
    transparent 1px);

    background-size:70px 70px;

    mask-image:linear-gradient(

    to bottom,

    transparent,

    rgba(0,0,0,.9),

    transparent

    );

    pointer-events:none;

}


/*==========================
BACKGROUND GLOW
==========================*/

.jc-bg-circle{

    position:absolute;

    border-radius:50%;

    filter:blur(120px);

    pointer-events:none;

}

.jc-bg-circle.one{

    width:520px;
    height:520px;

    top:-220px;
    right:-180px;

    background:rgba(255,107,0,.12);

}

.jc-bg-circle.two{

    width:420px;
    height:420px;

    left:-180px;
    bottom:-180px;

    background:rgba(255,107,0,.08);

}

.jc-bg-circle.three{

    width:300px;
    height:300px;

    right:18%;
    bottom:10%;

    background:rgba(255,255,255,.03);

}


/*==========================
BADGE
==========================*/

.jc-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 24px;

    margin-bottom:35px;

    border-radius:100px;

    background:rgba(255,107,0,.10);

    border:1px solid rgba(255,107,0,.35);

    color:var(--primary);

    font-size:14px;

    font-weight:700;

    letter-spacing:.5px;

    backdrop-filter:blur(15px);

}


/*==========================
TITLE
==========================*/

.jc-title{

    max-width:1000px;

    font-size:64px;

    font-weight:800;

    line-height:1.08;

    letter-spacing:-2px;

    margin-bottom:35px;

}

.jc-title span{

    color:var(--primary);

}

.jc-title strong{

    display:block;

    margin-top:10px;

    font-weight:800;

    color:#fff;

}


/*==========================
SUBTITLE
==========================*/

.jc-subtitle{

    max-width:760px;

    font-size:22px;

    line-height:1.8;

    color:#D1D5DB;

    margin-bottom:70px;

}


/*==========================
ENTRANCE
==========================*/

.jc-badge{

    animation:fadeUp .6s ease forwards;

}

.jc-title{

    animation:fadeUp .7s ease forwards;

}

.jc-subtitle{

    animation:fadeUp .9s ease forwards;

}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:none;

    }

}


/*==========================
RESPONSIVE
==========================*/

@media(max-width:1100px){

.jc-title{

font-size:54px;

}

}

@media(max-width:768px){

.jc-hero{

padding:90px 0;

}

.jc-title{

font-size:38px;

line-height:1.2;

letter-spacing:-1px;

}

.jc-subtitle{

font-size:18px;

margin-bottom:50px;

}

.jc-badge{

font-size:13px;

padding:10px 18px;

}

.jc-bg-circle{

display:none;

}

}
/*==================================================
SECTION 01 - HERO
PART B
Progress + Feature Cards
==================================================*/


/*==================================
PROGRESS BAR
==================================*/

.jc-progress{

display:flex;
align-items:center;
justify-content:center;

margin:70px auto 90px;

max-width:1000px;

}

.jc-line{

flex:1;

height:3px;

margin:0 20px;

background:rgba(255,255,255,.08);

border-radius:100px;

position:relative;

overflow:hidden;

}

.jc-line::before{

content:"";

position:absolute;

left:0;
top:0;

width:40%;
height:100%;

background:linear-gradient(
90deg,
var(--primary),
#ffb56d);

border-radius:100px;

}


/*==================================
STEP
==================================*/

.jc-step{

display:flex;

flex-direction:column;

align-items:center;

gap:14px;

min-width:90px;

}

.jc-step span{

width:58px;
height:58px;

display:flex;

align-items:center;
justify-content:center;

border-radius:50%;

background:#1c2638;

border:2px solid rgba(255,255,255,.08);

font-size:20px;

font-weight:700;

transition:.35s;

}

.jc-step.active span{

background:linear-gradient(
135deg,
var(--primary),
#ff923f);

border:none;

box-shadow:
0 0 30px rgba(255,107,0,.35);

}

.jc-step small{

font-size:14px;

font-weight:600;

color:#d4d4d4;

}


/*==================================
FEATURE GRID
==================================*/

.jc-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}


/*==================================
CARD
==================================*/

.jc-card{

position:relative;

padding:40px 35px;

border-radius:30px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(20px);

overflow:hidden;

transition:.35s;

box-shadow:
0 20px 60px rgba(0,0,0,.30);

}


/*==================================
CARD HOVER
==================================*/

.jc-card:hover{

transform:translateY(-12px);

border-color:rgba(255,107,0,.35);

box-shadow:
0 35px 80px rgba(0,0,0,.45);

}


/*==================================
TOP BORDER
==================================*/

.jc-card::before{

content:"";

position:absolute;

left:0;
top:0;

width:100%;
height:4px;

background:linear-gradient(
90deg,
var(--primary),
#ffb56d);

transform:scaleX(0);

transform-origin:left;

transition:.4s;

}

.jc-card:hover::before{

transform:scaleX(1);

}


/*==================================
SHINE
==================================*/

.jc-card::after{

content:"";

position:absolute;

top:-120%;
left:-80%;

width:45%;
height:260%;

background:linear-gradient(
90deg,

transparent,

rgba(255,255,255,.12),

transparent);

transform:rotate(25deg);

transition:1s;

}

.jc-card:hover::after{

left:160%;

}


/*==================================
ICON
==================================*/

.jc-icon{

width:74px;
height:74px;

display:flex;

align-items:center;
justify-content:center;

margin-bottom:24px;

border-radius:20px;

font-size:34px;

background:linear-gradient(
135deg,
rgba(255,107,0,.18),
rgba(255,107,0,.05));

border:1px solid rgba(255,107,0,.30);

transition:.35s;

}

.jc-card:hover .jc-icon{

transform:rotate(-8deg) scale(1.08);

box-shadow:
0 20px 40px rgba(255,107,0,.18);

}


/*==================================
CARD TEXT
==================================*/

.jc-card h3{

font-size:26px;

margin-bottom:18px;

transition:.35s;

}

.jc-card:hover h3{

color:var(--primary);

}

.jc-card p{

font-size:16px;

line-height:1.8;

color:#D1D5DB;

}


/*==================================
FLOAT
==================================*/

.jc-card:nth-child(1){

animation:floatCard 7s ease-in-out infinite;

}

.jc-card:nth-child(2){

animation:floatCard 7s ease-in-out infinite .4s;

}

.jc-card:nth-child(3){

animation:floatCard 7s ease-in-out infinite .8s;

}

@keyframes floatCard{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-progress{

display:none;

}

.jc-grid{

grid-template-columns:1fr;

gap:25px;

}

}

@media(max-width:767px){

.jc-card{

padding:30px;

}

.jc-card h3{

font-size:22px;

}

.jc-icon{

width:65px;
height:65px;

font-size:30px;

}

}
/*==================================================
SECTION 01 - HERO
PART C
Mission • Stats • Scroll
==================================================*/


/*==================================
MISSION PANEL
==================================*/

.jc-highlight{

position:relative;

display:grid;

grid-template-columns:1.35fr .8fr;

gap:50px;

align-items:center;

margin-top:100px;

padding:60px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

border-radius:32px;

backdrop-filter:blur(20px);

overflow:hidden;

box-shadow:
0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-highlight::before{

content:"";

position:absolute;

right:-180px;

top:-180px;

width:380px;

height:380px;

border-radius:50%;

background:
radial-gradient(circle,
rgba(255,107,0,.16),
transparent);

filter:blur(80px);

pointer-events:none;

}

.jc-highlight>*{

position:relative;

z-index:2;

}


/*==================================
LEFT CONTENT
==================================*/

.jc-highlight-left h2{

font-size:42px;

margin-bottom:25px;

}

.jc-highlight-left p{

font-size:18px;

line-height:1.9;

max-width:650px;

}


/*==================================
RIGHT GRID
==================================*/

.jc-highlight-right{

display:grid;

gap:20px;

}


/*==================================
STAT CARD
==================================*/

.jc-stat{

position:relative;

padding:28px;

border-radius:22px;

background:rgba(255,255,255,.05);

border:1px solid rgba(255,255,255,.08);

text-align:center;

overflow:hidden;

transition:.35s;

}

.jc-stat:hover{

transform:translateY(-8px);

border-color:rgba(255,107,0,.35);

box-shadow:
0 25px 60px rgba(0,0,0,.35);

}


/*==================================
TOP BORDER
==================================*/

.jc-stat::before{

content:"";

position:absolute;

left:0;

top:0;

width:100%;

height:4px;

background:
linear-gradient(
90deg,
var(--primary),
#ffb56d);

transform:scaleX(0);

transform-origin:left;

transition:.4s;

}

.jc-stat:hover::before{

transform:scaleX(1);

}


/*==================================
NUMBER
==================================*/

.jc-stat h2{

font-size:58px;

font-weight:800;

line-height:1;

margin-bottom:10px;

color:var(--primary);

}

.jc-stat span{

display:block;

font-size:15px;

color:#d8d8d8;

line-height:1.6;

}


/*==================================
SCROLL INDICATOR
==================================*/

.jc-scroll{

display:flex;

flex-direction:column;

align-items:center;

justify-content:center;

gap:18px;

margin-top:90px;

}

.jc-scroll span{

font-size:13px;

font-weight:600;

letter-spacing:3px;

text-transform:uppercase;

color:#9CA3AF;

}


/*==================================
MOUSE
==================================*/

.jc-mouse{

width:34px;

height:56px;

display:flex;

justify-content:center;

padding-top:8px;

border-radius:30px;

border:2px solid rgba(255,255,255,.20);

}

.jc-wheel{

width:5px;

height:11px;

border-radius:50px;

background:var(--primary);

animation:wheelMove 1.8s infinite;

}


/*==================================
ANIMATION
==================================*/

@keyframes wheelMove{

0%{

opacity:1;

transform:translateY(0);

}

100%{

opacity:0;

transform:translateY(20px);

}

}


/*==================================
HOVER GLOW
==================================*/

.jc-stat:hover{

background:
linear-gradient(
180deg,
rgba(255,107,0,.08),
rgba(255,255,255,.05));

}


/*==================================
FADE IN
==================================*/

.jc-highlight{

animation:fadeMission .8s ease forwards;

}

@keyframes fadeMission{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:none;

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-highlight{

grid-template-columns:1fr;

padding:45px;

gap:40px;

}

.jc-highlight-left{

text-align:center;

}

.jc-highlight-left p{

margin:auto;

}

}


@media(max-width:767px){

.jc-highlight{

padding:30px;

margin-top:70px;

}

.jc-highlight-left h2{

font-size:32px;

}

.jc-highlight-left p{

font-size:16px;

}

.jc-stat{

padding:24px;

}

.jc-stat h2{

font-size:44px;

}

.jc-scroll{

margin-top:60px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-53a07c8 *//*==================================================
SECTION 02
PART A
Roadmap
==================================================*/

.jc-program{

    position:relative;

    padding:130px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#131C2C 0%,#101827 100%);

}


/*==============================
BACKGROUND
==============================*/

.jc-program::before{

    content:"";

    position:absolute;

    top:-250px;
    right:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.10),
    transparent);

    filter:blur(120px);

}

.jc-program::after{

    content:"";

    position:absolute;

    left:-200px;
    bottom:-200px;

    width:450px;
    height:450px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(130px);

}


/*==============================
ROADMAP GRID
==============================*/

.jc-roadmap{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:28px;

    margin-top:80px;

}


/*==============================
CARD
==============================*/

.jc-roadmap-card{

    position:relative;

    padding:40px 30px;

    border-radius:28px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    overflow:hidden;

    transition:.35s;

    box-shadow:
    0 20px 50px rgba(0,0,0,.30);

}

.jc-roadmap-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    box-shadow:
    0 30px 80px rgba(0,0,0,.45);

}


/*==============================
TOP BAR
==============================*/

.jc-roadmap-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-roadmap-card:hover::before{

    transform:scaleX(1);

}


/*==============================
NUMBER
==============================*/

.jc-road-number{

    width:72px;
    height:72px;

    display:flex;

    align-items:center;
    justify-content:center;

    margin-bottom:25px;

    border-radius:20px;

    font-size:28px;

    font-weight:800;

    color:var(--primary);

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.35);

}


/*==============================
TEXT
==============================*/

.jc-roadmap-card h3{

    margin-bottom:18px;

    font-size:24px;

    transition:.35s;

}

.jc-roadmap-card:hover h3{

    color:var(--primary);

}

.jc-roadmap-card p{

    font-size:16px;

    line-height:1.8;

}


/*==============================
FLOAT
==============================*/

.jc-roadmap-card:nth-child(1){

animation:roadFloat 7s ease infinite;

}

.jc-roadmap-card:nth-child(2){

animation:roadFloat 7s ease infinite .3s;

}

.jc-roadmap-card:nth-child(3){

animation:roadFloat 7s ease infinite .6s;

}

.jc-roadmap-card:nth-child(4){

animation:roadFloat 7s ease infinite .9s;

}

@keyframes roadFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}


/*==============================
RESPONSIVE
==============================*/

@media(max-width:1100px){

.jc-roadmap{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:767px){

.jc-program{

padding:90px 0;

}

.jc-roadmap{

grid-template-columns:1fr;

gap:22px;

margin-top:50px;

}

.jc-roadmap-card{

padding:30px;

}

}
/*==================================================
SECTION 02
PART B
Program Highlight
==================================================*/


/*==================================
PROGRAM HIGHLIGHT
==================================*/

.jc-program-highlight{

position:relative;

display:grid;

grid-template-columns:1.3fr .8fr;

gap:60px;

align-items:center;

margin-top:100px;

padding:60px;

border-radius:32px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(20px);

overflow:hidden;

box-shadow:
0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-program-highlight::before{

content:"";

position:absolute;

right:-150px;
top:-150px;

width:350px;
height:350px;

border-radius:50%;

background:
radial-gradient(circle,
rgba(255,107,0,.15),
transparent);

filter:blur(80px);

}

.jc-program-highlight>*{

position:relative;

z-index:2;

}


/*==================================
LEFT
==================================*/

.jc-program-left h3{

font-size:40px;

line-height:1.2;

margin-bottom:24px;

}

.jc-program-left p{

font-size:18px;

line-height:1.9;

margin-bottom:22px;

color:#D1D5DB;

}

.jc-program-left p:last-child{

margin-bottom:0;

}


/*==================================
RIGHT
==================================*/

.jc-program-right{

display:flex;

justify-content:center;

align-items:center;

}


/*==================================
FLOW
==================================*/

.jc-growth-flow{

width:100%;

display:flex;

flex-direction:column;

gap:18px;

}


/*==================================
FLOW BOX
==================================*/

.jc-growth-box{

display:flex;

align-items:center;

gap:18px;

padding:22px 24px;

border-radius:18px;

background:rgba(255,255,255,.05);

border:1px solid rgba(255,255,255,.08);

font-size:18px;

font-weight:600;

transition:.35s;

position:relative;

overflow:hidden;

}


/*==================================
SHINE
==================================*/

.jc-growth-box::before{

content:"";

position:absolute;

left:-120%;

top:0;

width:45%;

height:100%;

background:

linear-gradient(

90deg,

transparent,

rgba(255,255,255,.10),

transparent);

transform:skewX(-20deg);

transition:.8s;

}

.jc-growth-box:hover::before{

left:160%;

}


/*==================================
HOVER
==================================*/

.jc-growth-box:hover{

transform:translateX(10px);

background:

linear-gradient(

135deg,

rgba(255,107,0,.08),

rgba(255,255,255,.05)

);

border-color:rgba(255,107,0,.35);

box-shadow:

0 20px 40px rgba(255,107,0,.10);

}


/*==================================
TEXT
==================================*/

.jc-growth-box span{

font-size:17px;

font-weight:600;

color:#fff;

}


/*==================================
ARROW
==================================*/

.jc-arrow{

display:flex;

justify-content:center;

align-items:center;

font-size:30px;

font-weight:700;

color:var(--primary);

animation:jcArrow 2s infinite;

}

@keyframes jcArrow{

0%{

transform:translateY(0);

opacity:1;

}

50%{

transform:translateY(8px);

}

100%{

transform:translateY(0);

opacity:1;

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:1100px){

.jc-program-highlight{

grid-template-columns:1fr;

gap:40px;

}

}

@media(max-width:767px){

.jc-program-highlight{

padding:35px 25px;

margin-top:70px;

}

.jc-program-left{

text-align:center;

}

.jc-program-left h3{

font-size:30px;

}

.jc-program-left p{

font-size:16px;

}

.jc-growth-box{

padding:18px;

font-size:16px;

}

.jc-growth-box span{

font-size:16px;

}

}
/*==================================================
SECTION 02
PART C
Goal Banner
==================================================*/


/*==================================
GOAL BANNER
==================================*/

.jc-goal-banner{

    position:relative;

    display:grid;

    grid-template-columns:1fr 260px;

    align-items:center;

    gap:60px;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.18);

    backdrop-filter:blur(18px);

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-goal-banner::before{

    content:"";

    position:absolute;

    left:-180px;

    bottom:-180px;

    width:380px;

    height:380px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.14),
    transparent);

    filter:blur(90px);

}

.jc-goal-banner>*{

    position:relative;

    z-index:2;

}


/*==================================
LEFT CONTENT
==================================*/

.jc-goal-banner h3{

    font-size:18px;

    letter-spacing:2px;

    text-transform:uppercase;

    color:var(--primary);

    margin-bottom:20px;

}

.jc-goal-banner p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

    max-width:700px;

}


/*==================================
GOAL CIRCLE
==================================*/

.jc-goal-stat{

    width:220px;

    height:220px;

    margin:auto;

    border-radius:50%;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    background:

    radial-gradient(circle,

    rgba(255,107,0,.20),

    rgba(255,107,0,.04));

    border:2px solid rgba(255,107,0,.30);

    transition:.4s;

    position:relative;

}


/*==================================
PULSE RING
==================================*/

.jc-goal-stat::before{

    content:"";

    position:absolute;

    inset:-12px;

    border-radius:50%;

    border:1px solid rgba(255,107,0,.18);

    animation:goalPulse 3s infinite;

}

@keyframes goalPulse{

0%{

transform:scale(.95);

opacity:.8;

}

70%{

transform:scale(1.08);

opacity:0;

}

100%{

transform:scale(1.08);

opacity:0;

}

}


/*==================================
NUMBER
==================================*/

.jc-goal-stat h2{

    font-size:70px;

    line-height:1;

    margin-bottom:10px;

    color:var(--primary);

    font-weight:800;

}

.jc-goal-stat span{

    font-size:15px;

    color:#d9d9d9;

    line-height:1.6;

    max-width:120px;

}


/*==================================
HOVER
==================================*/

.jc-goal-stat:hover{

    transform:scale(1.05);

    box-shadow:

    0 0 60px rgba(255,107,0,.22);

}


/*==================================
ENTRANCE
==================================*/

.jc-goal-banner{

    animation:goalFade .8s ease forwards;

}

@keyframes goalFade{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:none;

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:1100px){

.jc-goal-banner{

grid-template-columns:1fr;

text-align:center;

gap:45px;

}

}


@media(max-width:767px){

.jc-goal-banner{

padding:35px 25px;

margin-top:70px;

}

.jc-goal-banner h3{

font-size:16px;

}

.jc-goal-banner p{

font-size:16px;

}

.jc-goal-stat{

width:180px;

height:180px;

}

.jc-goal-stat h2{

font-size:52px;

}

.jc-goal-stat span{

font-size:14px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-cd3d1b2 *//*==================================================
SECTION 03
PART A
Timeline Layout
==================================================*/

.jc-timeline{

    position:relative;

    padding:130px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#101827 0%,#162235 100%);

}


/*==============================
BACKGROUND
==============================*/

.jc-timeline::before{

    content:"";

    position:absolute;

    top:-220px;
    right:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.08),
    transparent);

    filter:blur(120px);

}

.jc-timeline::after{

    content:"";

    position:absolute;

    bottom:-220px;
    left:-180px;

    width:450px;
    height:450px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(130px);

}


/*==============================
TIMELINE WRAPPER
==============================*/

.jc-timeline-wrapper{

    position:relative;

    display:grid;

    grid-template-columns:repeat(6,1fr);

    gap:25px;

    margin-top:90px;

    align-items:start;

}


/*==============================
TIMELINE LINE
==============================*/

.jc-timeline-line{

    position:absolute;

    left:6%;

    right:6%;

    top:95px;

    height:4px;

    border-radius:100px;

    background:
    linear-gradient(
    90deg,
    rgba(255,107,0,.20),
    var(--primary),
    rgba(255,107,0,.20));

    z-index:1;

}


/*==============================
TIMELINE CARD
==============================*/

.jc-time-card{

    position:relative;

    z-index:5;

    padding:35px 25px;

    border-radius:28px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    transition:.35s;

    overflow:hidden;

    box-shadow:
    0 20px 60px rgba(0,0,0,.28);

}


/*==============================
TOP BAR
==============================*/

.jc-time-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-time-card:hover::before{

    transform:scaleX(1);

}


/*==============================
CONNECTOR DOT
==============================*/

.jc-time-card::after{

    content:"";

    position:absolute;

    top:-16px;

    left:50%;

    transform:translateX(-50%);

    width:22px;

    height:22px;

    border-radius:50%;

    background:var(--primary);

    border:5px solid #101827;

    box-shadow:
    0 0 25px rgba(255,107,0,.45);

}


/*==============================
HOVER
==============================*/

.jc-time-card:hover{

    transform:translateY(-12px);

    border-color:rgba(255,107,0,.35);

    box-shadow:
    0 35px 90px rgba(0,0,0,.40);

}


/*==============================
FLOAT
==============================*/

.jc-time-card:nth-child(2){

animation:timeFloat 7s ease infinite;

}

.jc-time-card:nth-child(3){

animation:timeFloat 7s ease infinite .3s;

}

.jc-time-card:nth-child(4){

animation:timeFloat 7s ease infinite .6s;

}

.jc-time-card:nth-child(5){

animation:timeFloat 7s ease infinite .9s;

}

.jc-time-card:nth-child(6){

animation:timeFloat 7s ease infinite 1.2s;

}

.jc-time-card:nth-child(7){

animation:timeFloat 7s ease infinite 1.5s;

}

@keyframes timeFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}


/*==============================
RESPONSIVE
==============================*/

@media(max-width:1200px){

.jc-timeline-wrapper{

grid-template-columns:repeat(3,1fr);

}

.jc-timeline-line{

display:none;

}

}

@media(max-width:767px){

.jc-timeline{

padding:90px 0;

}

.jc-timeline-wrapper{

grid-template-columns:1fr;

gap:25px;

margin-top:50px;

}

.jc-time-card{

padding:30px;

}

.jc-time-card::after{

display:none;

}

}
/*==================================================
SECTION 03
PART B
Timeline Content
==================================================*/


/*==============================
ICON
==============================*/

.jc-time-icon{

    width:72px;
    height:72px;

    display:flex;

    align-items:center;
    justify-content:center;

    margin-bottom:25px;

    border-radius:20px;

    font-size:34px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.35);

    transition:all .35s ease;

}

.jc-time-card:hover .jc-time-icon{

    transform:rotate(-8deg) scale(1.08);

    box-shadow:
    0 20px 40px rgba(255,107,0,.20);

}


/*==============================
DAY BADGE
==============================*/

.jc-time-day{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:9px 18px;

    margin-bottom:22px;

    border-radius:100px;

    background:rgba(255,107,0,.10);

    border:1px solid rgba(255,107,0,.30);

    color:var(--primary);

    font-size:13px;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

}


/*==============================
TITLE
==============================*/

.jc-time-card h3{

    font-size:24px;

    line-height:1.3;

    margin-bottom:18px;

    transition:.35s;

}

.jc-time-card:hover h3{

    color:var(--primary);

}


/*==============================
DESCRIPTION
==============================*/

.jc-time-card p{

    font-size:16px;

    line-height:1.8;

    color:#D1D5DB;

}


/*==============================
SHINE EFFECT
==============================*/

.jc-time-card{

    overflow:hidden;

}

.jc-time-card span,
.jc-time-card h3,
.jc-time-card p,
.jc-time-card .jc-time-icon{

    position:relative;

    z-index:3;

}

.jc-time-card .shine{

display:none;

}

.jc-time-card::selection{

background:transparent;

}

.jc-time-card:before{

z-index:4;

}

.jc-time-card:after{

z-index:2;

}

.jc-time-card{

position:relative;

}

.jc-time-card .dummy{

display:none;

}

.jc-time-card>.dummy{

display:none;

}

.jc-time-card::marker{

display:none;

}

.jc-time-card{

isolation:isolate;

}

.jc-time-card::after{

content:"";

position:absolute;

top:-120%;

left:-70%;

width:45%;

height:260%;

background:

linear-gradient(

90deg,

transparent,

rgba(255,255,255,.10),

transparent

);

transform:rotate(25deg);

transition:1s;

pointer-events:none;

}

.jc-time-card:hover::after{

left:160%;

}


/*==============================
SUBTLE GLOW
==============================*/

.jc-time-card:hover{

background:

linear-gradient(

180deg,

rgba(255,107,0,.06),

rgba(255,255,255,.04)

);

}


/*==============================
STAGGER DELAY
==============================*/

.jc-time-card:nth-child(2){

transition-delay:.05s;

}

.jc-time-card:nth-child(3){

transition-delay:.10s;

}

.jc-time-card:nth-child(4){

transition-delay:.15s;

}

.jc-time-card:nth-child(5){

transition-delay:.20s;

}

.jc-time-card:nth-child(6){

transition-delay:.25s;

}

.jc-time-card:nth-child(7){

transition-delay:.30s;

}


/*==============================
RESPONSIVE
==============================*/

@media(max-width:767px){

.jc-time-icon{

width:65px;
height:65px;

font-size:30px;

margin-bottom:20px;

}

.jc-time-day{

font-size:12px;

padding:8px 16px;

}

.jc-time-card h3{

font-size:22px;

}

.jc-time-card p{

font-size:15px;

}

}
/*==================================================
SECTION 03
PART C
Road Summary
==================================================*/


/*==================================
SUMMARY GRID
==================================*/

.jc-road-summary{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:35px;

    margin-top:90px;

}


/*==================================
SUMMARY CARD
==================================*/

.jc-summary-card{

    position:relative;

    overflow:hidden;

    padding:45px;

    border-radius:30px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    transition:all .35s ease;

    box-shadow:
    0 20px 60px rgba(0,0,0,.28);

}


/*==================================
TOP BORDER
==================================*/

.jc-summary-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}


/*==================================
GLOW
==================================*/

.jc-summary-card::after{

    content:"";

    position:absolute;

    right:-120px;
    bottom:-120px;

    width:250px;
    height:250px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.12),
    transparent);

    filter:blur(70px);

    opacity:0;

    transition:.4s;

}


/*==================================
HOVER
==================================*/

.jc-summary-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:

    linear-gradient(

    180deg,

    rgba(255,107,0,.06),

    rgba(255,255,255,.04)

    );

    box-shadow:

    0 35px 80px rgba(0,0,0,.40);

}

.jc-summary-card:hover::before{

    transform:scaleX(1);

}

.jc-summary-card:hover::after{

    opacity:1;

}


/*==================================
TITLE
==================================*/

.jc-summary-card h3{

    font-size:28px;

    margin-bottom:20px;

    line-height:1.3;

    transition:.35s;

}

.jc-summary-card:hover h3{

    color:var(--primary);

}


/*==================================
TEXT
==================================*/

.jc-summary-card p{

    font-size:17px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
ENTRANCE
==================================*/

.jc-summary-card{

    animation:summaryFade .8s ease both;

}

.jc-summary-card:nth-child(2){

    animation-delay:.2s;

}

@keyframes summaryFade{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:none;

    }

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-road-summary{

grid-template-columns:1fr;

}

}

@media(max-width:767px){

.jc-road-summary{

gap:25px;

margin-top:60px;

}

.jc-summary-card{

padding:30px;

}

.jc-summary-card h3{

font-size:22px;

}

.jc-summary-card p{

font-size:16px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-57ba078 *//*==================================================
SECTION 04
PART A
Launch Flow
==================================================*/

.jc-launch{

    position:relative;

    padding:130px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#162235 0%,#101827 100%);

}


/*==============================
BACKGROUND
==============================*/

.jc-launch::before{

content:"";

position:absolute;

top:-220px;
left:-180px;

width:520px;
height:520px;

border-radius:50%;

background:
radial-gradient(circle,
rgba(255,107,0,.08),
transparent);

filter:blur(120px);

}

.jc-launch::after{

content:"";

position:absolute;

right:-180px;
bottom:-220px;

width:450px;
height:450px;

border-radius:50%;

background:
radial-gradient(circle,
rgba(255,255,255,.03),
transparent);

filter:blur(130px);

}


/*==============================
GRID
==============================*/

.jc-launch-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

margin-top:90px;

}


/*==============================
FLOW
==============================*/

.jc-launch-flow{

display:flex;

flex-direction:column;

gap:25px;

}


/*==============================
CARD
==============================*/

.jc-flow-card{

position:relative;

padding:38px;

border-radius:30px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(18px);

overflow:hidden;

transition:.35s;

box-shadow:
0 20px 60px rgba(0,0,0,.30);

}


/*==============================
TOP BAR
==============================*/

.jc-flow-card::before{

content:"";

position:absolute;

left:0;
top:0;

width:100%;
height:4px;

background:
linear-gradient(
90deg,
var(--primary),
#ffb56d);

transform:scaleX(0);

transform-origin:left;

transition:.4s;

}

.jc-flow-card:hover::before{

transform:scaleX(1);

}


/*==============================
HOVER
==============================*/

.jc-flow-card:hover{

transform:translateY(-10px);

border-color:rgba(255,107,0,.35);

box-shadow:
0 35px 80px rgba(0,0,0,.40);

}


/*==============================
ICON
==============================*/

.jc-flow-icon{

width:72px;
height:72px;

display:flex;

align-items:center;
justify-content:center;

margin-bottom:22px;

font-size:34px;

border-radius:20px;

background:
linear-gradient(
135deg,
rgba(255,107,0,.18),
rgba(255,107,0,.05));

border:1px solid rgba(255,107,0,.35);

transition:.35s;

}

.jc-flow-card:hover .jc-flow-icon{

transform:rotate(-8deg) scale(1.08);

box-shadow:
0 20px 40px rgba(255,107,0,.18);

}


/*==============================
TEXT
==============================*/

.jc-flow-card h3{

font-size:26px;

margin-bottom:18px;

transition:.35s;

}

.jc-flow-card:hover h3{

color:var(--primary);

}

.jc-flow-card p{

font-size:16px;

line-height:1.8;

color:#D1D5DB;

}


/*==============================
ARROW
==============================*/

.jc-flow-arrow{

display:flex;

justify-content:center;

align-items:center;

font-size:34px;

font-weight:700;

color:var(--primary);

animation:launchArrow 2s infinite;

}

@keyframes launchArrow{

0%{

transform:translateY(0);

}

50%{

transform:translateY(8px);

}

100%{

transform:translateY(0);

}

}


/*==============================
FLOAT
==============================*/

.jc-flow-card:nth-child(1){

animation:launchFloat 7s ease infinite;

}

.jc-flow-card:nth-child(3){

animation:launchFloat 7s ease infinite .4s;

}

.jc-flow-card:nth-child(5){

animation:launchFloat 7s ease infinite .8s;

}

@keyframes launchFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}


/*==============================
RESPONSIVE
==============================*/

@media(max-width:991px){

.jc-launch-grid{

grid-template-columns:1fr;

gap:50px;

}

}

@media(max-width:767px){

.jc-launch{

padding:90px 0;

}

.jc-flow-card{

padding:30px;

}

.jc-flow-card h3{

font-size:22px;

}

.jc-flow-icon{

width:65px;
height:65px;

font-size:30px;

}

}
/*==================================================
SECTION 04
PART B
Launch Highlight
==================================================*/


/*==================================
RIGHT PANEL
==================================*/

.jc-launch-highlight{

    position:relative;

    padding:60px;

    border-radius:32px;

    overflow:hidden;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-launch-highlight::before{

    content:"";

    position:absolute;

    right:-160px;
    top:-160px;

    width:360px;
    height:360px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.15),
    transparent);

    filter:blur(90px);

}

.jc-launch-highlight>*{

    position:relative;

    z-index:2;

}


/*==================================
BADGE
==================================*/

.jc-highlight-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 22px;

    margin-bottom:30px;

    border-radius:100px;

    background:rgba(255,107,0,.10);

    border:1px solid rgba(255,107,0,.30);

    color:var(--primary);

    font-size:13px;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

}


/*==================================
SUB TITLE
==================================*/

.jc-launch-highlight h3{

    font-size:18px;

    letter-spacing:2px;

    text-transform:uppercase;

    color:var(--primary);

    margin-bottom:15px;

}


/*==================================
TITLE
==================================*/

.jc-launch-highlight h2{

    font-size:42px;

    line-height:1.2;

    margin-bottom:25px;

}

.jc-launch-highlight h2 span{

    display:block;

    margin-top:10px;

    color:var(--primary);

}


/*==================================
TEXT
==================================*/

.jc-launch-highlight p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
NOTE BOX
==================================*/

.jc-launch-note{

    position:relative;

    margin-top:40px;

    padding:30px;

    border-radius:24px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    overflow:hidden;

    transition:.35s;

}


/*==================================
NOTE BORDER
==================================*/

.jc-launch-note::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:4px;

    height:100%;

    background:linear-gradient(
    180deg,
    var(--primary),
    #ffb56d);

}


/*==================================
NOTE HOVER
==================================*/

.jc-launch-note:hover{

    transform:translateY(-6px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.05));

    box-shadow:
    0 20px 50px rgba(0,0,0,.30);

}


/*==================================
NOTE TITLE
==================================*/

.jc-launch-note strong{

    display:block;

    font-size:22px;

    margin-bottom:15px;

    color:#fff;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-launch-highlight{

padding:45px;

}

}

@media(max-width:767px){

.jc-launch-highlight{

padding:30px;

}

.jc-highlight-badge{

font-size:12px;

padding:10px 18px;

}

.jc-launch-highlight h2{

font-size:30px;

}

.jc-launch-highlight p{

font-size:16px;

}

.jc-launch-note{

padding:24px;

}

.jc-launch-note strong{

font-size:20px;

}

}
/*==================================================
SECTION 04
PART C
Comparison Table
==================================================*/


/*==================================
COMPARE SECTION
==================================*/

.jc-compare{

    margin-top:120px;

}


/*==================================
HEADER
==================================*/

.jc-compare-header{

    max-width:850px;

    margin:0 auto 60px;

    text-align:center;

}

.jc-compare-header h2{

    font-size:48px;

    margin-bottom:20px;

}

.jc-compare-header p{

    font-size:18px;

    line-height:1.8;

    color:#D1D5DB;

}


/*==================================
TABLE
==================================*/

.jc-compare-table{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:35px;

}


/*==================================
COLUMN
==================================*/

.jc-column{

    position:relative;

    padding:45px;

    border-radius:30px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    overflow:hidden;

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==================================
FEATURED COLUMN
==================================*/

.jc-column.featured{

    background:

    linear-gradient(

    180deg,

    rgba(255,107,0,.12),

    rgba(255,255,255,.05)

    );

    border:2px solid rgba(255,107,0,.35);

    transform:scale(1.03);

}


/*==================================
TOP BORDER
==================================*/

.jc-column::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:

    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-column:hover::before{

    transform:scaleX(1);

}


/*==================================
GLOW
==================================*/

.jc-column::after{

    content:"";

    position:absolute;

    right:-120px;
    bottom:-120px;

    width:260px;
    height:260px;

    border-radius:50%;

    background:

    radial-gradient(circle,

    rgba(255,107,0,.15),

    transparent);

    filter:blur(80px);

    opacity:0;

    transition:.35s;

}

.jc-column:hover::after{

    opacity:1;

}


/*==================================
HOVER
==================================*/

.jc-column:hover{

    transform:translateY(-10px);

    box-shadow:

    0 35px 90px rgba(0,0,0,.45);

    border-color:rgba(255,107,0,.30);

}

.jc-column.featured:hover{

    transform:translateY(-10px) scale(1.03);

}


/*==================================
TITLE
==================================*/

.jc-column h3{

    font-size:30px;

    margin-bottom:30px;

    transition:.35s;

}

.jc-column:hover h3{

    color:var(--primary);

}


/*==================================
LIST
==================================*/

.jc-column ul{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.jc-column li{

    display:flex;

    align-items:flex-start;

    gap:12px;

    font-size:17px;

    line-height:1.7;

    color:#D1D5DB;

    padding-bottom:16px;

    border-bottom:1px solid rgba(255,255,255,.06);

}

.jc-column li:last-child{

    border-bottom:none;

    padding-bottom:0;

}


/*==================================
FEATURED BADGE
==================================*/

.jc-column.featured{

    position:relative;

}

.jc-column.featured::after{

    content:"BEST CHOICE";

    position:absolute;

    top:18px;

    right:-45px;

    width:180px;

    text-align:center;

    padding:8px 0;

    font-size:11px;

    font-weight:700;

    letter-spacing:2px;

    color:#fff;

    background:var(--primary);

    transform:rotate(45deg);

    filter:none;

    border-radius:0;

    opacity:1;

    height:auto;

}


/*==================================
ANIMATION
==================================*/

.jc-column{

    animation:compareFade .8s ease both;

}

.jc-column:nth-child(2){

    animation-delay:.2s;

}

@keyframes compareFade{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:none;

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-compare-table{

grid-template-columns:1fr;

}

.jc-column.featured{

transform:none;

}

.jc-column.featured:hover{

transform:translateY(-8px);

}

}


@media(max-width:767px){

.jc-compare{

margin-top:80px;

}

.jc-compare-header h2{

font-size:34px;

}

.jc-column{

padding:30px;

}

.jc-column h3{

font-size:24px;

}

.jc-column li{

font-size:16px;

}

.jc-column.featured::after{

display:none;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c86ecbd *//*==================================================
SECTION 05
PART A
Growth Dashboard
==================================================*/

.jc-manage{

    position:relative;

    padding:130px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#101827 0%,#162235 100%);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-manage::before{

content:"";

position:absolute;

top:-220px;
right:-180px;

width:520px;
height:520px;

border-radius:50%;

background:
radial-gradient(circle,
rgba(255,107,0,.08),
transparent);

filter:blur(120px);

}

.jc-manage::after{

content:"";

position:absolute;

left:-180px;
bottom:-220px;

width:450px;
height:450px;

border-radius:50%;

background:
radial-gradient(circle,
rgba(255,255,255,.03),
transparent);

filter:blur(130px);

}


/*==================================
DASHBOARD
==================================*/

.jc-dashboard{

position:relative;

margin-top:80px;

padding:40px;

border-radius:32px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(20px);

box-shadow:
0 25px 70px rgba(0,0,0,.30);

overflow:hidden;

}


/*==================================
HEADER
==================================*/

.jc-dashboard-header{

display:flex;

justify-content:space-between;

align-items:center;

padding-bottom:30px;

margin-bottom:35px;

border-bottom:1px solid rgba(255,255,255,.08);

}

.jc-dashboard-header small{

display:block;

font-size:13px;

letter-spacing:3px;

text-transform:uppercase;

color:var(--primary);

margin-bottom:10px;

}

.jc-dashboard-header h3{

font-size:34px;

}


/*==================================
LIVE STATUS
==================================*/

.jc-live-status{

display:flex;

align-items:center;

gap:12px;

padding:12px 20px;

border-radius:100px;

background:rgba(46,204,113,.10);

border:1px solid rgba(46,204,113,.30);

font-size:14px;

font-weight:600;

color:#7DFFB2;

}


/*==================================
LIVE DOT
==================================*/

.jc-live-dot{

width:12px;

height:12px;

border-radius:50%;

background:#2ECC71;

animation:livePulse 1.8s infinite;

}

@keyframes livePulse{

0%{

transform:scale(.8);

box-shadow:0 0 0 rgba(46,204,113,.4);

}

70%{

transform:scale(1.2);

box-shadow:0 0 20px rgba(46,204,113,.45);

}

100%{

transform:scale(.8);

box-shadow:0 0 0 rgba(46,204,113,0);

}

}


/*==================================
GRID
==================================*/

.jc-dashboard-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

}


/*==================================
FEATURE CARD
==================================*/

.jc-feature-card{

position:relative;

padding:30px;

border-radius:24px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

transition:.35s;

overflow:hidden;

box-shadow:
0 15px 40px rgba(0,0,0,.20);

}


/*==================================
TOP BAR
==================================*/

.jc-feature-card::before{

content:"";

position:absolute;

left:0;
top:0;

width:100%;
height:4px;

background:
linear-gradient(
90deg,
var(--primary),
#ffb56d);

transform:scaleX(0);

transform-origin:left;

transition:.4s;

}

.jc-feature-card:hover::before{

transform:scaleX(1);

}


/*==================================
HOVER
==================================*/

.jc-feature-card:hover{

transform:translateY(-10px);

border-color:rgba(255,107,0,.35);

background:

linear-gradient(
180deg,
rgba(255,107,0,.06),
rgba(255,255,255,.04));

box-shadow:
0 30px 70px rgba(0,0,0,.35);

}


/*==================================
ICON
==================================*/

.jc-feature-icon{

width:68px;
height:68px;

display:flex;

align-items:center;
justify-content:center;

margin-bottom:20px;

font-size:30px;

border-radius:18px;

background:
linear-gradient(
135deg,
rgba(255,107,0,.18),
rgba(255,107,0,.05));

border:1px solid rgba(255,107,0,.30);

transition:.35s;

}

.jc-feature-card:hover .jc-feature-icon{

transform:rotate(-8deg) scale(1.08);

box-shadow:
0 20px 40px rgba(255,107,0,.18);

}


/*==================================
TEXT
==================================*/

.jc-feature-card h4{

font-size:22px;

margin-bottom:15px;

transition:.35s;

}

.jc-feature-card:hover h4{

color:var(--primary);

}

.jc-feature-card p{

font-size:15px;

line-height:1.8;

color:#D1D5DB;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:1200px){

.jc-dashboard-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:767px){

.jc-manage{

padding:90px 0;

}

.jc-dashboard{

padding:25px;

}

.jc-dashboard-header{

flex-direction:column;

align-items:flex-start;

gap:20px;

}

.jc-dashboard-header h3{

font-size:28px;

}

.jc-dashboard-grid{

grid-template-columns:1fr;

}

.jc-feature-card{

padding:25px;

}

.jc-feature-icon{

width:60px;
height:60px;

font-size:28px;

}

.jc-feature-card h4{

font-size:20px;

}

}
/*==================================================
SECTION 05
PART B
Responsibilities
==================================================*/


/*==================================
SPLIT SECTION
==================================*/

.jc-split-section{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:40px;

    margin-top:100px;

}


/*==================================
COMMON PANEL
==================================*/

.jc-owner-side,
.jc-jubu-side{

    position:relative;

    padding:45px;

    border-radius:30px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    overflow:hidden;

    transition:all .35s ease;

    box-shadow:
    0 20px 60px rgba(0,0,0,.25);

}


/*==================================
TOP BORDER
==================================*/

.jc-owner-side::before,
.jc-jubu-side::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-owner-side:hover::before,
.jc-jubu-side:hover::before{

    transform:scaleX(1);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-owner-side::after,
.jc-jubu-side::after{

    content:"";

    position:absolute;

    right:-120px;
    bottom:-120px;

    width:240px;
    height:240px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.12),
    transparent);

    filter:blur(70px);

    opacity:0;

    transition:.4s;

}

.jc-owner-side:hover::after,
.jc-jubu-side:hover::after{

    opacity:1;

}


/*==================================
HOVER
==================================*/

.jc-owner-side:hover,
.jc-jubu-side:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
HEADINGS
==================================*/

.jc-owner-side h3,
.jc-jubu-side h3{

    font-size:30px;

    margin-bottom:30px;

    transition:.35s;

}

.jc-owner-side:hover h3,
.jc-jubu-side:hover h3{

    color:var(--primary);

}


/*==================================
LIST
==================================*/

.jc-owner-side ul,
.jc-jubu-side ul{

    display:flex;

    flex-direction:column;

    gap:18px;

}


/*==================================
ITEM
==================================*/

.jc-owner-side li,
.jc-jubu-side li{

    position:relative;

    padding-left:34px;

    font-size:17px;

    line-height:1.7;

    color:#D1D5DB;

    border-bottom:1px solid rgba(255,255,255,.06);

    padding-bottom:16px;

}


/*==================================
LAST ITEM
==================================*/

.jc-owner-side li:last-child,
.jc-jubu-side li:last-child{

    border-bottom:none;

    padding-bottom:0;

}


/*==================================
CUSTOM BULLETS
==================================*/

.jc-owner-side li::before{

    content:"✓";

    position:absolute;

    left:0;
    top:1px;

    width:22px;
    height:22px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:rgba(255,107,0,.12);

    color:var(--primary);

    font-size:12px;

    font-weight:700;

}

.jc-jubu-side li::before{

    content:"✓";

    position:absolute;

    left:0;
    top:1px;

    width:22px;
    height:22px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#2ECC71;

    color:#fff;

    font-size:12px;

    font-weight:700;

}


/*==================================
FEATURED SIDE
==================================*/

.jc-jubu-side{

    border:2px solid rgba(255,107,0,.22);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-split-section{

grid-template-columns:1fr;

}

}

@media(max-width:767px){

.jc-split-section{

gap:25px;

margin-top:70px;

}

.jc-owner-side,
.jc-jubu-side{

padding:30px;

}

.jc-owner-side h3,
.jc-jubu-side h3{

font-size:24px;

}

.jc-owner-side li,
.jc-jubu-side li{

font-size:16px;

padding-left:30px;

}

}
/*==================================================
SECTION 05
PART C
Growth Partner Banner
==================================================*/


/*==================================
PROCESS BANNER
==================================*/

.jc-process-banner{

    position:relative;

    display:grid;

    grid-template-columns:1.3fr .7fr;

    gap:60px;

    align-items:center;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.18);

    backdrop-filter:blur(20px);

    overflow:hidden;

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-process-banner::before{

    content:"";

    position:absolute;

    right:-180px;
    top:-180px;

    width:380px;
    height:380px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.18),
    transparent);

    filter:blur(90px);

}

.jc-process-banner>*{

    position:relative;

    z-index:2;

}


/*==================================
LEFT CONTENT
==================================*/

.jc-process-left h2{

    font-size:46px;

    line-height:1.2;

    margin-bottom:25px;

}

.jc-process-left p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

    max-width:700px;

}


/*==================================
RIGHT
==================================*/

.jc-process-right{

display:flex;

justify-content:center;

align-items:center;

}


/*==================================
CIRCLE
==================================*/

.jc-process-circle{

    position:relative;

    width:240px;

    height:240px;

    border-radius:50%;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    background:

    radial-gradient(circle,

    rgba(255,107,0,.22),

    rgba(255,107,0,.05));

    border:2px solid rgba(255,107,0,.30);

    transition:.35s;

}


/*==================================
OUTER RING
==================================*/

.jc-process-circle::before{

    content:"";

    position:absolute;

    inset:-12px;

    border-radius:50%;

    border:2px dashed rgba(255,107,0,.18);

    animation:rotateRing 18s linear infinite;

}

@keyframes rotateRing{

from{

transform:rotate(0deg);

}

to{

transform:rotate(360deg);

}

}


/*==================================
NUMBER
==================================*/

.jc-process-circle span{

    font-size:70px;

    font-weight:800;

    color:var(--primary);

    line-height:1;

    margin-bottom:10px;

}


/*==================================
TEXT
==================================*/

.jc-process-circle small{

    display:block;

    max-width:120px;

    font-size:15px;

    line-height:1.6;

    color:#E5E7EB;

}


/*==================================
HOVER
==================================*/

.jc-process-circle:hover{

    transform:scale(1.05);

    box-shadow:
    0 0 70px rgba(255,107,0,.28);

}


/*==================================
FADE
==================================*/

.jc-process-banner{

animation:processFade .8s ease both;

}

@keyframes processFade{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:none;

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-process-banner{

grid-template-columns:1fr;

text-align:center;

gap:45px;

}

.jc-process-left p{

margin:auto;

}

}

@media(max-width:767px){

.jc-process-banner{

padding:35px 25px;

margin-top:70px;

}

.jc-process-left h2{

font-size:32px;

}

.jc-process-left p{

font-size:16px;

}

.jc-process-circle{

width:180px;

height:180px;

}

.jc-process-circle span{

font-size:52px;

}

.jc-process-circle small{

font-size:14px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-53b27d6 *//*==================================================
SECTION 06
PART A
Performance Partnership
==================================================*/

.jc-pricing{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#162235 0%,#101827 100%);

}


/*==============================
BACKGROUND
==============================*/

.jc-pricing::before{

content:"";

position:absolute;

top:-220px;
right:-180px;

width:520px;
height:520px;

border-radius:50%;

background:
radial-gradient(circle,
rgba(255,107,0,.08),
transparent);

filter:blur(120px);

}

.jc-pricing::after{

content:"";

position:absolute;

left:-180px;
bottom:-220px;

width:450px;
height:450px;

border-radius:50%;

background:
radial-gradient(circle,
rgba(255,255,255,.03),
transparent);

filter:blur(130px);

}


/*==============================
RISK BANNER
==============================*/

.jc-risk-banner{

display:grid;

grid-template-columns:90px 1fr;

gap:30px;

align-items:center;

margin-top:70px;

padding:40px;

border-radius:28px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(20px);

box-shadow:
0 20px 60px rgba(0,0,0,.30);

transition:.35s;

}

.jc-risk-banner:hover{

transform:translateY(-8px);

border-color:rgba(255,107,0,.30);

}

.jc-risk-banner h3{

font-size:30px;

margin-bottom:15px;

}

.jc-risk-banner p{

font-size:17px;

line-height:1.9;

}


/*==============================
ICON
==============================*/

.jc-risk-icon{

width:80px;
height:80px;

display:flex;

align-items:center;
justify-content:center;

font-size:36px;

border-radius:22px;

background:
linear-gradient(
135deg,
rgba(255,107,0,.18),
rgba(255,107,0,.05));

border:1px solid rgba(255,107,0,.30);

}


/*==============================
PAYMENT FLOW
==============================*/

.jc-payment-steps{

display:grid;

grid-template-columns:1fr auto 1fr auto 1fr;

align-items:center;

gap:20px;

margin-top:80px;

}


/*==============================
CARD
==============================*/

.jc-pay-card{

position:relative;

padding:35px;

border-radius:28px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(18px);

transition:.35s;

overflow:hidden;

}

.jc-pay-card:hover{

transform:translateY(-10px);

border-color:rgba(255,107,0,.35);

box-shadow:
0 30px 80px rgba(0,0,0,.40);

}

.jc-pay-card::before{

content:"";

position:absolute;

left:0;
top:0;

width:100%;
height:4px;

background:
linear-gradient(
90deg,
var(--primary),
#ffb56d);

transform:scaleX(0);

transform-origin:left;

transition:.4s;

}

.jc-pay-card:hover::before{

transform:scaleX(1);

}


/*==============================
NUMBER
==============================*/

.jc-pay-number{

width:70px;
height:70px;

display:flex;

align-items:center;
justify-content:center;

margin-bottom:25px;

border-radius:20px;

font-size:28px;

font-weight:800;

color:var(--primary);

background:
linear-gradient(
135deg,
rgba(255,107,0,.18),
rgba(255,107,0,.05));

border:1px solid rgba(255,107,0,.30);

}

.jc-pay-card h3{

font-size:24px;

margin-bottom:18px;

transition:.35s;

}

.jc-pay-card:hover h3{

color:var(--primary);

}

.jc-pay-card p{

font-size:16px;

line-height:1.8;

color:#D1D5DB;

}


/*==============================
ARROW
==============================*/

.jc-pay-arrow{

font-size:42px;

font-weight:700;

color:var(--primary);

animation:payArrow 2s infinite;

}

@keyframes payArrow{

0%{

transform:translateX(0);

}

50%{

transform:translateX(8px);

}

100%{

transform:translateX(0);

}

}


/*==============================
RESPONSIVE
==============================*/

@media(max-width:1100px){

.jc-payment-steps{

grid-template-columns:1fr;

}

.jc-pay-arrow{

transform:rotate(90deg);

justify-self:center;

}

}

@media(max-width:767px){

.jc-pricing{

padding:90px 0;

}

.jc-risk-banner{

grid-template-columns:1fr;

text-align:center;

}

.jc-risk-icon{

margin:auto;

}

.jc-pay-card{

padding:28px;

}

}

/*==================================================
SECTION 06
PART B
Performance Model
==================================================*/


/*==================================
PERFORMANCE BOX
==================================*/

.jc-performance-box{

    position:relative;

    display:grid;

    grid-template-columns:1.3fr .7fr;

    gap:60px;

    align-items:center;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.20);

    backdrop-filter:blur(20px);

    overflow:hidden;

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-performance-box::before{

    content:"";

    position:absolute;

    right:-180px;
    top:-180px;

    width:380px;
    height:380px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.18),
    transparent);

    filter:blur(90px);

}

.jc-performance-box>*{

    position:relative;

    z-index:2;

}


/*==================================
LEFT
==================================*/

.jc-performance-left small{

    display:inline-block;

    margin-bottom:18px;

    font-size:13px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

    color:var(--primary);

}

.jc-performance-left h2{

    font-size:48px;

    line-height:1.2;

    margin-bottom:25px;

}

.jc-performance-left h2 span{

    display:block;

    color:var(--primary);

}

.jc-performance-left p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

    margin-bottom:20px;

}

.jc-performance-left p:last-child{

    margin-bottom:0;

}


/*==================================
RIGHT
==================================*/

.jc-performance-right{

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

}


/*==================================
BIG NUMBER
==================================*/

.jc-big-number{

    width:230px;

    height:230px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    font-size:78px;

    font-weight:800;

    color:var(--primary);

    background:
    radial-gradient(circle,
    rgba(255,107,0,.22),
    rgba(255,107,0,.05));

    border:2px solid rgba(255,107,0,.30);

    position:relative;

    transition:.35s;

}


/*==================================
ROTATING RING
==================================*/

.jc-big-number::before{

    content:"";

    position:absolute;

    inset:-12px;

    border-radius:50%;

    border:2px dashed rgba(255,107,0,.18);

    animation:pricingRotate 18s linear infinite;

}

@keyframes pricingRotate{

from{

transform:rotate(0deg);

}

to{

transform:rotate(360deg);

}

}


/*==================================
HOVER
==================================*/

.jc-big-number:hover{

    transform:scale(1.05);

    box-shadow:
    0 0 70px rgba(255,107,0,.25);

}

.jc-performance-right span{

    display:block;

    margin-top:25px;

    max-width:220px;

    font-size:16px;

    line-height:1.7;

    color:#E5E7EB;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-performance-box{

grid-template-columns:1fr;

text-align:center;

gap:45px;

}

}

@media(max-width:767px){

.jc-performance-box{

padding:35px 25px;

margin-top:70px;

}

.jc-performance-left h2{

font-size:34px;

}

.jc-performance-left p{

font-size:16px;

}

.jc-big-number{

width:180px;

height:180px;

font-size:56px;

}

.jc-performance-right span{

font-size:15px;

}

}
/*==================================================
SECTION 06
PART C
Weekly Partnership + Bottom Note
==================================================*/


/*==================================
WEEKLY BOX
==================================*/

.jc-weekly-box{

    position:relative;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    overflow:hidden;

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}

.jc-weekly-box::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:5px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

}

.jc-weekly-box h3{

    font-size:38px;

    margin-bottom:20px;

}

.jc-weekly-box>p{

    max-width:850px;

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

    margin-bottom:50px;

}


/*==================================
GRID
==================================*/

.jc-week-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:25px;

}


/*==================================
ITEM
==================================*/

.jc-week-grid>div{

    position:relative;

    padding:30px;

    border-radius:24px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    transition:.35s;

}

.jc-week-grid>div:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.06),
    rgba(255,255,255,.04));

    box-shadow:
    0 20px 60px rgba(0,0,0,.35);

}

.jc-week-grid h4{

    font-size:22px;

    margin-bottom:18px;

    transition:.35s;

}

.jc-week-grid>div:hover h4{

    color:var(--primary);

}

.jc-week-grid p{

    font-size:16px;

    line-height:1.8;

    color:#D1D5DB;

}


/*==================================
BOTTOM NOTE
==================================*/

.jc-bottom-note{

    display:grid;

    grid-template-columns:90px 1fr;

    gap:30px;

    align-items:center;

    margin-top:100px;

    padding:45px;

    border-radius:30px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.20);

    backdrop-filter:blur(20px);

    transition:.35s;

}

.jc-bottom-note:hover{

    transform:translateY(-8px);

    box-shadow:
    0 30px 80px rgba(0,0,0,.35);

}


/*==================================
ICON
==================================*/

.jc-note-icon{

    width:80px;

    height:80px;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:38px;

    border-radius:22px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

}


/*==================================
TEXT
==================================*/

.jc-bottom-note h3{

    font-size:30px;

    margin-bottom:18px;

}

.jc-bottom-note p{

    font-size:17px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-week-grid{

grid-template-columns:1fr;

}

}

@media(max-width:767px){

.jc-weekly-box{

padding:35px 25px;

margin-top:70px;

}

.jc-weekly-box h3{

font-size:30px;

}

.jc-weekly-box>p{

font-size:16px;

margin-bottom:35px;

}

.jc-week-grid>div{

padding:24px;

}

.jc-week-grid h4{

font-size:20px;

}

.jc-bottom-note{

grid-template-columns:1fr;

text-align:center;

padding:35px 25px;

margin-top:70px;

}

.jc-note-icon{

margin:auto;

}

.jc-bottom-note h3{

font-size:24px;

}

.jc-bottom-note p{

font-size:16px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a00a742 *//*==================================================
SECTION 07
PART A
Money Flow Diagram
==================================================*/

.jc-moneyflow{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#101827 0%,#162235 100%);

}

/*==============================
BACKGROUND GLOW
==============================*/

.jc-moneyflow::before{

    content:"";

    position:absolute;

    width:550px;
    height:550px;

    top:-250px;
    right:-180px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.08),
    transparent);

    filter:blur(130px);

}

.jc-moneyflow::after{

    content:"";

    position:absolute;

    width:450px;
    height:450px;

    left:-180px;
    bottom:-180px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(130px);

}


/*==============================
FLOW GRID
==============================*/

.jc-money-diagram{

    display:grid;

    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;

    gap:20px;

    align-items:center;

    margin-top:90px;

}


/*==============================
CARD
==============================*/

.jc-money-card{

    position:relative;

    padding:34px 28px;

    border-radius:28px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    overflow:hidden;

    transition:all .35s ease;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==============================
FEATURED
==============================*/

.jc-money-card.featured{

    border:2px solid rgba(255,107,0,.35);

    background:

    linear-gradient(

    180deg,

    rgba(255,107,0,.10),

    rgba(255,255,255,.04)

    );

}


/*==============================
TOP BAR
==============================*/

.jc-money-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:

    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-money-card:hover::before{

    transform:scaleX(1);

}


/*==============================
SHINE
==============================*/

.jc-money-card::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:

    linear-gradient(

    90deg,

    transparent,

    rgba(255,255,255,.10),

    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-money-card:hover::after{

    left:160%;

}


/*==============================
HOVER
==============================*/

.jc-money-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:

    linear-gradient(

    180deg,

    rgba(255,107,0,.06),

    rgba(255,255,255,.04)

    );

    box-shadow:

    0 35px 80px rgba(0,0,0,.40);

}


/*==============================
ICON
==============================*/

.jc-money-icon{

    width:72px;

    height:72px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:22px;

    font-size:34px;

    border-radius:22px;

    background:

    linear-gradient(

    135deg,

    rgba(255,107,0,.18),

    rgba(255,107,0,.05)

    );

    border:1px solid rgba(255,107,0,.30);

    transition:.35s;

}

.jc-money-card:hover .jc-money-icon{

    transform:rotate(-8deg) scale(1.08);

    box-shadow:

    0 18px 40px rgba(255,107,0,.20);

}


/*==============================
TEXT
==============================*/

.jc-money-card h3{

    font-size:22px;

    margin-bottom:16px;

    transition:.35s;

}

.jc-money-card:hover h3{

    color:var(--primary);

}

.jc-money-card p{

    font-size:15px;

    line-height:1.8;

    color:#D1D5DB;

}


/*==============================
FLOW ARROW
==============================*/

.jc-money-arrow{

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:42px;

    font-weight:700;

    color:var(--primary);

    animation:moneyArrow 2s ease infinite;

}

@keyframes moneyArrow{

    0%{

        transform:translateX(0);

    }

    50%{

        transform:translateX(8px);

    }

    100%{

        transform:translateX(0);

    }

}


/*==============================
RESPONSIVE
==============================*/

@media(max-width:1200px){

.jc-money-diagram{

grid-template-columns:1fr;

gap:22px;

}

.jc-money-arrow{

transform:rotate(90deg);

justify-self:center;

}

}

@media(max-width:767px){

.jc-moneyflow{

padding:90px 0;

}

.jc-money-card{

padding:28px;

}

.jc-money-icon{

width:62px;
height:62px;

font-size:28px;

}

.jc-money-card h3{

font-size:20px;

}

}
/*==================================================
SECTION 07
PART B
Money Ownership Highlight
==================================================*/


/*==================================
HIGHLIGHT BOX
==================================*/

.jc-money-highlight{

    position:relative;

    display:grid;

    grid-template-columns:1.2fr .8fr;

    gap:60px;

    align-items:center;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.18);

    backdrop-filter:blur(20px);

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-money-highlight::before{

    content:"";

    position:absolute;

    right:-180px;
    top:-180px;

    width:380px;
    height:380px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.18),
    transparent);

    filter:blur(90px);

}

.jc-money-highlight>*{

    position:relative;

    z-index:2;

}


/*==================================
LEFT
==================================*/

.jc-highlight-left small{

    display:inline-block;

    margin-bottom:18px;

    color:var(--primary);

    letter-spacing:3px;

    font-size:13px;

    font-weight:700;

    text-transform:uppercase;

}

.jc-highlight-left h2{

    font-size:48px;

    line-height:1.2;

    margin-bottom:25px;

}

.jc-highlight-left h2 span{

    display:block;

    color:var(--primary);

}

.jc-highlight-left p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

    margin-bottom:20px;

}

.jc-highlight-left p:last-child{

    margin-bottom:0;

}


/*==================================
RIGHT
==================================*/

.jc-highlight-right{

    display:flex;

    flex-direction:column;

    gap:18px;

}


/*==================================
CHECK ITEM
==================================*/

.jc-check{

    position:relative;

    padding:20px 24px;

    border-radius:18px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    font-size:17px;

    font-weight:600;

    color:#fff;

    transition:.35s;

    overflow:hidden;

}


/*==================================
SHINE
==================================*/

.jc-check::before{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-check:hover::before{

    left:160%;

}


/*==================================
HOVER
==================================*/

.jc-check:hover{

    transform:translateX(10px);

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.05));

    border-color:rgba(255,107,0,.35);

    box-shadow:
    0 20px 45px rgba(255,107,0,.10);

}


/*==================================
STAGGER
==================================*/

.jc-check:nth-child(1){

animation:checkFloat 7s ease infinite;

}

.jc-check:nth-child(2){

animation:checkFloat 7s ease infinite .2s;

}

.jc-check:nth-child(3){

animation:checkFloat 7s ease infinite .4s;

}

.jc-check:nth-child(4){

animation:checkFloat 7s ease infinite .6s;

}

.jc-check:nth-child(5){

animation:checkFloat 7s ease infinite .8s;

}

@keyframes checkFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-5px);

}

100%{

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-money-highlight{

grid-template-columns:1fr;

gap:45px;

}

}

@media(max-width:767px){

.jc-money-highlight{

padding:35px 25px;

margin-top:70px;

}

.jc-highlight-left{

text-align:center;

}

.jc-highlight-left h2{

font-size:34px;

}

.jc-highlight-left p{

font-size:16px;

}

.jc-check{

padding:18px 20px;

font-size:16px;

}

}
/*==================================================
SECTION 07
PART C
Weekly Report + Trust Banner
==================================================*/


/*==================================
WEEKLY REPORT
==================================*/

.jc-weekly-report{

    position:relative;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    overflow:hidden;

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}

.jc-weekly-report::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:5px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

}


/*==================================
HEADER
==================================*/

.jc-report-left{

    margin-bottom:50px;

}

.jc-report-left h3{

    font-size:40px;

    margin-bottom:18px;

}

.jc-report-left p{

    max-width:700px;

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
GRID
==================================*/

.jc-report-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:25px;

}


/*==================================
CARD
==================================*/

.jc-report-card{

    position:relative;

    padding:30px;

    border-radius:24px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    text-align:center;

    transition:.35s;

    overflow:hidden;

}


/*==================================
TOP BAR
==================================*/

.jc-report-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-report-card:hover::before{

    transform:scaleX(1);

}


/*==================================
ICON
==================================*/

.jc-report-card span{

    display:flex;

    justify-content:center;

    align-items:center;

    width:72px;

    height:72px;

    margin:0 auto 22px;

    border-radius:20px;

    font-size:34px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

    transition:.35s;

}

.jc-report-card:hover span{

    transform:rotate(-8deg) scale(1.08);

}


/*==================================
TEXT
==================================*/

.jc-report-card h4{

    font-size:22px;

    transition:.35s;

}

.jc-report-card:hover h4{

    color:var(--primary);

}


/*==================================
HOVER
==================================*/

.jc-report-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.06),
    rgba(255,255,255,.04));

    box-shadow:
    0 25px 60px rgba(0,0,0,.35);

}


/*==================================
TRUST BOX
==================================*/

.jc-trust-box{

    position:relative;

    display:grid;

    grid-template-columns:90px 1fr;

    gap:30px;

    align-items:center;

    margin-top:100px;

    padding:45px;

    border-radius:30px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.20);

    backdrop-filter:blur(20px);

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}

.jc-trust-box:hover{

    transform:translateY(-8px);

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
ICON
==================================*/

.jc-trust-icon{

    width:80px;

    height:80px;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:38px;

    border-radius:22px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

}


/*==================================
TEXT
==================================*/

.jc-trust-box h3{

    font-size:30px;

    margin-bottom:18px;

}

.jc-trust-box p{

    font-size:17px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-report-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:767px){

.jc-weekly-report{

padding:35px 25px;

margin-top:70px;

}

.jc-report-left{

text-align:center;

margin-bottom:35px;

}

.jc-report-left h3{

font-size:30px;

}

.jc-report-left p{

font-size:16px;

}

.jc-report-grid{

grid-template-columns:1fr;

}

.jc-report-card{

padding:25px;

}

.jc-report-card span{

width:62px;
height:62px;

font-size:28px;

}

.jc-report-card h4{

font-size:20px;

}

.jc-trust-box{

grid-template-columns:1fr;

text-align:center;

padding:35px 25px;

margin-top:70px;

}

.jc-trust-icon{

margin:auto;

}

.jc-trust-box h3{

font-size:24px;

}

.jc-trust-box p{

font-size:16px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-fc91c66 *//*==================================================
SECTION 08
PART A
Customer Data Engine Flow
==================================================*/

.jc-data-engine{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#101827 0%,#162235 100%);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-data-engine::before{

    content:"";

    position:absolute;

    top:-220px;
    right:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.08),
    transparent);

    filter:blur(120px);

}

.jc-data-engine::after{

    content:"";

    position:absolute;

    left:-180px;
    bottom:-220px;

    width:450px;
    height:450px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(130px);

}


/*==================================
FLOW
==================================*/

.jc-engine-flow{

    display:grid;

    grid-template-columns:1fr auto 1fr auto 1fr;

    gap:22px;

    align-items:center;

    margin-top:90px;

}


/*==================================
ENGINE CARD
==================================*/

.jc-engine-card{

    position:relative;

    padding:36px 30px;

    border-radius:30px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    overflow:hidden;

    transition:all .35s ease;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==================================
TOP BAR
==================================*/

.jc-engine-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-engine-card:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE EFFECT
==================================*/

.jc-engine-card::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-engine-card:hover::after{

    left:160%;

}


/*==================================
HOVER
==================================*/

.jc-engine-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.06),
    rgba(255,255,255,.04));

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
ICON
==================================*/

.jc-engine-icon{

    width:72px;

    height:72px;

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:22px;

    font-size:34px;

    border-radius:22px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

    transition:.35s;

}

.jc-engine-card:hover .jc-engine-icon{

    transform:rotate(-8deg) scale(1.08);

    box-shadow:
    0 20px 40px rgba(255,107,0,.20);

}


/*==================================
TEXT
==================================*/

.jc-engine-card h3{

    font-size:24px;

    margin-bottom:16px;

    transition:.35s;

}

.jc-engine-card:hover h3{

    color:var(--primary);

}

.jc-engine-card p{

    font-size:16px;

    line-height:1.8;

    color:#D1D5DB;

}


/*==================================
FLOW ARROW
==================================*/

.jc-engine-arrow{

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:42px;

    font-weight:700;

    color:var(--primary);

    animation:engineArrow 2s ease infinite;

}

@keyframes engineArrow{

0%{

transform:translateX(0);

}

50%{

transform:translateX(8px);

}

100%{

transform:translateX(0);

}

}


/*==================================
FLOAT ANIMATION
==================================*/

.jc-engine-card:nth-child(1){

animation:engineFloat 7s ease infinite;

}

.jc-engine-card:nth-child(3){

animation:engineFloat 7s ease infinite .3s;

}

.jc-engine-card:nth-child(5){

animation:engineFloat 7s ease infinite .6s;

}

@keyframes engineFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:1100px){

.jc-engine-flow{

grid-template-columns:1fr;

gap:24px;

}

.jc-engine-arrow{

transform:rotate(90deg);

justify-self:center;

}

}

@media(max-width:767px){

.jc-data-engine{

padding:90px 0;

}

.jc-engine-card{

padding:28px;

}

.jc-engine-icon{

width:62px;
height:62px;

font-size:28px;

}

.jc-engine-card h3{

font-size:21px;

}

.jc-engine-card p{

font-size:15px;

}

}
/*==================================================
SECTION 08
PART B
Customer Database
==================================================*/


/*==================================
DATABASE SECTION
==================================*/

.jc-database{

    position:relative;

    display:grid;

    grid-template-columns:420px 1fr;

    gap:60px;

    align-items:center;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.18);

    backdrop-filter:blur(20px);

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-database::before{

    content:"";

    position:absolute;

    right:-180px;
    top:-180px;

    width:380px;
    height:380px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.18),
    transparent);

    filter:blur(90px);

}

.jc-database>*{

    position:relative;

    z-index:2;

}


/*==================================
LEFT
==================================*/

.jc-database-left small{

    display:inline-block;

    margin-bottom:18px;

    font-size:13px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

    color:var(--primary);

}

.jc-database-left h2{

    font-size:46px;

    line-height:1.2;

    margin-bottom:25px;

}

.jc-database-left p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
GRID
==================================*/

.jc-database-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:20px;

}


/*==================================
DATABASE ITEM
==================================*/

.jc-db-item{

    position:relative;

    display:flex;

    align-items:center;

    gap:18px;

    padding:22px 24px;

    border-radius:18px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    font-size:17px;

    font-weight:600;

    color:#fff;

    transition:all .35s ease;

    overflow:hidden;

}


/*==================================
LEFT ACCENT
==================================*/

.jc-db-item::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:4px;

    height:100%;

    background:
    linear-gradient(
    180deg,
    var(--primary),
    #ffb56d);

    transform:scaleY(0);

    transform-origin:top;

    transition:.35s;

}


/*==================================
SHINE EFFECT
==================================*/

.jc-db-item::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-db-item:hover::after{

    left:160%;

}


/*==================================
HOVER
==================================*/

.jc-db-item:hover{

    transform:translateX(10px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.05));

    box-shadow:
    0 20px 45px rgba(255,107,0,.12);

}

.jc-db-item:hover::before{

    transform:scaleY(1);

}


/*==================================
FLOAT
==================================*/

.jc-db-item:nth-child(odd){

animation:dbFloat 7s ease infinite;

}

.jc-db-item:nth-child(even){

animation:dbFloat 7s ease infinite .4s;

}

@keyframes dbFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-6px);

}

100%{

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:1100px){

.jc-database{

grid-template-columns:1fr;

gap:45px;

}

}

@media(max-width:767px){

.jc-database{

padding:35px 25px;

margin-top:70px;

}

.jc-database-left{

text-align:center;

}

.jc-database-left h2{

font-size:32px;

}

.jc-database-left p{

font-size:16px;

}

.jc-database-grid{

grid-template-columns:1fr;

}

.jc-db-item{

padding:18px 20px;

font-size:16px;

}

}
/*==================================================
SECTION 08
PART C
Marketing Engine
==================================================*/


/*==================================
MARKETING ENGINE
==================================*/

.jc-marketing-engine{

    position:relative;

    display:grid;

    grid-template-columns:420px 1fr;

    gap:60px;

    align-items:center;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    overflow:hidden;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-marketing-engine::before{

    content:"";

    position:absolute;

    left:-180px;
    bottom:-180px;

    width:380px;
    height:380px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.15),
    transparent);

    filter:blur(90px);

}

.jc-marketing-engine>*{

    position:relative;

    z-index:2;

}


/*==================================
LEFT CONTENT
==================================*/

.jc-engine-left h3{

    font-size:42px;

    line-height:1.2;

    margin-bottom:24px;

}

.jc-engine-left p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
GRID
==================================*/

.jc-marketing-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:22px;

}


/*==================================
CARD
==================================*/

.jc-market-card{

    position:relative;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    gap:18px;

    min-height:170px;

    padding:30px;

    border-radius:24px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    transition:.35s;

    overflow:hidden;

    font-size:42px;

}


/*==================================
TOP BORDER
==================================*/

.jc-market-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.jc-market-card:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE
==================================*/

.jc-market-card::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-market-card:hover::after{

    left:160%;

}


/*==================================
TEXT
==================================*/

.jc-market-card span{

    font-size:20px;

    font-weight:700;

    color:#fff;

    transition:.35s;

}


/*==================================
HOVER
==================================*/

.jc-market-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    box-shadow:
    0 30px 70px rgba(0,0,0,.35);

}

.jc-market-card:hover span{

    color:var(--primary);

}


/*==================================
FLOAT
==================================*/

.jc-market-card:nth-child(odd){

animation:marketFloat 7s ease infinite;

}

.jc-market-card:nth-child(even){

animation:marketFloat 7s ease infinite .35s;

}

@keyframes marketFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-7px);

}

100%{

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:1100px){

.jc-marketing-engine{

grid-template-columns:1fr;

gap:45px;

}

}

@media(max-width:767px){

.jc-marketing-engine{

padding:35px 25px;

margin-top:70px;

}

.jc-engine-left{

text-align:center;

}

.jc-engine-left h3{

font-size:32px;

}

.jc-engine-left p{

font-size:16px;

}

.jc-marketing-grid{

grid-template-columns:1fr;

}

.jc-market-card{

min-height:140px;

padding:25px;

font-size:34px;

}

.jc-market-card span{

font-size:18px;

}

}
/*==================================================
SECTION 08
PART D
Comparison + Final Message
==================================================*/


/*==================================
COMPARISON GRID
==================================*/

.jc-assets{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:35px;

    margin-top:100px;

}


/*==================================
COMMON BOX
==================================*/

.jc-assets-box{

    position:relative;

    padding:45px;

    border-radius:30px;

    overflow:hidden;

    backdrop-filter:blur(18px);

    transition:.35s;

    border:1px solid rgba(255,255,255,.08);

    background:rgba(255,255,255,.04);

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==================================
TOP BAR
==================================*/

.jc-assets-box::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.jc-assets-box:hover::before{

    transform:scaleX(1);

}


/*==================================
DANGER
==================================*/

.jc-assets-box.danger{

    border-color:rgba(239,68,68,.18);

}

.jc-assets-box.danger::before{

    background:
    linear-gradient(
    90deg,
    #ef4444,
    #f87171);

}


/*==================================
SUCCESS
==================================*/

.jc-assets-box.success{

    border:2px solid rgba(255,107,0,.30);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

}

.jc-assets-box.success::before{

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

}


/*==================================
HOVER
==================================*/

.jc-assets-box:hover{

    transform:translateY(-10px);

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
TITLE
==================================*/

.jc-assets-box h3{

    font-size:30px;

    margin-bottom:28px;

}

.jc-assets-box.success h3{

    color:var(--primary);

}


/*==================================
LIST
==================================*/

.jc-assets-box ul{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.jc-assets-box li{

    padding-bottom:16px;

    border-bottom:1px solid rgba(255,255,255,.06);

    font-size:17px;

    line-height:1.8;

    color:#D1D5DB;

}

.jc-assets-box li:last-child{

    border:none;

    padding-bottom:0;

}


/*==================================
BIG MESSAGE
==================================*/

.jc-big-message{

    position:relative;

    display:grid;

    grid-template-columns:100px 1fr;

    gap:35px;

    align-items:center;

    margin-top:100px;

    padding:60px;

    border-radius:32px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.10),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.20);

    backdrop-filter:blur(20px);

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-big-message::before{

    content:"";

    position:absolute;

    right:-180px;
    top:-180px;

    width:380px;
    height:380px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.18),
    transparent);

    filter:blur(90px);

}

.jc-big-message>*{

    position:relative;

    z-index:2;

}


/*==================================
ICON
==================================*/

.jc-big-icon{

    width:90px;

    height:90px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:24px;

    font-size:46px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

    animation:rocketFloat 4s ease infinite;

}

@keyframes rocketFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0);

}

}


/*==================================
TEXT
==================================*/

.jc-big-message h2{

    font-size:42px;

    margin-bottom:10px;

}

.jc-big-message h3{

    font-size:28px;

    color:var(--primary);

    margin-bottom:20px;

}

.jc-big-message p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

    max-width:850px;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-assets{

grid-template-columns:1fr;

}

}

@media(max-width:767px){

.jc-assets{

gap:25px;

margin-top:70px;

}

.jc-assets-box{

padding:30px;

}

.jc-assets-box h3{

font-size:24px;

}

.jc-assets-box li{

font-size:16px;

}

.jc-big-message{

grid-template-columns:1fr;

text-align:center;

padding:35px 25px;

margin-top:70px;

}

.jc-big-icon{

margin:auto;

width:75px;

height:75px;

font-size:38px;

}

.jc-big-message h2{

font-size:30px;

}

.jc-big-message h3{

font-size:22px;

}

.jc-big-message p{

font-size:16px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f2277c2 *//*==================================================
SECTION 09
PART A
Growth Flywheel
==================================================*/

.jc-flywheel{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#162235 0%,#101827 100%);

}


/*==================================
BACKGROUND
==================================*/

.jc-flywheel::before{

    content:"";

    position:absolute;

    top:-220px;
    left:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.08),
    transparent);

    filter:blur(120px);

}

.jc-flywheel::after{

    content:"";

    position:absolute;

    right:-180px;
    bottom:-180px;

    width:450px;
    height:450px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(130px);

}


/*==================================
FLYWHEEL
==================================*/

.jc-flywheel-wrapper{

    position:relative;

    width:700px;

    height:700px;

    margin:100px auto;

}


/*==================================
CENTER
==================================*/

.jc-wheel-center{

    position:absolute;

    left:50%;
    top:50%;

    transform:translate(-50%,-50%);

    width:220px;

    height:220px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    text-align:center;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:2px solid rgba(255,107,0,.35);

    box-shadow:
    0 0 80px rgba(255,107,0,.20);

    z-index:5;

}

.jc-wheel-center h3{

    font-size:34px;

    line-height:1.3;

    color:#fff;

}


/*==================================
ITEM
==================================*/

.jc-wheel-item{

    position:absolute;

    width:170px;

    padding:25px;

    border-radius:24px;

    text-align:center;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    transition:.35s;

    box-shadow:
    0 20px 50px rgba(0,0,0,.25);

}

.jc-wheel-item:hover{

    transform:scale(1.08);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

}


/*==================================
ICON
==================================*/

.jc-wheel-icon{

    width:64px;

    height:64px;

    display:flex;

    justify-content:center;

    align-items:center;

    margin:0 auto 18px;

    border-radius:18px;

    font-size:30px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

}

.jc-wheel-item h4{

    font-size:18px;

}


/*==================================
POSITIONS
==================================*/

.item1{

top:0;

left:50%;

transform:translateX(-50%);

}

.item2{

top:120px;

right:0;

}

.item3{

bottom:120px;

right:0;

}

.item4{

bottom:0;

left:50%;

transform:translateX(-50%);

}

.item5{

bottom:120px;

left:0;

}

.item6{

top:120px;

left:0;

}


/*==================================
ROTATION
==================================*/

.jc-flywheel-wrapper{

animation:wheelRotate 35s linear infinite;

}

.jc-wheel-center{

animation:none;

}

.jc-wheel-item{

animation:wheelCounter 35s linear infinite;

}

@keyframes wheelRotate{

from{

transform:rotate(0deg);

}

to{

transform:rotate(360deg);

}

}

@keyframes wheelCounter{

from{

transform:rotate(0deg);

}

to{

transform:rotate(-360deg);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-flywheel-wrapper{

width:100%;

height:auto;

display:grid;

grid-template-columns:1fr;

gap:25px;

}

.jc-wheel-center,

.jc-wheel-item{

position:relative;

left:auto;

right:auto;

top:auto;

bottom:auto;

transform:none;

width:100%;

max-width:420px;

margin:auto;

animation:none;

}

}

@media(max-width:767px){

.jc-flywheel{

padding:90px 0;

}

.jc-wheel-center{

height:180px;

}

.jc-wheel-center h3{

font-size:28px;

}

}
/*==================================================
SECTION 09
PART B
Growth Timeline Cards
==================================================*/


/*==================================
GRID
==================================*/

.jc-fly-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

    margin-top:100px;

}


/*==================================
CARD
==================================*/

.jc-fly-card{

    position:relative;

    padding:40px 35px;

    border-radius:28px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    overflow:hidden;

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==================================
TOP BORDER
==================================*/

.jc-fly-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-fly-card:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE
==================================*/

.jc-fly-card::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-fly-card:hover::after{

    left:160%;

}


/*==================================
HOVER
==================================*/

.jc-fly-card:hover{

    transform:translateY(-12px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    box-shadow:
    0 35px 80px rgba(0,0,0,.35);

}


/*==================================
MONTH TITLE
==================================*/

.jc-fly-card h3{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:95px;

    height:95px;

    margin-bottom:28px;

    border-radius:50%;

    font-size:24px;

    font-weight:700;

    color:var(--primary);

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:2px solid rgba(255,107,0,.30);

    transition:.35s;

}

.jc-fly-card:hover h3{

    transform:scale(1.08);

    box-shadow:
    0 15px 35px rgba(255,107,0,.18);

}


/*==================================
TEXT
==================================*/

.jc-fly-card p{

    font-size:17px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
FLOAT EFFECT
==================================*/

.jc-fly-card:nth-child(1){

animation:flyCardFloat 7s ease infinite;

}

.jc-fly-card:nth-child(2){

animation:flyCardFloat 7s ease infinite .25s;

}

.jc-fly-card:nth-child(3){

animation:flyCardFloat 7s ease infinite .5s;

}

@keyframes flyCardFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-fly-grid{

grid-template-columns:1fr;

gap:24px;

}

}

@media(max-width:767px){

.jc-fly-grid{

margin-top:70px;

}

.jc-fly-card{

padding:30px 25px;

}

.jc-fly-card h3{

width:80px;

height:80px;

font-size:20px;

margin-bottom:22px;

}

.jc-fly-card p{

font-size:16px;

}

}
/*==================================================
SECTION 09
PART C
Growth Quote
==================================================*/


/*==================================
QUOTE SECTION
==================================*/

.jc-growth-quote{

    position:relative;

    margin-top:100px;

    padding:70px 60px;

    text-align:center;

    border-radius:32px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.18);

    backdrop-filter:blur(20px);

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-growth-quote::before{

    content:"";

    position:absolute;

    left:50%;
    top:50%;

    width:420px;
    height:420px;

    transform:translate(-50%,-50%);

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.14),
    transparent);

    filter:blur(90px);

}

.jc-growth-quote>*{

    position:relative;

    z-index:2;

}


/*==================================
TOP QUOTE
==================================*/

.jc-growth-quote::after{

    content:"❝";

    position:absolute;

    top:25px;

    left:50%;

    transform:translateX(-50%);

    font-size:90px;

    line-height:1;

    color:rgba(255,107,0,.18);

    font-weight:700;

}


/*==================================
BLOCKQUOTE
==================================*/

.jc-growth-quote blockquote{

    margin:0 auto;

    max-width:900px;

    font-size:40px;

    font-weight:700;

    line-height:1.5;

    color:#fff;

    font-style:normal;

}


/*==================================
ACCENT
==================================*/

.jc-growth-quote blockquote::after{

    content:"";

    display:block;

    width:120px;

    height:4px;

    margin:35px auto 0;

    border-radius:20px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

}


/*==================================
HOVER
==================================*/

.jc-growth-quote:hover{

    transform:translateY(-8px);

    transition:.35s;

    box-shadow:
    0 35px 90px rgba(0,0,0,.35);

}


/*==================================
FADE
==================================*/

.jc-growth-quote{

animation:quoteFade .8s ease both;

}

@keyframes quoteFade{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:none;

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-growth-quote{

padding:50px 25px;

margin-top:70px;

}

.jc-growth-quote::after{

font-size:60px;

top:18px;

}

.jc-growth-quote blockquote{

font-size:24px;

line-height:1.6;

}

.jc-growth-quote blockquote::after{

width:80px;

margin-top:25px;

}

}
/*==================================================
SECTION 09
PART D
Benefits + Footer
==================================================*/


/*==================================
BENEFITS GRID
==================================*/

.jc-benefits{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

    margin-top:100px;

}


/*==================================
BENEFIT CARD
==================================*/

.jc-benefit{

    position:relative;

    padding:40px 35px;

    border-radius:28px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    overflow:hidden;

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==================================
TOP ACCENT
==================================*/

.jc-benefit::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.jc-benefit:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE EFFECT
==================================*/

.jc-benefit::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-benefit:hover::after{

    left:160%;

}


/*==================================
HOVER
==================================*/

.jc-benefit:hover{

    transform:translateY(-12px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
ICON
==================================*/

.jc-benefit span{

    display:flex;

    align-items:center;

    justify-content:center;

    width:74px;

    height:74px;

    margin-bottom:24px;

    border-radius:20px;

    font-size:34px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

    transition:.35s;

}

.jc-benefit:hover span{

    transform:rotate(-8deg) scale(1.08);

    box-shadow:
    0 18px 40px rgba(255,107,0,.18);

}


/*==================================
TITLE
==================================*/

.jc-benefit h4{

    font-size:24px;

    margin-bottom:18px;

    transition:.35s;

}

.jc-benefit:hover h4{

    color:var(--primary);

}


/*==================================
TEXT
==================================*/

.jc-benefit p{

    font-size:16px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
FOOTER
==================================*/

.jc-fly-footer{

    position:relative;

    margin-top:100px;

    padding:70px 60px;

    text-align:center;

    border-radius:32px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.10),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.20);

    backdrop-filter:blur(20px);

    box-shadow:
    0 30px 80px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-fly-footer::before{

    content:"";

    position:absolute;

    left:50%;
    top:50%;

    transform:translate(-50%,-50%);

    width:420px;

    height:420px;

    border-radius:50%;

    background:
    radial-gradient(
    circle,
    rgba(255,107,0,.15),
    transparent);

    filter:blur(90px);

}

.jc-fly-footer>*{

    position:relative;

    z-index:2;

}


/*==================================
TITLE
==================================*/

.jc-fly-footer h2{

    font-size:46px;

    line-height:1.3;

    margin-bottom:25px;

}


/*==================================
TEXT
==================================*/

.jc-fly-footer p{

    max-width:900px;

    margin:auto;

    font-size:19px;

    line-height:2;

    color:#D1D5DB;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-benefits{

grid-template-columns:1fr;

}

}

@media(max-width:767px){

.jc-benefits{

margin-top:70px;

gap:24px;

}

.jc-benefit{

padding:30px 25px;

}

.jc-benefit span{

width:62px;

height:62px;

font-size:28px;

}

.jc-benefit h4{

font-size:21px;

}

.jc-benefit p{

font-size:15px;

}

.jc-fly-footer{

padding:45px 25px;

margin-top:70px;

}

.jc-fly-footer h2{

font-size:30px;

}

.jc-fly-footer p{

font-size:16px;

line-height:1.8;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-21d767a *//*==================================================
SECTION 10
PART A
Exclusive Partnership Hero
==================================================*/

.jc-exclusive{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#101827 0%,#162235 100%);

}


/*==================================
BACKGROUND
==================================*/

.jc-exclusive::before{

    content:"";

    position:absolute;

    top:-220px;
    right:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.08),
    transparent);

    filter:blur(120px);

}

.jc-exclusive::after{

    content:"";

    position:absolute;

    left:-180px;
    bottom:-180px;

    width:420px;
    height:420px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(120px);

}


/*==================================
HERO
==================================*/

.jc-exclusive-hero{

    position:relative;

    display:grid;

    grid-template-columns:1.2fr .8fr;

    gap:60px;

    align-items:center;

    margin-top:90px;

    padding:60px;

    border-radius:32px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.18);

    backdrop-filter:blur(20px);

    box-shadow:
    0 25px 70px rgba(0,0,0,.30);

}

.jc-exclusive-hero>*{

    position:relative;

    z-index:2;

}


/*==================================
LOCK
==================================*/

.jc-lock{

    width:90px;

    height:90px;

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:30px;

    font-size:42px;

    border-radius:24px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

}


/*==================================
LEFT
==================================*/

.jc-exclusive-left h2{

    font-size:48px;

    line-height:1.2;

    margin-bottom:25px;

}

.jc-exclusive-left p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
AREA CARD
==================================*/

.jc-area-card{

    position:relative;

    padding:40px;

    border-radius:28px;

    text-align:center;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    transition:.35s;

}

.jc-area-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

}

.jc-map-circle{

    width:90px;

    height:90px;

    display:flex;

    justify-content:center;

    align-items:center;

    margin:0 auto 25px;

    border-radius:50%;

    font-size:42px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:2px solid rgba(255,107,0,.30);

}

.jc-area-card h3{

    font-size:28px;

    margin-bottom:12px;

}

.jc-area-card small{

    display:block;

    color:#D1D5DB;

    margin-bottom:25px;

}


/*==================================
STATUS
==================================*/

.jc-status{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:14px 28px;

    border-radius:100px;

    background:rgba(34,197,94,.12);

    border:1px solid rgba(34,197,94,.30);

    color:#8CFFBE;

    font-weight:700;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-exclusive-hero{

grid-template-columns:1fr;

gap:45px;

}

}

@media(max-width:767px){

.jc-exclusive{

padding:90px 0;

}

.jc-exclusive-hero{

padding:35px 25px;

}

.jc-exclusive-left{

text-align:center;

}

.jc-lock{

margin:0 auto 25px;

}

.jc-exclusive-left h2{

font-size:34px;

}

.jc-exclusive-left p{

font-size:16px;

}

}
/*==================================================
SECTION 10
PART B
Exclusive Benefits
==================================================*/


/*==================================
GRID
==================================*/

.jc-exclusive-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

    margin-top:100px;

}


/*==================================
CARD
==================================*/

.jc-exclusive-card{

    position:relative;

    padding:40px 35px;

    border-radius:28px;

    overflow:hidden;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.28);

}


/*==================================
TOP BORDER
==================================*/

.jc-exclusive-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.jc-exclusive-card:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE EFFECT
==================================*/

.jc-exclusive-card::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-exclusive-card:hover::after{

    left:160%;

}


/*==================================
HOVER
==================================*/

.jc-exclusive-card:hover{

    transform:translateY(-12px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
ICON
==================================*/

.jc-card-icon{

    width:74px;

    height:74px;

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:24px;

    border-radius:22px;

    font-size:34px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

    transition:.35s;

}

.jc-exclusive-card:hover .jc-card-icon{

    transform:rotate(-8deg) scale(1.08);

    box-shadow:
    0 18px 40px rgba(255,107,0,.20);

}


/*==================================
TITLE
==================================*/

.jc-exclusive-card h3{

    font-size:26px;

    margin-bottom:18px;

    transition:.35s;

}

.jc-exclusive-card:hover h3{

    color:var(--primary);

}


/*==================================
TEXT
==================================*/

.jc-exclusive-card p{

    font-size:16px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
FLOAT EFFECT
==================================*/

.jc-exclusive-card:nth-child(1){

animation:exclusiveFloat 7s ease infinite;

}

.jc-exclusive-card:nth-child(2){

animation:exclusiveFloat 7s ease infinite .3s;

}

.jc-exclusive-card:nth-child(3){

animation:exclusiveFloat 7s ease infinite .6s;

}

@keyframes exclusiveFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-exclusive-grid{

grid-template-columns:1fr;

gap:25px;

}

}

@media(max-width:767px){

.jc-exclusive-grid{

margin-top:70px;

}

.jc-exclusive-card{

padding:30px 25px;

}

.jc-card-icon{

width:62px;

height:62px;

font-size:28px;

}

.jc-exclusive-card h3{

font-size:22px;

}

.jc-exclusive-card p{

font-size:15px;

}

}
/*==================================================
SECTION 10
PART C
Agency Comparison
==================================================*/


/*==================================
COMPARISON GRID
==================================*/

.jc-compare-business{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:35px;

    margin-top:100px;

}


/*==================================
COMMON BOX
==================================*/

.jc-company{

    position:relative;

    padding:45px;

    border-radius:30px;

    overflow:hidden;

    backdrop-filter:blur(20px);

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==================================
TOP BAR
==================================*/

.jc-company::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}


/*==================================
STANDARD
==================================*/

.jc-company::before{

    background:
    linear-gradient(
    90deg,
    #6B7280,
    #9CA3AF);

}


/*==================================
FEATURED
==================================*/

.jc-company.featured{

    border:2px solid rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

}

.jc-company.featured::before{

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

}


/*==================================
HOVER
==================================*/

.jc-company:hover{

    transform:translateY(-10px);

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}

.jc-company:hover::before{

    transform:scaleX(1);

}


/*==================================
TITLE
==================================*/

.jc-company h3{

    font-size:30px;

    margin-bottom:30px;

    transition:.35s;

}

.jc-company.featured h3{

    color:var(--primary);

}


/*==================================
LIST
==================================*/

.jc-company ul{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.jc-company li{

    position:relative;

    padding-bottom:16px;

    border-bottom:1px solid rgba(255,255,255,.08);

    font-size:17px;

    line-height:1.8;

    color:#D1D5DB;

}

.jc-company li:last-child{

    border:none;

    padding-bottom:0;

}


/*==================================
FEATURED GLOW
==================================*/

.jc-company.featured{

    box-shadow:
    0 25px 80px rgba(255,107,0,.10);

}

.jc-company.featured:hover{

    box-shadow:
    0 35px 90px rgba(255,107,0,.18);

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-compare-business{

grid-template-columns:1fr;

gap:25px;

}

}

@media(max-width:767px){

.jc-compare-business{

margin-top:70px;

}

.jc-company{

padding:30px 25px;

}

.jc-company h3{

font-size:24px;

margin-bottom:22px;

}

.jc-company li{

font-size:16px;

}

}
/*==================================================
SECTION 10
PART D
Final Message + Scarcity
==================================================*/


/*==================================
BIG MESSAGE
==================================*/

.jc-exclusive-message{

    position:relative;

    margin-top:100px;

    padding:70px 60px;

    text-align:center;

    border-radius:32px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.10),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.20);

    backdrop-filter:blur(20px);

    box-shadow:
    0 30px 80px rgba(0,0,0,.30);

}

.jc-exclusive-message::before{

    content:"";

    position:absolute;

    left:50%;
    top:50%;

    transform:translate(-50%,-50%);

    width:420px;

    height:420px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.15),
    transparent);

    filter:blur(90px);

}

.jc-exclusive-message>*{

    position:relative;

    z-index:2;

}

.jc-exclusive-message h2{

    font-size:48px;

    margin-bottom:15px;

}

.jc-exclusive-message h3{

    font-size:34px;

    color:var(--primary);

    margin-bottom:25px;

}

.jc-exclusive-message p{

    max-width:850px;

    margin:auto;

    font-size:18px;

    line-height:2;

    color:#D1D5DB;

}


/*==================================
SCARCITY BOX
==================================*/

.jc-scarcity{

    position:relative;

    display:grid;

    grid-template-columns:90px 1fr;

    gap:30px;

    align-items:center;

    margin-top:90px;

    padding:45px;

    border-radius:30px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.20);

    backdrop-filter:blur(20px);

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}

.jc-scarcity:hover{

    transform:translateY(-8px);

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
ICON
==================================*/

.jc-scarcity-icon{

    width:80px;

    height:80px;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:38px;

    border-radius:22px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

    animation:scarcityPulse 4s ease infinite;

}

@keyframes scarcityPulse{

0%{

transform:scale(1);

}

50%{

transform:scale(1.08);

}

100%{

transform:scale(1);

}

}


/*==================================
TEXT
==================================*/

.jc-scarcity h3{

    font-size:30px;

    margin-bottom:18px;

}

.jc-scarcity p{

    font-size:17px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-exclusive-message{

padding:45px 25px;

margin-top:70px;

}

.jc-exclusive-message h2{

font-size:30px;

}

.jc-exclusive-message h3{

font-size:24px;

}

.jc-exclusive-message p{

font-size:16px;

line-height:1.8;

}

.jc-scarcity{

grid-template-columns:1fr;

text-align:center;

padding:35px 25px;

margin-top:70px;

}

.jc-scarcity-icon{

margin:auto;

}

.jc-scarcity h3{

font-size:24px;

}

.jc-scarcity p{

font-size:16px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0ca556f *//*==================================================
SECTION 11
PART A
Why Choose JUBU CLOUD
==================================================*/

.jc-why{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#162235 0%,#101827 100%);

}


/*==================================
BACKGROUND
==================================*/

.jc-why::before{

    content:"";

    position:absolute;

    top:-220px;
    right:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.08),
    transparent);

    filter:blur(120px);

}

.jc-why::after{

    content:"";

    position:absolute;

    left:-180px;
    bottom:-180px;

    width:420px;
    height:420px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(120px);

}


/*==================================
GRID
==================================*/

.jc-why-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:28px;

    margin-top:90px;

}


/*==================================
CARD
==================================*/

.jc-why-card{

    position:relative;

    padding:38px;

    border-radius:28px;

    overflow:hidden;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.28);

}


/*==================================
TOP ACCENT
==================================*/

.jc-why-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.jc-why-card:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE
==================================*/

.jc-why-card::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-why-card:hover::after{

    left:160%;

}


/*==================================
HOVER
==================================*/

.jc-why-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
ICON
==================================*/

.jc-why-icon{

    width:74px;

    height:74px;

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:22px;

    font-size:34px;

    border-radius:20px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.18),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.30);

    transition:.35s;

}

.jc-why-card:hover .jc-why-icon{

    transform:rotate(-8deg) scale(1.08);

    box-shadow:
    0 18px 40px rgba(255,107,0,.18);

}


/*==================================
TEXT
==================================*/

.jc-why-card h3{

    font-size:26px;

    margin-bottom:18px;

    transition:.35s;

}

.jc-why-card:hover h3{

    color:var(--primary);

}

.jc-why-card p{

    font-size:16px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
FLOAT
==================================*/

.jc-why-card:nth-child(odd){

animation:whyFloat 7s ease infinite;

}

.jc-why-card:nth-child(even){

animation:whyFloat 7s ease infinite .35s;

}

@keyframes whyFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-why-grid{

grid-template-columns:1fr;

}

}

@media(max-width:767px){

.jc-why{

padding:90px 0;

}

.jc-why-grid{

margin-top:70px;

gap:24px;

}

.jc-why-card{

padding:30px 25px;

}

.jc-why-icon{

width:62px;

height:62px;

font-size:28px;

}

.jc-why-card h3{

font-size:22px;

}

.jc-why-card p{

 font-size:15px;

}

}
/*==================================================
SECTION 11
PART B
Values Section
==================================================*/


/*==================================
VALUES GRID
==================================*/

.jc-values{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:35px;

    margin-top:100px;

}


/*==================================
VALUE CARD
==================================*/

.jc-value-card{

    position:relative;

    padding:50px;

    border-radius:30px;

    overflow:hidden;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==================================
TOP ACCENT
==================================*/

.jc-value-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.jc-value-card:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE EFFECT
==================================*/

.jc-value-card::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-value-card:hover::after{

    left:160%;

}


/*==================================
FEATURED CARD
==================================*/

.jc-value-card.featured{

    border:2px solid rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.10),
    rgba(255,255,255,.04));

    box-shadow:
    0 25px 70px rgba(255,107,0,.12);

}


/*==================================
HOVER
==================================*/

.jc-value-card:hover{

    transform:translateY(-12px);

    border-color:rgba(255,107,0,.35);

    box-shadow:
    0 35px 85px rgba(0,0,0,.40);

}

.jc-value-card.featured:hover{

    box-shadow:
    0 40px 90px rgba(255,107,0,.18);

}


/*==================================
TEXT
==================================*/

.jc-value-card h3{

    font-size:34px;

    margin-bottom:24px;

    transition:.35s;

}

.jc-value-card.featured h3{

    color:var(--primary);

}

.jc-value-card:hover h3{

    color:var(--primary);

}

.jc-value-card p{

    font-size:17px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-values{

grid-template-columns:1fr;

gap:25px;

}

}

@media(max-width:767px){

.jc-values{

margin-top:70px;

}

.jc-value-card{

padding:35px 25px;

}

.jc-value-card h3{

font-size:26px;

margin-bottom:18px;

}

.jc-value-card p{

font-size:16px;

line-height:1.8;

}

}
/*==================================================
SECTION 11
PART C
Final Statement
==================================================*/


/*==================================
FINAL STATEMENT
==================================*/

.jc-final-statement{

    position:relative;

    margin-top:100px;

    padding:80px 70px;

    text-align:center;

    overflow:hidden;

    border-radius:36px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.12),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.25);

    backdrop-filter:blur(20px);

    box-shadow:
    0 35px 90px rgba(0,0,0,.30);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-final-statement::before{

    content:"";

    position:absolute;

    left:50%;

    top:50%;

    transform:translate(-50%,-50%);

    width:520px;

    height:520px;

    border-radius:50%;

    background:
    radial-gradient(
    circle,
    rgba(255,107,0,.16),
    transparent);

    filter:blur(120px);

}

.jc-final-statement>*{

    position:relative;

    z-index:2;

}


/*==================================
TOP ACCENT LINE
==================================*/

.jc-final-statement::after{

    content:"";

    position:absolute;

    left:50%;

    top:0;

    transform:translateX(-50%);

    width:180px;

    height:5px;

    border-radius:20px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

}


/*==================================
TITLE
==================================*/

.jc-final-statement h2{

    font-size:50px;

    line-height:1.25;

    margin-bottom:28px;

    font-weight:800;

    color:#fff;

}


/*==================================
TEXT
==================================*/

.jc-final-statement p{

    max-width:900px;

    margin:auto;

    font-size:20px;

    line-height:2;

    color:#D1D5DB;

}


/*==================================
HOVER
==================================*/

.jc-final-statement{

    transition:.35s;

}

.jc-final-statement:hover{

    transform:translateY(-8px);

    box-shadow:
    0 45px 110px rgba(0,0,0,.38);

}


/*==================================
FADE ANIMATION
==================================*/

.jc-final-statement{

    animation:finalFade .9s ease both;

}

@keyframes finalFade{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:none;

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-final-statement{

padding:50px 25px;

margin-top:70px;

border-radius:28px;

}

.jc-final-statement::after{

width:100px;

}

.jc-final-statement h2{

font-size:32px;

line-height:1.35;

margin-bottom:20px;

}

.jc-final-statement p{

font-size:16px;

line-height:1.9;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f4a6f14 *//*==================================================
SECTION 12
PART A
Onboarding Timeline
==================================================*/

.jc-onboarding{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#101827 0%,#162235 100%);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-onboarding::before{

    content:"";

    position:absolute;

    top:-220px;
    right:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.08),
    transparent);

    filter:blur(120px);

}

.jc-onboarding::after{

    content:"";

    position:absolute;

    left:-180px;
    bottom:-180px;

    width:420px;
    height:420px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(120px);

}


/*==================================
TIMELINE
==================================*/

.jc-onboarding-timeline{

    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:18px;

    margin-top:90px;

}


/*==================================
STEP
==================================*/

.jc-onboard-step{

    flex:1;

    position:relative;

    text-align:center;

    padding:35px 25px;

    border-radius:28px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.28);

}

.jc-onboard-step:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

}


/*==================================
STEP NUMBER
==================================*/

.jc-step-circle{

    width:70px;

    height:70px;

    margin:0 auto 22px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    font-size:24px;

    font-weight:700;

    color:#fff;

    background:
    linear-gradient(
    135deg,
    var(--primary),
    #ff8a33);

    box-shadow:
    0 12px 30px rgba(255,107,0,.30);

}


/*==================================
TEXT
==================================*/

.jc-onboard-step h3{

    font-size:22px;

    margin-bottom:18px;

    transition:.35s;

}

.jc-onboard-step:hover h3{

    color:var(--primary);

}

.jc-onboard-step p{

    font-size:15px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
CONNECTOR
==================================*/

.jc-step-line{

    width:70px;

    height:3px;

    margin-top:70px;

    flex-shrink:0;

    border-radius:30px;

    background:
    linear-gradient(
    90deg,
    rgba(255,107,0,.35),
    rgba(255,107,0,.08));

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:1200px){

.jc-onboarding-timeline{

flex-direction:column;

align-items:stretch;

}

.jc-step-line{

width:3px;

height:50px;

margin:0 auto;

}

}

@media(max-width:767px){

.jc-onboarding{

padding:90px 0;

}

.jc-onboarding-timeline{

margin-top:70px;

}

.jc-onboard-step{

padding:28px 22px;

}

.jc-step-circle{

width:60px;

height:60px;

font-size:20px;

}

.jc-onboard-step h3{

font-size:20px;

}

.jc-onboard-step p{

font-size:15px;

}
/*==================================================
SECTION 12
PART B
Checklist
==================================================*/


/*==================================
CHECKLIST WRAPPER
==================================*/

.jc-checklist{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:40px;

    margin-top:100px;

}


/*==================================
COMMON PANEL
==================================*/

.jc-checklist-left,
.jc-checklist-right{

    position:relative;

    padding:45px;

    border-radius:30px;

    overflow:hidden;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    transition:.35s;

    box-shadow:
    0 20px 60px rgba(0,0,0,.30);

}


/*==================================
TOP BORDER
==================================*/

.jc-checklist-left::before,
.jc-checklist-right::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.jc-checklist-left:hover::before,
.jc-checklist-right:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE EFFECT
==================================*/

.jc-checklist-left::after,
.jc-checklist-right::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-checklist-left:hover::after,
.jc-checklist-right:hover::after{

    left:160%;

}


/*==================================
HOVER
==================================*/

.jc-checklist-left:hover,
.jc-checklist-right:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.35);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    box-shadow:
    0 35px 80px rgba(0,0,0,.40);

}


/*==================================
HEADINGS
==================================*/

.jc-checklist h2{

    font-size:34px;

    margin-bottom:18px;

    transition:.35s;

}

.jc-checklist-left:hover h2,
.jc-checklist-right:hover h2{

    color:var(--primary);

}

.jc-checklist-left p{

    font-size:17px;

    line-height:1.9;

    color:#D1D5DB;

    margin-bottom:30px;

}


/*==================================
LIST
==================================*/

.jc-checklist ul{

    display:flex;

    flex-direction:column;

    gap:18px;

    padding:0;

    margin:0;

    list-style:none;

}


/*==================================
ITEM
==================================*/

.jc-checklist li{

    position:relative;

    padding:16px 18px;

    border-radius:14px;

    background:rgba(255,255,255,.03);

    border:1px solid rgba(255,255,255,.05);

    font-size:16px;

    line-height:1.7;

    color:#D1D5DB;

    transition:.3s;

}

.jc-checklist li:hover{

    transform:translateX(8px);

    background:
    rgba(255,107,0,.08);

    border-color:
    rgba(255,107,0,.25);

    color:#fff;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-checklist{

grid-template-columns:1fr;

gap:30px;

}

}

@media(max-width:767px){

.jc-checklist{

margin-top:70px;

}

.jc-checklist-left,
.jc-checklist-right{

padding:30px 25px;

}

.jc-checklist h2{

font-size:26px;

}

.jc-checklist-left p{

font-size:16px;

}

.jc-checklist li{

font-size:15px;

padding:14px 16px;

}
 
}
}


 /*==================================================
SECTION 12
PART C
Ready Box
==================================================*/


/*==================================
READY BOX
==================================*/

.jc-ready-box{

    position:relative;

    display:grid;

    grid-template-columns:100px 1fr;

    gap:35px;

    align-items:center;

    margin-top:100px;

    padding:60px;

    overflow:hidden;

    border-radius:32px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.10),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.20);

    backdrop-filter:blur(20px);

    box-shadow:
    0 30px 80px rgba(0,0,0,.30);

    transition:.35s;

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-ready-box::before{

    content:"";

    position:absolute;

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    width:450px;

    height:450px;

    border-radius:50%;

    background:
    radial-gradient(
    circle,
    rgba(255,107,0,.15),
    transparent);

    filter:blur(100px);

}

.jc-ready-box>*{

    position:relative;

    z-index:2;

}


/*==================================
HOVER
==================================*/

.jc-ready-box:hover{

    transform:translateY(-8px);

    box-shadow:
    0 40px 100px rgba(0,0,0,.40);

}


/*==================================
ICON
==================================*/

.jc-ready-icon{

    width:90px;

    height:90px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:24px;

    font-size:44px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.20),
    rgba(255,107,0,.06));

    border:2px solid rgba(255,107,0,.35);

    animation:readyPulse 4s ease infinite;

}

@keyframes readyPulse{

0%{

transform:scale(1);

}

50%{

transform:scale(1.08);

}

100%{

transform:scale(1);

}

}


/*==================================
TEXT
==================================*/

.jc-ready-box h2{

    font-size:48px;

    margin-bottom:10px;

    color:#fff;

}

.jc-ready-box h3{

    font-size:32px;

    margin-bottom:22px;

    color:var(--primary);

}

.jc-ready-box p{

    font-size:18px;

    line-height:1.9;

    color:#D1D5DB;

    max-width:760px;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-ready-box{

grid-template-columns:1fr;

text-align:center;

padding:40px 25px;

margin-top:70px;

}

.jc-ready-icon{

margin:auto;

width:75px;

height:75px;

font-size:36px;

}

.jc-ready-box h2{

font-size:32px;

}

.jc-ready-box h3{

font-size:24px;

}

.jc-ready-box p{

font-size:16px;

line-height:1.8;

}

}
/*==================================
CHECKLIST LISTS
==================================*/

.jc-checklist-left ul,
.jc-checklist-right ul{

    list-style:none;

    padding:0;

    margin:30px 0 0;

    display:flex;

    flex-direction:column;

    gap:16px;

}


/*==================================
LIST ITEM
==================================*/

.jc-checklist-left li,
.jc-checklist-right li{

    position:relative;

    display:flex;

    align-items:center;

    gap:14px;

    padding:18px 22px;

    border-radius:16px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    color:#F3F4F6;

    font-size:16px;

    font-weight:500;

    line-height:1.6;

    transition:.35s;

    overflow:hidden;

}


/*==================================
LEFT BORDER
==================================*/

.jc-checklist-left li::before,
.jc-checklist-right li::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:4px;

    height:100%;

    background:linear-gradient(
    180deg,
    var(--primary),
    #ffb56d);

    transform:scaleY(0);

    transform-origin:top;

    transition:.35s;

}


/*==================================
HOVER
==================================*/

.jc-checklist-left li:hover,
.jc-checklist-right li:hover{

    transform:translateX(8px);

    border-color:rgba(255,107,0,.30);

    background:
    linear-gradient(
    90deg,
    rgba(255,107,0,.10),
    rgba(255,255,255,.04));

    box-shadow:
    0 12px 30px rgba(0,0,0,.20);

}

.jc-checklist-left li:hover::before,
.jc-checklist-right li:hover::before{

    transform:scaleY(1);

}


/*==================================
COLUMN DIFFERENCE
==================================*/

.jc-checklist-right{

    border:2px solid rgba(255,107,0,.20);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.06),
    rgba(255,255,255,.04));

}

.jc-checklist-right h2{

    color:var(--primary);

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-checklist-left li,
.jc-checklist-right li{

    padding:16px 18px;

    font-size:15px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-85c173e *//*==================================================
SECTION 13
PART A
FAQ Wrapper
==================================================*/

.jc-faq{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#162235 0%,#101827 100%);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-faq::before{

    content:"";

    position:absolute;

    top:-220px;
    right:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.08),
    transparent);

    filter:blur(120px);

}

.jc-faq::after{

    content:"";

    position:absolute;

    left:-180px;
    bottom:-180px;

    width:420px;
    height:420px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(120px);

}


/*==================================
WRAPPER
==================================*/

.jc-faq-wrapper{

    max-width:950px;

    margin:90px auto 0;

}


/*==================================
FAQ ITEM
==================================*/

.jc-faq-item{

    position:relative;

    margin-bottom:20px;

    overflow:hidden;

    border-radius:22px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    transition:.35s;

    box-shadow:
    0 15px 45px rgba(0,0,0,.25);

}


/*==================================
ACTIVE
==================================*/

.jc-faq-item.active{

    border-color:rgba(255,107,0,.30);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.08),
    rgba(255,255,255,.04));

    box-shadow:
    0 25px 60px rgba(255,107,0,.10);

}


/*==================================
HOVER
==================================*/

.jc-faq-item:hover{

    transform:translateY(-4px);

    border-color:rgba(255,107,0,.25);

}


/*==================================
TOP ACCENT
==================================*/

.jc-faq-item::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.jc-faq-item:hover::before,
.jc-faq-item.active::before{

    transform:scaleX(1);

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-faq{

padding:90px 0;

}

.jc-faq-wrapper{

margin-top:70px;

}

.jc-faq-item{

border-radius:18px;

margin-bottom:16px;

}

}
/*==================================================
SECTION 13
PART B
FAQ Question
==================================================*/


/*==================================
QUESTION BUTTON
==================================*/

.jc-faq-question{

    width:100%;

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:25px;

    padding:28px 35px;

    background:none;

    border:none;

    outline:none;

    cursor:pointer;

    text-align:left;

    color:#fff;

    transition:.35s;

}


/*==================================
QUESTION TEXT
==================================*/

.jc-faq-question span:first-child{

    flex:1;

    font-size:21px;

    font-weight:700;

    line-height:1.5;

    transition:.35s;

}


/*==================================
PLUS BUTTON
==================================*/

.jc-plus{

    flex-shrink:0;

    width:46px;

    height:46px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    font-size:28px;

    font-weight:700;

    color:var(--primary);

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.16),
    rgba(255,107,0,.05));

    border:1px solid rgba(255,107,0,.25);

    transition:.35s;

}


/*==================================
HOVER
==================================*/

.jc-faq-item:hover .jc-faq-question span:first-child{

    color:var(--primary);

}

.jc-faq-item:hover .jc-plus{

    transform:rotate(90deg) scale(1.08);

    box-shadow:
    0 10px 25px rgba(255,107,0,.20);

}


/*==================================
ACTIVE STATE
==================================*/

.jc-faq-item.active .jc-faq-question span:first-child{

    color:var(--primary);

}

.jc-faq-item.active .jc-plus{

    transform:rotate(45deg);

    color:#fff;

    background:linear-gradient(
    135deg,
    var(--primary),
    #ff8a33);

    border-color:transparent;

}


/*==================================
FOCUS
==================================*/

.jc-faq-question:focus-visible{

    outline:2px solid rgba(255,107,0,.5);

    outline-offset:-2px;

    border-radius:18px;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-faq-question{

padding:22px 20px;

gap:15px;

}

.jc-faq-question span:first-child{

font-size:17px;

line-height:1.5;

}

.jc-plus{

width:40px;

height:40px;

font-size:22px;

}


}
/*==================================================
SECTION 13
PART C
FAQ Answer
==================================================*/


/*==================================
ANSWER
==================================*/

.jc-faq-answer{

    max-height:0;

    overflow:hidden;

    opacity:0;

    transition:
    max-height .45s ease,
    opacity .35s ease,
    padding .35s ease;

    padding:0 35px;

}


/*==================================
ACTIVE ANSWER
==================================*/

.jc-faq-item.active .jc-faq-answer{

    max-height:350px;

    opacity:1;

    padding:0 35px 30px;

}


/*==================================
TEXT
==================================*/

.jc-faq-answer p{

    margin:0;

    font-size:17px;

    line-height:1.9;

    color:#D1D5DB;

}


/*==================================
TOP BORDER
==================================*/

.jc-faq-item.active .jc-faq-answer{

    border-top:1px solid rgba(255,255,255,.08);

    margin-top:8px;

    padding-top:25px;

}


/*==================================
FADE ANIMATION
==================================*/

.jc-faq-item.active .jc-faq-answer p{

    animation:faqFade .4s ease;

}

@keyframes faqFade{

from{

opacity:0;

transform:translateY(12px);

}

to{

opacity:1;

transform:translateY(0);

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-faq-answer{

padding:0 20px;

}

.jc-faq-item.active .jc-faq-answer{

padding:0 20px 22px;

padding-top:20px;

}

.jc-faq-answer p{

font-size:15px;

line-height:1.8;

}

}
/*==================================================
SECTION 13
PART D
FAQ Footer
==================================================*/


/*==================================
BOTTOM CTA
==================================*/

.jc-faq-bottom{

    position:relative;

    margin-top:100px;

    padding:70px 60px;

    text-align:center;

    overflow:hidden;

    border-radius:34px;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.10),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.22);

    backdrop-filter:blur(20px);

    box-shadow:
    0 30px 90px rgba(0,0,0,.30);

    transition:.35s;

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-faq-bottom::before{

    content:"";

    position:absolute;

    left:50%;

    top:50%;

    transform:translate(-50%,-50%);

    width:480px;

    height:480px;

    border-radius:50%;

    background:
    radial-gradient(
    circle,
    rgba(255,107,0,.16),
    transparent);

    filter:blur(100px);

}

.jc-faq-bottom>*{

    position:relative;

    z-index:2;

}


/*==================================
TOP ACCENT
==================================*/

.jc-faq-bottom::after{

    content:"";

    position:absolute;

    left:50%;

    top:0;

    transform:translateX(-50%);

    width:160px;

    height:5px;

    border-radius:30px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

}


/*==================================
TITLE
==================================*/

.jc-faq-bottom h3{

    font-size:42px;

    line-height:1.3;

    margin-bottom:24px;

    color:#fff;

}


/*==================================
TEXT
==================================*/

.jc-faq-bottom p{

    max-width:820px;

    margin:auto;

    font-size:18px;

    line-height:2;

    color:#D1D5DB;

}


/*==================================
HOVER
==================================*/

.jc-faq-bottom:hover{

    transform:translateY(-8px);

    box-shadow:
    0 45px 110px rgba(0,0,0,.38);

}


/*==================================
FADE
==================================*/

.jc-faq-bottom{

    animation:faqFooterFade .8s ease both;

}

@keyframes faqFooterFade{

from{

opacity:0;

transform:translateY(35px);

}

to{

opacity:1;

transform:none;

}

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-faq-bottom{

padding:45px 25px;

margin-top:70px;

border-radius:26px;

}

.jc-faq-bottom::after{

width:100px;

}

.jc-faq-bottom h3{

font-size:28px;

margin-bottom:18px;

}

.jc-faq-bottom p{

font-size:16px;

line-height:1.8;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a43384d *//*==================================================
SECTION 14
PART A
Final CTA
==================================================*/

.jc-final{

    position:relative;

    padding:140px 0;

    overflow:hidden;

    background:
    linear-gradient(180deg,#101827 0%,#162235 100%);

}


/*==================================
BACKGROUND GLOW
==================================*/

.jc-final::before{

    content:"";

    position:absolute;

    top:-220px;
    left:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,107,0,.10),
    transparent);

    filter:blur(120px);

}

.jc-final::after{

    content:"";

    position:absolute;

    right:-180px;
    bottom:-180px;

    width:450px;
    height:450px;

    border-radius:50%;

    background:
    radial-gradient(circle,
    rgba(255,255,255,.03),
    transparent);

    filter:blur(120px);

}


/*==================================
FINAL BOX
==================================*/

.jc-final-box{

    position:relative;

    text-align:center;

    padding:90px 70px;

    border-radius:40px;

    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(255,107,0,.12),
    rgba(255,255,255,.04));

    border:1px solid rgba(255,107,0,.22);

    backdrop-filter:blur(20px);

    box-shadow:
    0 40px 120px rgba(0,0,0,.35);

}

.jc-final-box>*{

    position:relative;

    z-index:2;

}


/*==================================
TOP TAG
==================================*/

.jc-final-tag{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:14px 28px;

    border-radius:100px;

    margin-bottom:35px;

    font-size:14px;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

    color:var(--primary);

    background:
    rgba(255,107,0,.12);

    border:1px solid rgba(255,107,0,.25);

}


/*==================================
TITLE
==================================*/

.jc-final-box h2{

    font-size:60px;

    line-height:1.2;

    max-width:900px;

    margin:0 auto 30px;

}


/*==================================
TEXT
==================================*/

.jc-final-box p{

    max-width:820px;

    margin:0 auto;

    font-size:20px;

    line-height:2;

    color:#D1D5DB;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-final{

padding:90px 0;

}

.jc-final-box{

padding:50px 25px;

border-radius:28px;

}

.jc-final-tag{

font-size:12px;

padding:12px 20px;

}

.jc-final-box h2{

font-size:34px;

}

.jc-final-box p{

font-size:16px;

line-height:1.8;

}
/*==================================================
SECTION 14
PART B
Feature Grid
==================================================*/


/*==================================
GRID
==================================*/

.jc-final-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:28px;

    margin:70px 0;

}


/*==================================
ITEM
==================================*/

.jc-final-item{

    position:relative;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    padding:40px 25px;

    overflow:hidden;

    border-radius:26px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(20px);

    transition:.35s;

    box-shadow:
    0 18px 50px rgba(0,0,0,.28);

}


/*==================================
TOP BORDER
==================================*/

.jc-final-item::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:
    linear-gradient(
    90deg,
    var(--primary),
    #ffb56d);

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.jc-final-item:hover::before{

    transform:scaleX(1);

}


/*==================================
SHINE EFFECT
==================================*/

.jc-final-item::after{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:45%;

    height:100%;

    background:
    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent);

    transform:skewX(-20deg);

    transition:.8s;

}

.jc-final-item:hover::after{

    left:160%;

}


/*==================================
EMOJI
==================================*/

.jc-final-item{

    font-size:42px;

}


/*==================================
TITLE
==================================*/

.jc-final-item h3{

    margin-top:20px;

    font-size:22px;

    line-height:1.5;

    color:#fff;

    transition:.35s;

}

.jc-final-item:hover h3{

    color:var(--primary);

}


/*==================================
HOVER
==================================*/

.jc-final-item:hover{

    transform:translateY(-10px);

    border-color:rgba(255,107,0,.30);

    background:
    linear-gradient(
    180deg,
    rgba(255,107,0,.10),
    rgba(255,255,255,.04));

    box-shadow:
    0 35px 80px rgba(255,107,0,.15);

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.jc-final-grid{

grid-template-columns:repeat(2,1fr);

gap:22px;

}

}

@media(max-width:767px){

.jc-final-grid{

grid-template-columns:1fr;

margin:50px 0;

}

.jc-final-item{

padding:30px 20px;

font-size:36px;

}

.jc-final-item h3{

font-size:20px;

margin-top:16px;

}

}
}
/*==================================================
SECTION 14
PART C
Buttons & Bottom Note
==================================================*/


/*==================================
BUTTON GROUP
==================================*/

.jc-final-buttons{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:25px;

    flex-wrap:wrap;

    margin-top:70px;

}


/*==================================
COMMON BUTTON
==================================*/

.jc-btn-primary,
.jc-btn-secondary{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    min-width:260px;

    height:64px;

    padding:0 40px;

    border-radius:100px;

    text-decoration:none;

    font-size:17px;

    font-weight:700;

    transition:.35s;

}


/*==================================
PRIMARY
==================================*/

.jc-btn-primary{

    color:#fff;

    background:linear-gradient(
    135deg,
    var(--primary),
    #ff8a33);

    box-shadow:
    0 18px 45px rgba(255,107,0,.30);

}

.jc-btn-primary:hover{

    transform:translateY(-6px);

    box-shadow:
    0 30px 70px rgba(255,107,0,.40);

}


/*==================================
SECONDARY
==================================*/

.jc-btn-secondary{

    color:#fff;

    border:2px solid rgba(255,255,255,.12);

    background:rgba(255,255,255,.04);

    backdrop-filter:blur(20px);

}

.jc-btn-secondary:hover{

    transform:translateY(-6px);

    border-color:rgba(255,107,0,.40);

    background:
    rgba(255,107,0,.10);

}


/*==================================
BOTTOM NOTE
==================================*/

.jc-final-box .jc-bottom-note{

    margin-top:60px;

    padding-top:35px;

    border-top:1px solid rgba(255,255,255,.08);

    max-width:760px;

    margin-left:auto;

    margin-right:auto;

    font-size:17px;

    line-height:1.9;

    color:#9CA3AF;

}


/*==================================
RESPONSIVE
==================================*/

@media(max-width:767px){

.jc-final-buttons{

flex-direction:column;

gap:18px;

margin-top:45px;

}

.jc-btn-primary,
.jc-btn-secondary{

width:100%;

min-width:100%;

height:58px;

font-size:16px;

}

.jc-final-box .jc-bottom-note{

margin-top:40px;

padding-top:25px;

font-size:15px;

line-height:1.8;

}

}/* End custom CSS */
/* Start custom CSS *//*======================================
JUBU CLOUD DESIGN SYSTEM
======================================*/

:root{

    /* Brand */

    --primary:#FF6B00;
    --primary-light:#FF8C33;
    --primary-dark:#E85C00;

    /* Background */

    --bg:#111827;
    --bg-light:#1F2937;
    --bg-card:rgba(255,255,255,.04);

    /* Text */

    --white:#FFFFFF;
    --text:#E5E7EB;
    --muted:#9CA3AF;

    /* Border */

    --border:rgba(255,255,255,.08);

    /* Radius */

    --radius:24px;
    --radius-small:18px;

    /* Shadow */

    --shadow:
    0 20px 60px rgba(0,0,0,.35);

    --shadow-hover:
    0 30px 80px rgba(0,0,0,.45);

    /* Animation */

    --transition:.35s ease;

    /* Width */

    --container:1250px;

}


/*======================================
RESET
======================================*/

*{

margin:0;
padding:0;
box-sizing:border-box;

}

html{

scroll-behavior:smooth;

}

body{

font-family:'Inter',sans-serif;

background:var(--bg);

color:var(--white);

line-height:1.7;

overflow-x:hidden;

-webkit-font-smoothing:antialiased;

}

img{

display:block;

max-width:100%;

height:auto;

}

a{

text-decoration:none;

color:inherit;

}

ul{

list-style:none;

padding:0;

margin:0;

}


/*======================================
CONTAINER
======================================*/

.jc-container{

width:100%;

max-width:var(--container);

margin:auto;

padding:0 25px;

position:relative;

z-index:2;

}


/*======================================
SECTION
======================================*/

section{

position:relative;

padding:120px 0;

overflow:hidden;

}


/*======================================
TYPOGRAPHY
======================================*/

h1{

font-size:64px;

font-weight:800;

line-height:1.1;

letter-spacing:-2px;

}

h2{

font-size:52px;

font-weight:800;

line-height:1.15;

letter-spacing:-1px;

margin-bottom:20px;

}

h3{

font-size:28px;

font-weight:700;

line-height:1.3;

}

h4{

font-size:22px;

font-weight:700;

}

p{

font-size:18px;

color:var(--text);

line-height:1.9;

}

strong{

color:#fff;

font-weight:700;

}


/*======================================
ORANGE TEXT
======================================*/

h1 span,
h2 span,
h3 span{

color:var(--primary);

}


/*======================================
SECTION TITLE
======================================*/

.jc-section-heading{

max-width:900px;

margin:0 auto 80px;

text-align:center;

}

.jc-section-heading h2{

margin:20px 0;

}

.jc-section-heading p{

font-size:20px;

color:var(--text);

}


/*======================================
TAG
======================================*/

.jc-tag{

display:inline-flex;

align-items:center;

justify-content:center;

padding:12px 24px;

border-radius:100px;

background:rgba(255,107,0,.10);

border:1px solid rgba(255,107,0,.30);

color:var(--primary);

font-size:13px;

font-weight:700;

letter-spacing:2px;

text-transform:uppercase;

}


/*======================================
BUTTONS
======================================*/

.jc-btn-primary{

display:inline-flex;

align-items:center;

justify-content:center;

padding:18px 36px;

border-radius:100px;

background:var(--primary);

color:#fff;

font-size:17px;

font-weight:700;

transition:var(--transition);

box-shadow:0 15px 35px rgba(255,107,0,.25);

}

.jc-btn-primary:hover{

transform:translateY(-4px);

background:var(--primary-light);

}

.jc-btn-secondary{

display:inline-flex;

align-items:center;

justify-content:center;

padding:18px 36px;

border-radius:100px;

background:transparent;

border:1px solid var(--border);

color:#fff;

transition:var(--transition);

}

.jc-btn-secondary:hover{

background:rgba(255,255,255,.05);

transform:translateY(-4px);

}


/*======================================
COMMON CARD
======================================*/

.jc-card{

background:var(--bg-card);

border:1px solid var(--border);

border-radius:var(--radius);

backdrop-filter:blur(18px);

box-shadow:var(--shadow);

transition:var(--transition);

}

.jc-card:hover{

transform:translateY(-8px);

box-shadow:var(--shadow-hover);

border-color:rgba(255,107,0,.30);

}


/*======================================
GRID HELPERS
======================================*/

.jc-grid-2{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:40px;

}

.jc-grid-3{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.jc-grid-4{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

}


/*======================================
GLASS GLOW
======================================*/

.jc-glow{

position:absolute;

border-radius:50%;

filter:blur(120px);

pointer-events:none;

opacity:.15;

}


/*======================================
UTILITIES
======================================*/

.text-center{

text-align:center;

}

.mb-20{

margin-bottom:20px;

}

.mb-30{

margin-bottom:30px;

}

.mb-40{

margin-bottom:40px;

}

.mb-60{

margin-bottom:60px;

}

.mt-60{

margin-top:60px;

}


/*======================================
RESPONSIVE
======================================*/

@media(max-width:1100px){

.jc-grid-4{

grid-template-columns:repeat(2,1fr);

}

.jc-grid-3{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

section{

padding:80px 0;

}

.jc-container{

padding:0 20px;

}

h1{

font-size:40px;

}

h2{

font-size:34px;

}

h3{

font-size:24px;

}

p{

font-size:16px;

}

.jc-grid-2,
.jc-grid-3,
.jc-grid-4{

grid-template-columns:1fr;

}

.jc-section-heading{

margin-bottom:60px;

}

.jc-section-heading p{

font-size:17px;

}

}/* End custom CSS */