@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700;800&display=swap");

#cleanline-pricing{

    --blue:#0879e8;
    --blue-dark:#005fc4;
    --blue-light:#2aa9ff;

    --red:#f52c38;
    --red-dark:#d91d2b;

    --black:#071018;
    --dark:#071019;
    --white:#ffffff;

    --text:#18222c;
    --muted:#697783;

    --light:#f5f8fb;

    --border:rgba(10,30,50,.09);

    --radius:24px;

    --shadow:
        0 20px 60px rgba(8,40,70,.10);

    --shadow-hover:
        0 30px 80px rgba(8,40,70,.17);

    font-family:"Inter",sans-serif;

    color:var(--text);

    background:#f5f8fb;

    line-height:1.6;

    width:100%;
    position:relative;

    overflow:hidden;

}


/* =========================================================
   RESET
========================================================= */

#cleanline-pricing *{

    margin:0;
    padding:0;

    box-sizing:border-box;

}

#cleanline-pricing h1,
#cleanline-pricing h2,
#cleanline-pricing h3,
#cleanline-pricing p{

    margin:0;

}

#cleanline-pricing a{

    text-decoration:none;

}


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

#cleanline-pricing .container{

    width:min(calc(100% - 48px),1480px);

    margin:auto;

}


/* =========================================================
   FULL WIDTH ELEMENTOR
========================================================= */

#cleanline-pricing{

    width:100vw !important;

    max-width:100vw !important;

    margin-left:calc(50% - 50vw) !important;

    margin-right:calc(50% - 50vw) !important;

}


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

#cleanline-pricing .pricing-header{

    background:#071019;

    padding:110px 0 90px;

    position:relative;

    overflow:hidden;

}


#cleanline-pricing .pricing-header::before{

    content:"";

    position:absolute;

    width:600px;
    height:600px;

    background:rgba(8,121,232,.14);

    filter:blur(100px);

    border-radius:50%;

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

}


#cleanline-pricing .pricing-header::after{

    content:"";

    position:absolute;

    width:400px;
    height:400px;

    background:rgba(245,44,56,.08);

    filter:blur(100px);

    border-radius:50%;

    bottom:-250px;
    left:-150px;

}


#cleanline-pricing .header-content{

    position:relative;

    z-index:2;

    max-width:800px;

}


#cleanline-pricing .section-label{

    color:#42a9ff;

    font-size:11px;

    font-weight:900;

    letter-spacing:.18em;

    text-transform:uppercase;

    margin-bottom:17px;

}


#cleanline-pricing .main-title{

    font-family:"Manrope",sans-serif;

    font-size:clamp(42px,5.5vw,72px);

    line-height:1;

    letter-spacing:-4px;

    color:#fff;

    font-weight:800;

}


#cleanline-pricing .main-title span{

    color:var(--blue);

}


#cleanline-pricing .header-description{

    margin-top:25px;

    max-width:650px;

    color:#8494a2;

    font-size:15px;

    line-height:1.8;

}


/* =========================================================
   SECTIONS
========================================================= */

#cleanline-pricing .pricing-section{

    padding:95px 0;

}


#cleanline-pricing .pricing-section.dark{

    background:#071019;

    color:#fff;

}


#cleanline-pricing .section-heading{

    display:flex;

    justify-content:space-between;

    align-items:flex-end;

    gap:40px;

    margin-bottom:42px;

}


#cleanline-pricing .section-heading-left{

    max-width:750px;

}


#cleanline-pricing .section-title{

    font-family:"Manrope",sans-serif;

    font-size:clamp(32px,4vw,52px);

    line-height:1.05;

    letter-spacing:-2.5px;

    font-weight:800;

    color:#071018;

}


#cleanline-pricing .dark .section-title{

    color:#fff;

}


#cleanline-pricing .section-title span{

    color:var(--blue);

}


#cleanline-pricing .section-subtitle{

    margin-top:12px;

    color:#7a8995;

    font-size:14px;

}


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

#cleanline-pricing .price-card{

    background:#fff;

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

    border-radius:26px;

    overflow:hidden;

    box-shadow:var(--shadow);

}


#cleanline-pricing .price-head{

    display:grid;

    grid-template-columns:1fr 170px;

    padding:18px 28px;

    background:#071019;

    color:#fff;

}


#cleanline-pricing .price-head span{

    font-size:10px;

    font-weight:800;

    letter-spacing:.13em;

    text-transform:uppercase;

    color:#7e909e;

}


