/*==================================================
 BugDady Pricing Section
 Part 2A - Base Styling
 Prefix : bdpkg-
==================================================*/

/*-------------------------
 ROOT VARIABLES
--------------------------*/

:root{

    --bdpkg-primary:#9CFF00;
    --bdpkg-primary-dark:#79d000;

    --bdpkg-bg:#0F1A25;
    --bdpkg-bg-light:#162636;
    --bdpkg-bg-card:rgba(255,255,255,.05);

    --bdpkg-border:rgba(255,255,255,.08);

    --bdpkg-white:#ffffff;
    --bdpkg-muted:#B5C1CC;

    --bdpkg-success:#39ff88;

    --bdpkg-radius:22px;

    --bdpkg-transition:.45s ease;

    --bdpkg-shadow:

        0 15px 60px rgba(0,0,0,.35);

}
.table{
    background: #ffffff00 !important;
}
/*-------------------------
 SECTION
--------------------------*/

.bdpkg-section{

    position:relative;

 

    padding:120px 0;

    background:

        linear-gradient(
        180deg,
        #101B23 0%,
        #0F1A25 100%
        );

}

/*-------------------------
 BACKGROUND CIRCLES
--------------------------*/

.bdpkg-bg-circle{

    position:absolute;

    border-radius:50%;

    filter:blur(90px);

    opacity:.18;

    pointer-events:none;

}

.bdpkg-bg-circle-1{

    width:420px;
    height:420px;

    left:-120px;
    top:-120px;

    background:#9CFF00;

}

.bdpkg-bg-circle-2{

    width:320px;
    height:320px;

    right:-80px;
    top:180px;

    background:#00D9FF;

}

.bdpkg-bg-circle-3{

    width:260px;
    height:260px;

    bottom:-100px;
    left:40%;

    background:#7a5cff;

}

/*-------------------------
 HEADING
--------------------------*/

.bdpkg-heading{

    position:relative;

    z-index:2;

    margin-bottom:35px;

}

.bdpkg-mini-title{

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:var(--bdpkg-primary);

    font-size:14px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:2px;

    margin-bottom:18px;

}

.bdpkg-mini-title::before{

    content:"";

    width:38px;

    height:2px;

    background:var(--bdpkg-primary);

}

.bdpkg-title{

    color:#fff;

    font-size:54px;

    font-weight:800;

    line-height:1.15;

    margin-bottom:22px;

}

.bdpkg-subtitle{

    max-width:760px;

    margin:auto;

    color:var(--bdpkg-muted);

    line-height:1.9;

    font-size:17px;

}

/*-------------------------
 PRICING GRID
--------------------------*/

.bdpkg-section .row{

    position:relative;

    z-index:2;

}

/*-------------------------
 CARD BASE
--------------------------*/

.bdpkg-card{

    position:relative;

    overflow:hidden;

    height:100%;

    border-radius:var(--bdpkg-radius);

    background:var(--bdpkg-bg-card);

    border:1px solid var(--bdpkg-border);

    backdrop-filter:blur(18px);

    -webkit-backdrop-filter:blur(18px);

    padding:42px;

    transition:var(--bdpkg-transition);

    box-shadow:var(--bdpkg-shadow);

}

/* animated border */

.bdpkg-card::before{

    content:"";

    position:absolute;

    inset:0;

    padding:1px;

    border-radius:inherit;

    background:

    linear-gradient(
        135deg,
        rgba(156,255,0,.5),
        transparent,
        rgba(255,255,255,.08)
    );

    -webkit-mask:

    linear-gradient(#fff 0 0) content-box,

    linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;

    mask-composite:exclude;

    pointer-events:none;

}

/*-------------------------
 CARD HOVER
--------------------------*/

.bdpkg-card:hover{

    transform:

        translateY(-12px);

    border-color:

        rgba(156,255,0,.35);

    box-shadow:

        0 30px 80px rgba(0,0,0,.55);

}

.bdpkg-card:hover::after{

    opacity:1;

}

.bdpkg-card::after{

    animation:bdpkgBlobFloat 6s infinite ease-in-out;

}

@keyframes bdpkgBlobFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-15px);

}

100%{

transform:translateY(0);

}

}

/*-------------------------
 ACTIVE CARD
--------------------------*/

.bdpkg-active{

    border-color:

        rgba(156,255,0,.55);

    transform:scale(1.04);

}

