:root{
--primary:#ac3124;
--secondary:#3e0960;
--dark:#222;
--light:#ffffff;
}

*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

html{scroll-behavior:smooth;}
body{background:#ffffff;color:#333;overflow-x:hidden;}

.container{
width:90%;
max-width:1400px;
margin:auto;
}

/* HEADER DONE */

header{
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #ffffff;
z-index: 9999;
box-shadow: 0 2px 20px rgba(0,0,0,0.08);
}

/* Navbar */
.navbar{
display:flex;
justify-content:space-between;
align-items:center;
min-height:90px;
}

body{
    padding-top: 100px;
}

.navbar{
display:flex;
justify-content:space-between;
align-items:center;
width:100%;
}

.logo img{
height:60px;
margin-left: -30px;
}

.nav-links{
display:flex;
align-items:center;
gap:35px;
list-style:none;
margin:0;
padding:0;
}

.nav-links a{
text-decoration:none;
color:#3e0960;
font-weight:600;
transition:.3s;
}

.nav-links a:hover{
color:#ac3124;
}

.nav-links a.active{
    color:#ac3124;
}

/* Navbar Buttons DONE */
.nav-buttons{
display:flex;
gap:20px;
align-items:center;
}

.nav-btn{
position:relative;
display:inline-block;
padding:8px 20px;
border-radius:50px;
text-decoration:none;
font-weight:450;
font-size:13px;
color:#fff;
overflow:hidden;
z-index:1;
transition:.4s ease;
}

/* Login Button */
.login-btn{
color:  #ac3124;;
background: #ffffff;
border:2px solid #ac3124;
}

.login-btn::before{
content:"";
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
transition:.4s ease;
z-index:-1;
}  

.login-btn:hover::before{
left:0;
}

.login-btn:hover{
color:#ac3124;
transform:translateY(-3px);
box-shadow:0 10px 25px rgba(107,31,166,.25);
}
/* Get Started Button */
.start-btn{
background:#ac3124;
border:2px solid #ac3124;
}

/* Hover Fill Effect */

.start-btn::before{
content:"";
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
transition:.4s ease;
z-index:-1;
}

.start-btn:hover::before{
left:0;
}

.start-btn:hover{
color:#fff;
transform:translateY(-3px);
box-shadow:0 10px 25px rgba(107,31,166,.25);
}

/*=========================================
            HERO SECTION
=========================================*/

.hero{
    position:relative;
    overflow:hidden;
    
    background-image:url("../images/pv-consulting-bg.png");
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    padding:70px 0 35px;
    font-family:'Poppins',sans-serif;
}

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

.hero .container{

    width:90%;
    max-width:1320px;

    margin:auto;

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

    gap:50px;

    position:relative;
    z-index:5;
}


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

.hero-bg{

    position:absolute;
    inset:0;
    overflow:hidden;
}

.shape{

    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,.025);
}

.shape1{

    width:900px;
    height:900px;

    left:-420px;
    top:-350px;
}

.shape2{

    width:850px;
    height:850px;

    right:-350px;
    bottom:-420px;
}

.shape3{

    width:700px;
    height:700px;

    right:18%;
    top:-280px;
}


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

.hero-content{

    flex:1;
    max-width:560px;
}

.hero-tag{

    display:inline-block;

    color:#3e0960;

    font-size:14px;
    font-weight:600;

    letter-spacing:1.1px;
    text-transform:uppercase;

    margin-bottom:18px;
}

.hero-content h1{

    color:#ac3124;

    font-size:38px;
    font-weight:700;

    line-height:1.2;

    margin-bottom:20px;
}

.hero-content h1 span{

    color:#3e0960;
}


/*=========================================
            BUTTONS
=========================================*/

.hero-buttons{

    display:flex;
    align-items:center;

    gap:20px;
}

.btn-primary{

    background:#ffffff;
    color:#3e0960;

    padding:10px 25px;

    border-radius:40px;

    text-decoration:none;

    font-weight:700;
    font-size: 16px;
    transition:.35s;
}