#cleanline-pricing .price-head span:last-child{

    text-align:right;

}


#cleanline-pricing .price-row{

    display:grid;

    grid-template-columns:1fr 170px;

    align-items:center;

    padding:20px 28px;

    border-bottom:1px solid rgba(10,30,50,.07);

    transition:.25s ease;

}


#cleanline-pricing .price-row:last-child{

    border-bottom:0;

}


#cleanline-pricing .price-row:hover{

    background:#f7fbff;

    padding-left:34px;

}


#cleanline-pricing .service-name{

    font-size:14px;

    font-weight:700;

    color:#18222c;

}


#cleanline-pricing .price{

    text-align:right;

    font-family:"Manrope",sans-serif;

    font-size:18px;

    font-weight:800;

    color:var(--blue);

    white-space:nowrap;

}


#cleanline-pricing .price strong{

    color:var(--red);

}


/* =========================================================
   PACKAGE SECTION
========================================================= */

#cleanline-pricing .packages{

    display:grid;

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

    gap:22px;

}


#cleanline-pricing .package{

    position:relative;

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

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

    border-radius:27px;

    padding:31px;

    transition:.35s ease;

    overflow:hidden;

}


#cleanline-pricing .package:hover{

    transform:translateY(-8px);

    border-color:rgba(8,121,232,.45);

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

}


#cleanline-pricing .package.premium{

    background:

        linear-gradient(
            145deg,
            rgba(8,121,232,.14),
            rgba(255,255,255,.035)
        );

    border-color:rgba(8,121,232,.35);

}


#cleanline-pricing .package-badge{

    position:absolute;

    top:20px;

    right:20px;

    background:var(--red);

    color:#fff;

    padding:7px 11px;

    border-radius:8px;

    font-size:9px;

    font-weight:900;

    letter-spacing:.1em;

    text-transform:uppercase;

}


#cleanline-pricing .package-name{

    color:#fff;

    font-family:"Manrope",sans-serif;

    font-size:22px;

    font-weight:800;

    line-height:1.15;

    padding-right:80px;

}


#cleanline-pricing .package-name span{

    color:var(--blue-light);

}


#cleanline-pricing .package-price{

    margin-top:24px;

    padding-bottom:23px;

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

}


#cleanline-pricing .package-price strong{

    font-family:"Manrope",sans-serif;

    color:#fff;

    font-size:38px;

    letter-spacing:-1.5px;

}


/* =========================================================
   GWIAZDKA
========================================================= */

#cleanline-pricing .price-star{

    color:#42a9ff;

    font-size:20px;

    vertical-align:top;

    margin-left:3px;

    font-weight:900;

}


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

#cleanline-pricing .package-list{

    display:grid;

    gap:13px;

    margin-top:23px;

}


#cleanline-pricing .package-item{

    display:flex;

    align-items:flex-start;

    gap:11px;

    color:#a6b3bd;

    font-size:12px;

    line-height:1.5;

}


#cleanline-pricing .package-item::before{

    content:"✓";

    width:20px;

    height:20px;

    min-width:20px;

    display:grid;

    place-items:center;

    border-radius:50%;

    background:rgba(8,121,232,.13);

    color:#42a9ff;

    font-size:10px;

    font-weight:900;

}


#cleanline-pricing .package-free{

    display:inline-flex;

    margin-top:23px;

    padding:7px 11px;

    border-radius:8px;

    background:rgba(245,44,56,.1);

    color:#ff6871;

    font-size:9px;

    font-weight:900;

    letter-spacing:.1em;

    text-transform:uppercase;

}


/* =========================================================
   PREMIUM NOTE
========================================================= */

#cleanline-pricing .premium-note{

    margin-top:15px;

    color:#718390;

    font-size:10px;

    line-height:1.55;

    max-width:330px;

}


#cleanline-pricing .premium-note strong{

    color:#9eabb5;

    font-weight:800;

}


/* =========================================================
   CAR SERVICE
========================================================= */

#cleanline-pricing .car-services{

    margin-bottom:45px;

}


#cleanline-pricing .car-services .price-card{

    background:#fff;

}


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

#cleanline-pricing .pricing-cta{

    background:#071019;

    padding:75px 0;

}


#cleanline-pricing .cta-box{

    position:relative;

    overflow:hidden;

    border-radius:28px;

    padding:48px;

    background:

        linear-gradient(
            120deg,
            #0879e8,
            #005fc4
        );

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:30px;

}