.bdpkg-active::before{

    background:

        linear-gradient(

        140deg,

        rgba(156,255,0,.95),

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

        rgba(255,255,255,.15)

        );

}
    
    
   /*==================================================
 BugDady Pricing Section
 Part 2B - Card Content Styling
 Prefix : bdpkg-
==================================================*/

/*-------------------------
 CARD TOP
--------------------------*/

.bdpkg-card-top{

    position:relative;

    z-index:2;

    text-align:center;

    margin-bottom:32px;

}

.bdpkg-plan-icon{

    width:82px;

    height:82px;

    margin:0 auto 24px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    font-size:34px;

    color:var(--bdpkg-primary);

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

    border:1px solid rgba(156,255,0,.25);

    transition:var(--bdpkg-transition);

}

.bdpkg-card:hover .bdpkg-plan-icon{

    transform:rotate(12deg) scale(1.08);

    background:var(--bdpkg-primary);

    color:#111;

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

}

.bdpkg-card-top h3{

    color:var(--bdpkg-white);

    font-size:32px;

    font-weight:800;

    margin-bottom:10px;

}

.bdpkg-card-top p{

    color:var(--bdpkg-muted);

    font-size:16px;

    margin:0;

}

/*-------------------------
 PRICE
--------------------------*/

.bdpkg-price-wrap{

    display:flex;

    align-items:flex-start;

    justify-content:center;

    margin-bottom:8px;

}

.bdpkg-currency{

    color:var(--bdpkg-primary);

    font-size:34px;

    font-weight:700;

    margin-top:12px;

    margin-right:4px;

}

.bdpkg-price{

    color:#fff;

    font-size:62px;

    font-weight:900;

    line-height:1;

    letter-spacing:-2px;

}

.bdpkg-duration{

    text-align:center;

    color:var(--bdpkg-muted);

    font-size:15px;

    margin-bottom:35px;

}

/*-------------------------
 FEATURE LIST
--------------------------*/

.bdpkg-feature-list{

    margin:0;

    padding:0;

    list-style:none;

}

.bdpkg-feature-list li{

    display:flex;

    align-items:center;

    gap:14px;

    color:#edf3f8;

    font-size:15px;

    padding:14px 0;

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

    transition:var(--bdpkg-transition);

}

.bdpkg-feature-list li:last-child{

    border-bottom:none;

}

.bdpkg-feature-list li:hover{

    padding-left:12px;

    color:var(--bdpkg-primary);

}

.bdpkg-feature-list li i{

    width:24px;

    height:24px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    border-radius:50%;

    color:var(--bdpkg-success);

    font-size:18px;

}

.bdpkg-feature-list .bi-x-circle{

    color:#ff6363;

}

/*-------------------------
 BUTTON
--------------------------*/

.bdpkg-btn{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    width:100%;

    margin-top:35px;

    padding:18px 24px;

    border-radius:14px;

    overflow:hidden;

    text-decoration:none;

    font-size:16px;

    font-weight:700;

    letter-spacing:.5px;

    color:#111;

    background:var(--bdpkg-primary);

    transition:var(--bdpkg-transition);

}

.bdpkg-btn:hover{

    transform:translateY(-4px);

    color:#111;

    box-shadow:0 15px 40px rgba(156,255,0,.35);

}

.bdpkg-btn::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:60%;

    height:100%;

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

    transform:skewX(-25deg);

    transition:.8s;

}

.bdpkg-btn:hover::before{

    left:160%;

}

/*-------------------------
 MOST POPULAR RIBBON
--------------------------*/

.bdpkg-ribbon{

    position:absolute;

    top:22px;

    right:-48px;

    width:190px;

    text-align:center;

    padding:10px 0;

    background:var(--bdpkg-primary);

    color:#111;

    font-size:12px;

    font-weight:800;

    letter-spacing:2px;

    text-transform:uppercase;

    transform:rotate(45deg);

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

    z-index:5;

}

/*-------------------------
 ENTERPRISE VARIANT
--------------------------*/

.bdpkg-enterprise .bdpkg-plan-icon{

    color:#ffd86b;

    border-color:rgba(255,216,107,.25);

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

}

.bdpkg-enterprise:hover .bdpkg-plan-icon{

    color:#111;

    background:#ffd86b;

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

}

/*-------------------------
 ACTIVE CARD EMPHASIS
--------------------------*/

.bdpkg-active .bdpkg-price{

    color:var(--bdpkg-primary);

}

.bdpkg-active .bdpkg-card-top h3{

    color:var(--bdpkg-primary);

}