.btn-primary:hover{

    background:#ffffff;
    transform:translateY(-4px);
}

/*=========================================
        HERO FEATURES
=========================================*/

.hero-features{

    display:flex;
    justify-content:space-between;
    align-items:flex-start;

    margin-top:200px;
    padding-top:40px;

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

    gap:8px;
}

.feature-item{

    display:flex;
    align-items:flex-start;

    flex:1;

    gap:6px;
}

.feature-icon{

    width:38px;
    height:38px;
    background: #3e0960;
    min-width:32px;

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

    color:#ffffff;

    font-size:22px;

    transition:.35s ease;
}

.feature-text h4{

    color:#3e0960;

    font-size:15px;

    font-weight:600;

    margin-bottom:6px;

    line-height:1.3;
}


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

@media(max-width:992px){

.hero-features{

    flex-wrap:wrap;

    gap:30px;
}

.feature-item{

    flex:0 0 calc(50% - 15px);
}

}


@media(max-width:576px){

.hero-features{

    flex-direction:column;

    gap:25px;

    margin-top:40px;
}

.feature-item{

    width:100%;
}

.feature-icon{

    width:38px;
    height:38px;

    min-width:38px;

    font-size:20px;
}

.feature-text h4{

    font-size:16px;
}

.feature-text p{

    font-size:13px;
}

}
/*=========================================
        HOVER EFFECTS
=========================================*/

.main-image,
.small-image{

    transition:.4s;
}

.main-image:hover{

    transform:translateY(-8px);
}

.small-image:hover{

    transform:translateY(-8px);
}

.main-image img,
.small-image img{

    transition:.6s;
}

.main-image:hover img,
.small-image:hover img{

    transform:scale(1.08);
}


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

@media(max-width:992px){

.hero{

    padding:70px 0;
}

.hero .container{

    flex-direction:column;

    text-align:center;
}

.hero-content{

    max-width:100%;
}

.hero-buttons{

    justify-content:center;
}

.hero-images{

    width:420px;
    height:420px;

    margin-top:20px;
}

.main-image{

    width:330px;
    height:330px;
}

.small-image{

    width:180px;
    height:190px;
}

.hero-features{

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

    margin-top:50px;
}

}


@media(max-width:768px){

.hero-content h1{

    font-size:36px;
}

.hero-content p{

    font-size:16px;
}

.hero-buttons{

    flex-direction:column;
}

.btn-primary{

    width:100%;
    text-align:center;
}

.hero-images{

    width:320px;
    height:350px;
}

.main-image{

    width:260px;
    height:260px;
}

.small-image{

    width:150px;
    height:160px;
}

.hero-features{

    grid-template-columns:1fr;
}
}

/*=========================================
            ABOUT SECTION
=========================================*/

.about-section{
    padding:90px 0;
    background:#ffffff;
    font-family:'Poppins',sans-serif;
}

.about-section .container{
    width:90%;
    max-width:1280px;
    margin:auto;

    display:grid;
    grid-template-columns:42% 58%;
    gap:70px;
    align-items:flex-start;
}


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

.about-subtitle{
    display:block;
    color:#798392;
    font-size:17px;
    font-weight:500;
    margin-bottom:18px;
}

.about-left h2{
    font-size:30px;
    line-height:1.5;
    font-weight:600;
    color:#101828;
    margin-bottom:35px;
}

.about-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:10px 30px;

    background:#ac3124;
    color:#fffdfd;

    text-decoration:none;
    font-weight:600;
    border-radius:6px;

    transition:.35s;
}

.about-btn:hover{
    background:#101828;
    color:#fff;
}


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

.about-right{
    width:100%;
}


/*=========================================
            TAB BUTTONS
=========================================*/

.about-tabs{

    display:flex;
    align-items:center;

    margin-bottom:35px;

    border-bottom:1px solid #ececec;
}

.tab-btn{

    background:none;
    border:none;

    cursor:pointer;

    padding:0 28px 18px;

    font-size:22px;
    font-weight:500;

    color:#9ca3af;

    position:relative;

    transition:.3s;
}