#cleanline-pricing .cta-box::after{

    content:"";

    position:absolute;

    width:300px;

    height:300px;

    border-radius:50%;

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

    right:-120px;

    top:-130px;

}


#cleanline-pricing .cta-content{

    position:relative;

    z-index:2;

}


#cleanline-pricing .cta-title{

    color:#fff;

    font-family:"Manrope",sans-serif;

    font-size:clamp(27px,3vw,40px);

    line-height:1.1;

    font-weight:800;

    letter-spacing:-1.5px;

}


#cleanline-pricing .cta-text{

    color:rgba(255,255,255,.72);

    margin-top:10px;

    font-size:13px;

}


/* =========================================================
   PRZYCISK TELEFONU
========================================================= */

#cleanline-pricing .cta-button{

    position:relative;

    z-index:5;

    flex-shrink:0;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-height:53px;

    padding:15px 24px;

    background:#fff;

    color:#071019;

    border-radius:13px;

    font-size:12px;

    font-weight:900;

    transition:.3s ease;

    cursor:pointer;

    -webkit-tap-highlight-color:transparent;

}


#cleanline-pricing .cta-button:hover{

    transform:translateY(-4px);

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

}


#cleanline-pricing .cta-button:active{

    transform:scale(.97);

}


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

@media(max-width:900px){

    #cleanline-pricing .packages{

        grid-template-columns:1fr;

    }


    #cleanline-pricing .section-heading{

        display:block;

    }


    #cleanline-pricing .section-subtitle{

        margin-top:15px;

    }


    #cleanline-pricing .cta-box{

        display:block;

        padding:35px;

    }


    #cleanline-pricing .cta-button{

        margin-top:25px;

    }

}


@media(max-width:600px){

    #cleanline-pricing .container{

        width:calc(100% - 28px);

    }


    #cleanline-pricing .pricing-header{

        padding:75px 0 65px;

    }


    #cleanline-pricing .pricing-section{

        padding:65px 0;

    }


    #cleanline-pricing .main-title{

        letter-spacing:-2.5px;

    }


    #cleanline-pricing .section-title{

        letter-spacing:-1.8px;

    }


    #cleanline-pricing .price-head{

        grid-template-columns:1fr 100px;

        padding:16px 18px;

    }


    #cleanline-pricing .price-row{

        grid-template-columns:1fr 100px;

        padding:18px;

    }


    #cleanline-pricing .price-row:hover{

        padding-left:18px;

    }


    #cleanline-pricing .service-name{

        font-size:13px;

        padding-right:15px;

    }


    #cleanline-pricing .price{

        font-size:16px;

    }


    #cleanline-pricing .package{

        padding:25px;

    }


    #cleanline-pricing .cta-box{

        padding:30px 24px;

        border-radius:22px;

    }


    #cleanline-pricing .cta-button{

        width:100%;

        min-height:56px;

        font-size:13px;

    }

}


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

#cleanline-pricing .reveal{

    opacity:0;

    transform:translateY(25px);

    transition:

        opacity .7s ease,

        transform .7s cubic-bezier(.2,.7,.2,1);

}


#cleanline-pricing .reveal.visible{

    opacity:1;

    transform:translateY(0);

}

/* CleanLine Pricing — WordPress hardening */
#cleanline-pricing.cleanline-pricing-plugin,
#cleanline-pricing.cleanline-pricing-plugin *{
    box-sizing:border-box;
}
#cleanline-pricing.cleanline-pricing-plugin{
    isolation:isolate;
    min-width:0;
    overflow-x:clip;
}
#cleanline-pricing.cleanline-pricing-plugin img{
    max-width:100%;
    height:auto;
}
#cleanline-pricing.cleanline-pricing-plugin a{
    -webkit-tap-highlight-color:transparent;
}
#cleanline-pricing.cleanline-pricing-plugin .reveal{
    will-change:opacity,transform;
}
@media (prefers-reduced-motion:reduce){
    #cleanline-pricing.cleanline-pricing-plugin *,
    #cleanline-pricing.cleanline-pricing-plugin *::before,
    #cleanline-pricing.cleanline-pricing-plugin *::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
        scroll-behavior:auto !important;
    }
    #cleanline-pricing.cleanline-pricing-plugin .reveal{
        opacity:1 !important;
        transform:none !important;
    }
}