.bdpkg-active{

    box-shadow:
        0 25px 70px rgba(156,255,0,.12),
        0 15px 50px rgba(0,0,0,.45);

} 
    
  /*==================================================
 BugDady Pricing Section
 Part 2C - Comparison Table
 Prefix : bdpkg-
==================================================*/

/*------------------------------------
 TABLE WRAPPER
------------------------------------*/

.bdpkg-table-wrapper{

    position:relative;

    margin-top:80px;

    border-radius:26px;

    overflow:hidden;

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

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

    backdrop-filter:blur(20px);

    -webkit-backdrop-filter:blur(20px);

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

}

/*------------------------------------
 TABLE
------------------------------------*/

.bdpkg-table{

    margin:0;

    width:100%;

    border-collapse:separate;

    border-spacing:0;

    color:#000;
     

}

/*------------------------------------
 HEADER
------------------------------------*/

 

.bdpkg-table thead tr{

    background:#131f2b;

}

.bdpkg-table thead th{

    padding:24px;

    text-align:center;

    font-size:18px;

    font-weight:700;

    color:#fff;

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

    white-space:nowrap;

}

.bdpkg-table thead th:first-child{

    text-align:left;

    width:30%;

    padding-left:35px;

}

/*------------------------------------
 BODY
------------------------------------*/

.bdpkg-table tbody tr{

    transition:.35s ease;

}

.bdpkg-table tbody tr:nth-child(even){

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

}

.bdpkg-table tbody tr:hover{

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

}

.bdpkg-table tbody td{

    padding:18px 24px;

    text-align:center;

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

    color:#dfe8ef;

    font-size:15px;

}

.bdpkg-table tbody td:first-child{

    text-align:left;

    font-weight:600;

    color:#fff;

    padding-left:35px;

}

/*------------------------------------
 ACTIVE COLUMN
------------------------------------*/

.bdpkg-table-active{

    background:rgba(156,255,0,.12)!important;

    color:var(--bdpkg-primary)!important;

    position:relative;

}

.bdpkg-table td:nth-child(3){

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

}

.bdpkg-table td:nth-child(3),
.bdpkg-table th:nth-child(3){

    border-left:1px solid rgba(156,255,0,.18);

    border-right:1px solid rgba(156,255,0,.18);

}

/*------------------------------------
 ICONS
------------------------------------*/

.bdpkg-table i.bi-check-circle-fill{

    color:#34f58b;

    font-size:20px;

}

.bdpkg-table i.bi-x-circle{

    color:#ff5c74;

    font-size:20px;

}

/*------------------------------------
 ROW HIGHLIGHT
------------------------------------*/

.bdpkg-table tbody tr:hover td{

    color:#fff;

}

.bdpkg-table tbody tr:hover td:first-child{

    color:var(--bdpkg-primary);

}

/*------------------------------------
 TABLE SCROLLBAR
------------------------------------*/

.bdpkg-table-wrapper::-webkit-scrollbar{

    height:8px;

}

.bdpkg-table-wrapper::-webkit-scrollbar-track{

    background:#17222e;

}

.bdpkg-table-wrapper::-webkit-scrollbar-thumb{

    background:var(--bdpkg-primary);

    border-radius:50px;

}

/*------------------------------------
 TABLE TITLE (OPTIONAL)
------------------------------------*/

.bdpkg-table-heading{

    text-align:center;

    margin-bottom:30px;

}

.bdpkg-table-heading h3{

    color:#fff;

    font-size:36px;

    font-weight:800;

    margin-bottom:12px;

}

.bdpkg-table-heading p{

    color:var(--bdpkg-muted);

    max-width:700px;

    margin:auto;

    line-height:1.8;

}

/*------------------------------------
 SMOOTH TRANSITIONS
------------------------------------*/

.bdpkg-table,
.bdpkg-table th,
.bdpkg-table td{

    transition:.35s ease;

}


/*==================================================
 BugDady Pricing Section
 Part 2D - Responsive + Mobile Layout
 Prefix : bdpkg-
==================================================*/

/*------------------------------------
 LARGE DESKTOP
------------------------------------*/

@media (max-width:1399px){

    .bdpkg-title{

        font-size:48px;

    }

    .bdpkg-card{

        padding:36px;

    }

    .bdpkg-price{

        font-size:56px;

    }

}

/*------------------------------------
 LAPTOP
------------------------------------*/