.tab-btn:first-child{
    padding-left:0;
}

.tab-btn.active{

    color:#111827;
}

.tab-btn.active::after{

    content:"";

    position:absolute;

    left:0;
    bottom:-1px;

    width:100%;
    height:3px;

    background:#ac3124;
}

.tab-btn:hover{

    color:#333
}


/*=========================================
            TAB CONTENT
=========================================*/

.tab-content{

    display:none;
}

.tab-content.active{

    display:block;

    animation:fade .35s ease;
}

@keyframes fade{

    from{
        opacity:0;
        transform:translateY(12px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}


/*=========================================
            TOPICS
=========================================*/

.topic{

    margin-bottom:28px;
}

.topic:last-child{

    margin-bottom:0;
}

.topic h4{

    color:#ac3124;

    font-size:20px;
    font-weight:600;

    margin-bottom:10px;
}

.topic p{

    color:#5b6472;

    font-size:16px;

    line-height:1.8;
}


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

@media(max-width:992px){

.about-section{

    padding:70px 0;
}

.about-section .container{

    grid-template-columns:1fr;

    gap:50px;
}

.about-left{

    text-align:center;
}

.about-tabs{

    justify-content:center;
}

}


@media(max-width:768px){

.about-left h2{

    font-size:34px;
}

.about-tabs{

    flex-direction:column;
    align-items:flex-start;

    border-bottom:none;

    gap:15px;
}

.tab-btn{

    padding:0 0 10px;
    font-size:18px;
}

.topic h4{

    font-size:18px;
}

.topic p{

    font-size:15px;
}

.about-btn{

    width:100%;
}

}

/*=========================================
        PREMIUM FINISHING EFFECTS
=========================================*/

/* Left heading animation */

.about-left{

    animation:slideLeft .9s ease;
}

/* Right content animation */

.about-right{

    animation:slideRight .9s ease;
}

@keyframes slideLeft{

    from{

        opacity:0;
        transform:translateX(-40px);
    }

    to{

        opacity:1;
        transform:translateX(0);
    }
}

@keyframes slideRight{

    from{

        opacity:0;
        transform:translateX(40px);
    }

    to{

        opacity:1;
        transform:translateX(0);
    }
}


/*=========================================
        TAB DIVIDERS
=========================================*/

.tab-btn{

    border-right:1px solid #e6e6e6;
}

.tab-btn:last-child{

    border-right:none;
}


/*=========================================
        BUTTON EFFECT
=========================================*/

.about-btn{

    box-shadow:0 15px 30px rgba(255,200,61,.25);
}

.about-btn:hover{

    transform:translateY(-4px);

    box-shadow:0 20px 40px rgba(255,200,61,.40);
}


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

.tab-btn{

    transition:.35s;
}

.tab-btn:hover{

    color:#111;
}

.tab-btn.active{

    font-weight:600;
}


/*=========================================
        TOPIC SPACING
=========================================*/

.topic{

    transition:.35s;
}

.topic:hover{

    transform:translateX(6px);
}


/*=========================================
        BETTER PARAGRAPH READABILITY
=========================================*/

.topic p{

    max-width:650px;
}


/*=========================================
        BETTER BUTTON ALIGNMENT
=========================================*/

.about-btn{

    min-width:180px;
}


/*=========================================
        LARGE DESKTOP
=========================================*/

@media(min-width:1500px){

.about-section .container{

    max-width:1400px;
}

.about-left h2{

    font-size:46px;
}

}


/*=========================================
        SMALL LAPTOP
=========================================*/

@media(max-width:1200px){

.about-section .container{

    gap:55px;
}

.about-left h2{

    font-size:38px;
}

.tab-btn{

    font-size:20px;
}

}


/*=========================================
        TABLET
=========================================*/

@media(max-width:992px){

.about-left{

    text-align:center;
}

.about-btn{

    margin:auto;
}

.about-tabs{

    justify-content:center;
}

.topic{

    text-align:left;
}

}


/*=========================================
        MOBILE
=========================================*/

@media(max-width:576px){

.about-section{

    padding:60px 0;
}

.about-left h2{

    font-size:30px;
}

.about-subtitle{

    font-size:15px;
}

.about-tabs{

    width:100%;
}

.tab-btn{

    width:100%;

    border-right:none;

    border-bottom:1px solid #ececec;

    text-align:left;

    padding:12px 0;

    font-size:17px;
}

.tab-btn.active::after{

    display:none;
}

.topic h4{

    font-size:17px;
}

.topic p{

    font-size:15px;

    line-height:1.7;
}

.about-btn{

    width:100%;
}

}

/*=========================
    SERVICES
===========================*/

.pv-services{

    padding:100px 8%;
    background:#fff;
}

.section-heading{

    text-align:center;
    margin-bottom:70px;
}

.section-heading span{

    color:#AC3124;
    font-weight:700;
    letter-spacing:2px;
    margin-top: 10px;
}

.section-heading h3{

    font-size:40px;
    color:#3E0960;
    margin:15px 0;
}

.section-heading p{

    width:60%;
    margin:auto;
    line-height:1.5;
    font-size:15px;
    color:#666;
}

.services-wrapper{

    display:flex;
    gap:40px;
    background:#fff;
    border-radius:20px;
    box-shadow:0 15px 50px rgba(0,0,0,.08);
    overflow:hidden;
}

.service-menu{

    width:28%;
    background:#F8F5FC;
    padding:35px;
    display:flex;
    flex-direction:column;
    gap:18px;
}

.service-btn{

    padding:20px;
    border:none;
    background:white;
    border-radius:15px;
    text-align:left;
    cursor:pointer;
    font-size:14px;
    font-weight:600;
    color:#3E0960;
    transition:.35s;
}

.service-btn:hover{

    transform:translateX(8px);
}

.service-btn.active{

    background:#3E0960;
    color:white;
}

.service-content{

    width:72%;
    padding:50px;
    position:relative;
}

.service-box{

    display:none;
    animation:fade .4s ease;
}

.service-box.active{

    display:block;
}

.service-box h3{

    font-size:24px;
    color:#3E0960;
    margin-bottom:4px;
}

.service-box p{
    font-size: 14px;
    color:#666;
    line-height:1.5;
    margin-bottom:16px;
}

.service-list{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
    margin-bottom:35px;
}

.service-list div{

    background:#F8F5FC;
    padding:14px 18px;
    border-radius:10px;
}

.service-box img{

    width:320px;
    float:right;
}

@keyframes fade{

    from{

        opacity:0;
        transform:translateY(20px);
    }

    to{

        opacity:1;
        transform:translateY(0);
    }

}


/*=========================================
        INDUSTRIES SECTION
=========================================*/

.industries{
    padding:80px 0;
    background:#ffffff;
    font-family:'Poppins',sans-serif;
}

.industries .container{
    width:90%;
    max-width:1200px;
    margin:auto;
}


/*=========================================
        SECTION HEADING
=========================================*/

.section-heading{
    text-align:center;
    max-width:760px;
    margin:0 auto 60px;
}

.section-subtitle{
    display:inline-block;
    color:#ac3124;
    font-size:15px;
    font-weight:600;
    letter-spacing:1px;
    text-transform:uppercase;
    margin-bottom:8px;
}

.section-heading h2{
    font-size:38px;
    color:#3e0960;
    font-weight:6800;
    margin-bottom:8px;
    line-height:1.3;
}

.section-heading p{
    color:#6d7787;
    font-size:16px;
    line-height:1.3;
}


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

.industry-grid{

    display:grid;

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

    gap:16px;
}


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

.industry-card{

    height:125px;

    background:#ffffff;

    border:1px solid #3e0960;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    transition:.35s ease;

    cursor:pointer;
}


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

.industry-icon{

    width: 55px;
    height:55px;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#3e0960;

    font-size:24px;

    margin-bottom:18px;

    transition:.35s;
}


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

.industry-card h3{

    font-size:18px;

    font-weight:600;

    color:#3e0960;

    transition:.35s;
}


/*=========================================
        TABLET
=========================================*/

@media(max-width:992px){

.industry-grid{

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

.section-heading{

    margin-bottom:50px;
}

.section-heading h2{

    font-size:34px;
}

}


/*=========================================
        MOBILE
=========================================*/

@media(max-width:768px){

.industries{

    padding:70px 0;
}

.industry-grid{

    grid-template-columns:1fr;

    gap:18px;
}

.section-heading{

    margin-bottom:40px;
}

.section-heading h2{

    font-size:30px;
}

.section-heading p{

    font-size:15px;
}

.industry-card{

    height:130px;
}

.industry-card h3{

    font-size:17px;
}

.industry-icon{

    font-size:22px;
}

}

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

@media(max-width:992px){

.core-features{

    padding:70px 0;
}

.core-features .container{

    grid-template-columns:1fr;

    row-gap:50px;
}

.feature-column{

    gap:45px;
}

}


@media(max-width:768px){

.feature-box{

    gap:18px;
}

.feature-icon{

    width:50px;
    height:50px;

    min-width:50px;

    font-size:20px;
}

.feature-content h3{

    font-size:22px;
}

.feature-content p{

    font-size:15px;
    line-height:1.8;
}

}


@media(max-width:480px){

.core-features{

    padding:60px 0;
}

.feature-box{

    flex-direction:column;

    gap:15px;
}

.feature-content h3{

    font-size:20px;
}

.feature-content p{

    font-size:14px;
}

.feature-icon{

    width:48px;
    height:48px;

    min-width:48px;

    border-radius:10px;
}

}

/*=========================================
        PREMIUM FINISHING EFFECTS
=========================================*/

/* Smooth animation when section loads */

.industry-card{
    animation:fadeUp .7s ease both;
}

.industry-card:nth-child(1){animation-delay:.1s;}
.industry-card:nth-child(2){animation-delay:.2s;}
.industry-card:nth-child(3){animation-delay:.3s;}
.industry-card:nth-child(4){animation-delay:.4s;}
.industry-card:nth-child(5){animation-delay:.5s;}
.industry-card:nth-child(6){animation-delay:.6s;}

@keyframes fadeUp{

    from{
        opacity:0;
        transform:translateY(40px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}




/*=========================================
        LARGE DESKTOP
=========================================*/

@media(min-width:1400px){

.industries .container{

    max-width:1320px;
}

}


/*=========================================
        SMALL LAPTOP
=========================================*/

@media(max-width:1200px){

.industry-grid{

    gap:18px;
}

}


/*=========================================
        TABLET
=========================================*/

@media(max-width:992px){

.section-heading{

    max-width:650px;
}

.industry-card{

    height:120px;
}

}


/*=========================================
        MOBILE
=========================================*/

@media(max-width:576px){

.industries{

    padding:60px 0;
}

.section-heading{

    margin-bottom:35px;
}

.section-heading h2{

    font-size:28px;
}

.section-heading p{

    font-size:14px;
    line-height:1.8;
}

.industry-card{

    height:115px;
}

.industry-icon{

    font-size:20px;

    margin-bottom:14px;
}

.industry-card h3{

    font-size:16px;
}

}


/*=========================================
        ACCESSIBILITY
=========================================*/

@media(prefers-reduced-motion:reduce){

*{

    animation:none !important;
    transition:none !important;
}

}

/*=========================================
        PRICING CTA SECTION
=========================================*/

.pricing-cta{
    position:relative;
    overflow:hidden;
    padding:65px 0;
    background:linear-gradient(135deg,#ac3124 20%,#3e0960 100%);
    font-family:'Poppins',sans-serif;
}

.pricing-cta .container{

    width:100%;
    max-width:1500px;

    margin:auto;

    position:relative;
    z-index:2;
}


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

.pricing-content{

    max-width:900px;

    margin:auto;

    text-align:center;
}

.pricing-subtitle{

    display:inline-block;

    color:#fffdfd;

    font-size:22px;

    font-weight:800;

    letter-spacing:1.5px;

    text-transform:uppercase;

    margin-bottom:18px;
}

.pricing-content h2{

    color:#ffffff;

    font-size:18px;

    font-weight:600;

    line-height:1.6;

    margin-bottom:22px;
}

/*=========================================
        BUTTON
=========================================*/

.pricing-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:14px;

    text-decoration:none;

    background:#fffdfd;

    color:#3e0960;

    padding:10px 30px;

    border-radius:8px;

    font-size:15px;

    font-weight:600;

    transition:.35s;


}

.pricing-btn i{

    transition:.35s;
}

.pricing-btn:hover{

    transform:translateY(-5px);

    background:#ffffff;

    box-shadow:0 18px 35px rgba(255, 255, 254, 0.35);
}

.pricing-btn:hover i{

    transform:translateX(6px);
}


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

.pricing-bg{

    position:absolute;

    inset:0;

    overflow:hidden;
}

.pricing-shape{

    position:absolute;

    border-radius:50%;

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

.shape-1{

    width:850px;
    height:850px;

    left:-420px;
    top:-380px;
}

.shape-2{

    width:700px;
    height:700px;

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

.shape-3{

    width:650px;
    height:650px;

    right:180px;
    bottom:-420px;
}


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

@media(max-width:992px){

.pricing-cta{

    padding:60px 0;
}

.pricing-content h2{

    font-size:36px;
}

}


@media(max-width:768px){

.pricing-content h2{

    font-size:30px;
}

.pricing-content p{

    font-size:15px;
}

.pricing-btn{

    width:100%;

    max-width:300px;
}

}


@media(max-width:480px){

.pricing-cta{

    padding:50px 0;
}

.pricing-subtitle{

    font-size:13px;
}

.pricing-content h2{

    font-size:26px;
}

.pricing-content p{

    font-size:14px;
}

.pricing-btn{

    padding:16px 28px;

    font-size:15px;
}

}

/*=========================================
        PREMIUM FINISHING EFFECTS
=========================================*/

/* Smooth entrance animation */

.pricing-content{
    animation:pricingFade 1s ease;
}

@keyframes pricingFade{

    from{
        opacity:0;
        transform:translateY(35px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}


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

.pricing-shape{

    transition:all .8s ease;
}

.pricing-cta:hover .shape-1{

    transform:translate(-20px,-15px);
}

.pricing-cta:hover .shape-2{

    transform:translate(20px,-15px);
}

.pricing-cta:hover .shape-3{

    transform:translate(15px,20px);
}


/*=========================================
        HEADING
=========================================*/

.pricing-content h2{

    max-width:720px;

    margin-left:auto;
    margin-right:auto;
}


/*=========================================
        BUTTON
=========================================*/

.pricing-btn{

    min-width:250px;
}

.pricing-btn:hover{

    letter-spacing:.4px;
}

.pricing-btn:active{

    transform:scale(.97);
}


/*=========================================
        SECTION SPACING
=========================================*/

.pricing-cta{

    margin:90px auto;

    border-radius:12px;

    width:92%;

    max-width:1350px;
}


/*=========================================
        SHADOW
=========================================*/

.pricing-cta{

    box-shadow:
    0 18px 50px rgba(0,0,0,.12);
}


/*=========================================
        DESKTOP
=========================================*/

@media(min-width:1400px){

.pricing-content h2{

    font-size:44px;
}

}


/*=========================================
        LAPTOP
=========================================*/

@media(max-width:1200px){

.pricing-cta{

    width:94%;
}

}


/*=========================================
        TABLET
=========================================*/

@media(max-width:992px){

.pricing-cta{

    margin:70px auto;
}

.pricing-content{

    max-width:650px;
}

}


/*=========================================
        MOBILE
=========================================*/

@media(max-width:576px){

.pricing-cta{

    margin:60px auto;

    width:94%;

    border-radius:8px;
}

.pricing-btn{

    min-width:100%;
}

.shape-1{

    width:500px;
    height:500px;
}

.shape-2{

    width:450px;
    height:450px;
}

.shape-3{

    display:none;
}

}


/*=========================================
        ACCESSIBILITY
=========================================*/

@media(prefers-reduced-motion:reduce){

.pricing-content,
.pricing-shape,
.pricing-btn{

    animation:none !important;

    transition:none !important;
}

}

/*=========================================
        BENEFITS SECTION
=========================================*/

.benefits-section{
    padding:90px 0;
    background:#ffffff;
    font-family:'Poppins',sans-serif;
}

.benefits-section .container{

    width:90%;
    max-width:1250px;

    margin:auto;

    display:grid;
    grid-template-columns:48% 52%;

    align-items:center;

    gap:25px;
}


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

.benefits-content{

    max-width:520px;
}

.benefits-subtitle{

    display:block;

    color:#9aa3b2;

    font-size:16px;

    font-weight:500;

    margin-bottom:10px;
}

.benefits-content h2{

    color:#3e0960;

    font-size:25px;

    line-height:1.3;

    font-weight:600;

    margin-bottom:32px;
}


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

.benefits-list{

    list-style:none;

    padding:0;

    margin:0;
}

.benefits-list li{

    display:flex;

    align-items:flex-start;

    gap:14px;

    margin-bottom:18px;

    color:#494f5a;

    font-size:16px;

    line-height:1.1;

    transition:.35s;
}

.benefits-list li:last-child{

    margin-bottom:0;
}

.benefits-list li i{

    color:#ac3124;

    font-size:18px;

    margin-top:7px;

    min-width:16px;
}


/*=========================================
        IMAGE
=========================================*/

.benefits-image{

    position:relative;

    overflow:hidden;

    border-radius:8px;
}

.benefits-image img{

    width:100%;

    display:block;

    border-radius:8px;

    object-fit:cover;
}


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

@media(max-width:992px){

.benefits-section{

    padding:70px 0;
}

.benefits-section .container{

    grid-template-columns:1fr;

    gap:45px;
}

.benefits-content{

    max-width:100%;
}

.benefits-content h2{

    font-size:34px;
}

}


@media(max-width:768px){

.benefits-content h2{

    font-size:30px;
}

.benefits-list li{

    font-size:15px;
}

.play-btn{

    width:70px;
    height:70px;
}

.play-btn i{

    font-size:22px;
}

}


@media(max-width:480px){

.benefits-section{

    padding:60px 0;
}

.benefits-content h2{

    font-size:26px;
}

.benefits-subtitle{

    font-size:14px;
}

.benefits-list li{

    font-size:14px;

    line-height:1.7;
}

.play-btn{

    width:60px;
    height:60px;
}

.play-btn i{

    font-size:20px;
}

}

/*=========================================
        BENEFITS PREMIUM EFFECTS
=========================================*/

/* Section Entrance Animation */

.benefits-content{
    animation:slideLeft .9s ease;
}

.benefits-image{
    animation:slideRight .9s ease;
}

@keyframes slideLeft{

    from{
        opacity:0;
        transform:translateX(-45px);
    }

    to{
        opacity:1;
        transform:translateX(0);
    }

}

@keyframes slideRight{

    from{
        opacity:0;
        transform:translateX(45px);
    }

    to{
        opacity:1;
        transform:translateX(0);
    }

}

/*=========================================
        HEADING
=========================================*/

.benefits-content h2{

    max-width:480px;
}


/*=========================================
        PARAGRAPH SPACING
=========================================*/

.benefits-list{

    max-width:500px;
}


/*=========================================
        DESKTOP
=========================================*/

@media(min-width:1400px){

.benefits-section .container{

    max-width:1320px;
}

}


/*=========================================
        SMALL LAPTOP
=========================================*/

@media(max-width:1200px){

.benefits-section .container{

    gap:45px;
}

.benefits-content h2{

    font-size:36px;
}

}


/*=========================================
        TABLET
=========================================*/

@media(max-width:992px){

.benefits-content{

    text-align:left;
}

.benefits-image{

    max-width:700px;

    margin:auto;
}

}


/*=========================================
        MOBILE
=========================================*/

@media(max-width:576px){

.benefits-section{

    padding:60px 0;
}

.benefits-content h2{

    font-size:28px;
}

.benefits-list li{

    margin-bottom:16px;
}

.play-btn{

    width:58px;
    height:58px;
}

.play-btn i{

    font-size:18px;
}

}


/*=========================================
        ACCESSIBILITY
=========================================*/

@media(prefers-reduced-motion:reduce){

.benefits-content,
.benefits-image,
.play-btn::before{

    animation:none 
}

.benefits-image img,
.benefits-list li,
.play-btn{

    transition:none 
}

}


/* =========================
   CTA SECTION
========================= */

.footer-cta{
    width:100%;
    background:linear-gradient(90deg, #ac3124,#3e0960);
    padding:60px 70px;

    clip-path: polygon(
        25px 0,
        calc(100% - 25px) 0,
        100% 25px,
        100% 100%,
        0 100%,
        0 25px
    );
}
.cta-content{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px;
}

.cta-text p{
    font-size:14px;
    letter-spacing:1px;
    font-weight:600;
    color:#ffffff;
}

.cta-text h2{
    margin-bottom: 8px;
    font-size:40px;
    line-height:1.2;
    max-width:700px;
    color:#ffffff;
    font-weight:700;
}
.cta-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#ffffff;
    color:#000;
    text-decoration:none;
    padding:10px 40px;
    border-radius:50px;
    font-size:18px;
    font-weight:700;
    white-space:nowrap;
    transition:all .3s ease;
}

.cta-btn:hover{
    transform:translateY(-4px);
    box-shadow:0 15px 30px rgba(0,0,0,.25);
}

.footer{
background:#111827;
color:#fff;
padding:100px 0 25px;
position:relative;
margin-top:0;
}

.footer::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:5px;
background:linear-gradient(90deg, #d43c2d, #6a1b9a);
}

.footer-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:50px;
}

.footer-logo{
width:220px;
margin-bottom:20px;
background:#ffffff;
padding:8px;
border-radius:10px;
}

.footer-col h3{
margin-bottom:20px;
font-size:22px;
color:#fff;
}

.footer-col p{
color:#cbd5e1;
line-height:1.8;
}

.footer-col ul{
list-style:none;
padding:0;
}

.footer-col ul li{
margin-bottom:12px;
}

.footer-col ul li a{
color:#cbd5e1;
text-decoration:none;
transition:.3s;
}

.footer-col ul li a:hover{
color:#fff;
padding-left:8px;
}

.footer-social{
display:flex;
gap:15px;
}

.footer-social a{
width:45px;
height:45px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
background:rgba(35, 31, 31, 0.08);
color:#fff;
text-decoration:none;
transition:.3s;
}

.footer-social a:hover{
background:linear-gradient(135deg,#ac3124,#3e0960);
transform:translateY(-5px);
}

.footer-bottom{
text-align:center;
border-top:1px solid rgba(255,255,255,.1);
margin-top:40px;
padding-top:25px;
}

.footer-bottom p{
color:#94a3b8;
}

.footer-bottom a{
    color:#ffffff;
    text-decoration:none;
    transition:.3s ease;
}

.footer-bottom a:hover{
    color:#430ed3;
}

/* ==================================================
                HYPER LINKS 
====================================================*/

.legal-page{
    padding:120px 0;
    background:#fff;
}

.legal-page .container{
    max-width:1000px;
}

.legal-page h1{
    font-size:48px;
    color:#3e0960;
    margin-bottom:30px;
}

.legal-page h2{
    font-size:24px;
    color:#3e0960;
    margin-top:35px;
    margin-bottom:15px;
}

.legal-page p{
    color:#555;
    line-height:1.9;
    margin-bottom:15px;
}