@media (max-width:1199px){

    .bdpkg-section{

        padding:100px 0;

    }

    .bdpkg-title{

        font-size:42px;

    }

    .bdpkg-subtitle{

        font-size:16px;

    }

    .bdpkg-card{

        margin-bottom:30px;

    }

    .bdpkg-active{

        transform:none;

    }

    .bdpkg-ribbon{

        right:-54px;

    }

    .bdpkg-table thead th{

        font-size:16px;

        padding:18px;

    }

    .bdpkg-table tbody td{

        font-size:14px;

        padding:16px;

    }

}

/*------------------------------------
 TABLET
------------------------------------*/

@media (max-width:991px){

    .bdpkg-section{

        padding:90px 0;

    }

    .bdpkg-title{

        font-size:36px;

    }

    .bdpkg-price{

        font-size:48px;

    }

    .bdpkg-card{

        padding:32px;

    }

    .bdpkg-plan-icon{

        width:72px;

        height:72px;

        font-size:28px;

    }

    .bdpkg-card-top h3{

        font-size:28px;

    }

    .bdpkg-table-wrapper{

        overflow-x:auto;

        -webkit-overflow-scrolling:touch;

    }

    .bdpkg-table{

        min-width:860px;

    }

}

/*------------------------------------
 MOBILE
------------------------------------*/

@media (max-width:767px){

    .bdpkg-section{

        padding:70px 0;

    }

    .bdpkg-title{

        font-size:30px;

        line-height:1.3;

    }

    .bdpkg-subtitle{

        font-size:15px;

    }

    .bdpkg-mini-title{

        font-size:12px;

        letter-spacing:1px;

    }

    .bdpkg-card{

        padding:28px;

        border-radius:20px;

    }

    .bdpkg-card-top{

        margin-bottom:24px;

    }

    .bdpkg-price{

        font-size:42px;

    }

    .bdpkg-currency{

        font-size:24px;

    }

    .bdpkg-feature-list li{

        font-size:14px;

        padding:12px 0;

    }

    .bdpkg-btn{

        padding:16px;

        font-size:15px;

    }

    .bdpkg-ribbon{

        width:170px;

        right:-48px;

        top:18px;

        font-size:11px;

    }

    /* Hide desktop comparison table */

    .bdpkg-table-wrapper{

        display:none;

    }

    /* Mobile accordion container */

    .bdpkg-mobile-compare{

        display:block;

        margin-top:50px;

    }

}

/*------------------------------------
 SMALL MOBILE
------------------------------------*/

@media (max-width:575px){

    .bdpkg-title{

        font-size:26px;

    }

    .bdpkg-card{

        padding:24px;

    }

    .bdpkg-price{

        font-size:38px;

    }

    .bdpkg-plan-icon{

        width:64px;

        height:64px;

        font-size:24px;

    }

    .bdpkg-card-top h3{

        font-size:24px;

    }

    .bdpkg-feature-list li{

        gap:10px;

    }

    .bdpkg-bg-circle{

        display:none;

    }

}

/*------------------------------------
 ACCORDION (Mobile)
------------------------------------*/

.bdpkg-mobile-compare{

    display:none;

}

.bdpkg-mobile-item{

    margin-bottom:16px;

    border-radius:18px;

    overflow:hidden;

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

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

    backdrop-filter:blur(16px);

}

.bdpkg-mobile-header{

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:18px 20px;

    cursor:pointer;

    color:#fff;

    font-weight:700;

}

.bdpkg-mobile-header i{

    transition:.35s ease;

}

.bdpkg-mobile-item.active .bdpkg-mobile-header i{

    transform:rotate(180deg);

}

.bdpkg-mobile-body{

    display:none;

    padding:0 20px 20px;

}

.bdpkg-mobile-body ul{

    list-style:none;

    margin:0;

    padding:0;

}

.bdpkg-mobile-body li{

    display:flex;

    justify-content:space-between;

    padding:12px 0;

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

    color:#dfe8ef;

    font-size:14px;

}

.bdpkg-mobile-body li:last-child{

    border-bottom:none;

}


/*==================================================
 BugDady Pricing Section
 Part 2E - Premium Animations
 Prefix : bdpkg-
==================================================*/

/*------------------------------------
 INITIAL REVEAL
------------------------------------*/

.bdpkg-card{

    opacity:0;

    transform:translateY(60px);

    animation:bdpkgCardReveal .9s ease forwards;

}

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

    animation-delay:.15s;

}

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

    animation-delay:.35s;

}

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

    animation-delay:.55s;

}

/*------------------------------------
 FLOATING CARD
------------------------------------*/

.bdpkg-card{

    transition:
        transform .45s ease,
        box-shadow .45s ease,
        border-color .45s ease;

}

.bdpkg-card:hover{

    transform:translateY(-18px) scale(1.02);

}

/*------------------------------------
 ICON FLOAT
------------------------------------*/

.bdpkg-plan-icon{

    animation:bdpkgIconFloat 5s ease-in-out infinite;

}

/*------------------------------------
 PRICE PULSE
------------------------------------*/

.bdpkg-price{

    animation:bdpkgPricePulse 3.2s infinite;

}

/*------------------------------------
 BUTTON GLOW
------------------------------------*/

.bdpkg-btn{

    animation:bdpkgBtnGlow 3.5s infinite;

}

.bdpkg-btn:hover{

    animation-play-state:paused;

}

/*------------------------------------
 RIBBON
------------------------------------*/

.bdpkg-ribbon{

    animation:bdpkgRibbonGlow 2.8s infinite;

}

/*------------------------------------
 BACKGROUND BLOBS
------------------------------------*/

.bdpkg-bg-circle-1{

    animation:bdpkgBlobOne 12s ease-in-out infinite;

}

.bdpkg-bg-circle-2{

    animation:bdpkgBlobTwo 14s ease-in-out infinite;

}

.bdpkg-bg-circle-3{

    animation:bdpkgBlobThree 11s ease-in-out infinite;

}

/*------------------------------------
 TABLE ROW HOVER
------------------------------------*/

.bdpkg-table tbody tr{

    transition:
        background .35s ease,
        transform .35s ease;

}

.bdpkg-table tbody tr{

    transition:
    background .3s,
    box-shadow .3s;

}

.bdpkg-table tbody tr:hover{

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

    box-shadow:inset 0 0 0 999px rgba(156,255,0,.03);

}

/*------------------------------------
 FEATURE ICON
------------------------------------*/

.bdpkg-feature-list li:hover i{

    animation:bdpkgBounce .6s ease;

}

/*------------------------------------
 BUTTON RIPPLE
------------------------------------*/

.bdpkg-btn::after{

    content:"";

    position:absolute;

    inset:0;

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

    transform:scale(0);

    border-radius:inherit;

    opacity:0;

    transition:.45s;

}

.bdpkg-btn:active::after{

    transform:scale(2);

    opacity:1;

}

/*====================================
 KEYFRAMES
====================================*/

@keyframes bdpkgCardReveal{

    from{

        opacity:0;

        transform:translateY(60px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

@keyframes bdpkgFloat{

    0%{

        transform:translateY(-10px);

    }

    50%{

        transform:translateY(-18px);

    }

    100%{

        transform:translateY(-10px);

    }

}

@keyframes bdpkgIconFloat{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-8px);

    }

    100%{

        transform:translateY(0);

    }

}

@keyframes bdpkgPricePulse{

    0%{

        transform:scale(1);

    }

    50%{

        transform:scale(1.05);

        color:var(--bdpkg-primary);

    }

    100%{

        transform:scale(1);

    }

}

@keyframes bdpkgBtnGlow{

    0%{

        box-shadow:0 0 0 rgba(156,255,0,0);

    }

    50%{

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

    }

    100%{

        box-shadow:0 0 0 rgba(156,255,0,0);

    }

}

@keyframes bdpkgRibbonGlow{

    0%{

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

    }

    50%{

        box-shadow:0 0 30px rgba(156,255,0,.55);

    }

    100%{

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

    }

}

@keyframes bdpkgBlobOne{

    0%{

        transform:translate(0,0) scale(1);

    }

    50%{

        transform:translate(40px,-30px) scale(1.15);

    }

    100%{

        transform:translate(0,0) scale(1);

    }

}

@keyframes bdpkgBlobTwo{

    0%{

        transform:translate(0,0);

    }

    50%{

        transform:translate(-45px,30px);

    }

    100%{

        transform:translate(0,0);

    }

}

@keyframes bdpkgBlobThree{

    0%{

        transform:scale(1);

    }

    50%{

        transform:scale(1.25);

    }

    100%{

        transform:scale(1);

    }

}

@keyframes bdpkgBounce{

    0%{

        transform:scale(1);

    }

    40%{

        transform:scale(1.35);

    }

    100%{

        transform:scale(1);

    }

}