
.grid-container {
    margin-left: auto;
    margin-right: auto;
    max-width: 1300px;
}
.secure-info-box{
    max-width:400px;
    background:#171717;
    border:1px solid #292929;
    border-radius:16px;
    padding:12px 8px;
    margin-bottom: 13px;
    display:flex;
    align-items:center;
    gap:14px;
    color:#fff;
    font-family:Arial,sans-serif;
    box-sizing:border-box;
}

.secure-lock{
    width:28px;
    height:28px;
    color:#48c85a;
    font-size:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    filter:hue-rotate(70deg);
    flex-shrink:0;
}

.secure-text{
    font-size:14px;
    line-height:1.45;
    color:#e5e7eb;
}

.secure-text b{
    font-weight:700;
    color:#fff;
}
.lifetime-recording-card{
    max-width:440px;
    background:#171717;
    border:1px solid #292929;
    border-radius:16px;
    padding:24px 15px;
    color:#fff;
    font-family:Arial,sans-serif;
    box-sizing:border-box;
}

.lrc-header{
    display:flex;
    gap:12px;
    align-items:center;
}

.lrc-icon{
    width:18px;
    height:18px;
    background:#49b85b;
    color:#111;
    border-radius:50%;
    font-size:10px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.lrc-title{
    font-size:19px;
    font-weight:700;
    margin-bottom:4px;
}

.lrc-badge{
    background:#237b35;
    color:#7df28c;
    font-size:13px;
    font-weight:700;
    padding:4px 10px;
    border-radius:15px;
}

.lrc-desc{
    margin-top:8px;
    font-size:14px;
    line-height:1.4;
}

.lrc-price{
    margin-top:18px;
    display:flex;
    gap:12px;
    align-items:center;
}

.lrc-old{
    font-size:16px;
    text-decoration:line-through;
    color:#ddd;
}

.lrc-new{
    font-size:30px;
    font-weight:700;
    color:#48c85a;
}

.lrc-one{
    font-size:14px;
}

.lifetime-recording-card hr{
    border:0;
    border-top:1px solid #333;
    margin:25px 0;
}

.lifetime-recording-card ul{
    padding-left:40px;
    margin:0;
}

.lifetime-recording-card li{
    font-size:14px;
    line-height:1.55;
    margin-bottom:4px;
}

.lrc-check{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:16px;
}

.lrc-check span{
    width:22px;
    height:22px;
    background:#eee;
    color:#222;
    border-radius:4px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
}

.lrc-save{
    margin-top:10px;
    display:inline-block;
    background:#3c9449;
    color:white;
    padding:5px 12px;
    border-radius:15px;
    font-size:14px;
    font-weight:700;
}
.grid-container {
    margin-left: auto;
    margin-right: auto;
    max-width: 1300px !important;
}
.refund-guarantee{
    max-width:auto;
    background:#073b16;
    border:1px solid #4ade80;
    border-radius:16px;
    padding:18px 20px;
    display:flex;
    gap:14px;
    align-items:flex-start;
    color:#fff;
    font-family:Arial,sans-serif;
}

.refund-icon{
    width:22px;
    height:22px;
    margin-top:7px;
    border:2px solid #4ade80;
    border-radius:50%;
    color:#4ade80;
    font-size:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.refund-title{
    font-size:20px;
    font-weight:700;
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:6px;
}

.refund-title span{
    background:#166534;
    color:#4ade80;
    font-size:13px;
    padding:5px 10px;
    border-radius:20px;
}

.refund-text{
    font-size:17px;
    line-height:1.45;
    color:#f1f5f9;
}
.pp-wrap{
    max-width:100% !important;
    margin:40px auto;
    padding:0 10px;
}
.price-line .now {
        font-size: 26px;
        font-weight:700;
    }
    .price-line .tag {
    font-size: 11.5px;
    font-weight: 600;
    color: #25d366;
    background: #E9FBF0;
    padding: 3px 8px;
    border-radius: 999px;
}
 .price-line {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 6px 0 14px;
}
.check-item .tick {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #25d366;
    color: #fff;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 1px;
}
.check-item {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-size: 13px;
    color: #565b66;
    font-weight: 500;
}
.check-list {
    display: flex;
    flex-direction: column;
    gap: 9px;
}
.stars {
    color: #F5A623;
    font-size: 14px;
    letter-spacing: 2px;
}
.proof-card p.quote {
    font-size: 12.5px;
    color: #565b66;
    line-height: 1.55;
    font-style: italic;
}
.proof-card .rating-line span.muted {
    font-weight: 500;
    color: #565b66;
    font-size: 12px;
}
.proof-card {
    border: 1px solid #e1e8f0;
    border-radius: 14px;
    background: #fff;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.proof-card .rating-line {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
    color: #000;
}
.benefit .icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: #E3F5EF;
    color: #0faf82;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    margin-bottom: 8px;
}
.benefit p {
    font-size: 14px;
    font-weight: 600;
    color: #000;
    line-height: 1.4;
}
.benefit-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.benefit {
    border: 1px solid #e1e8f0;
    border-radius: 10px;
    padding: 12px 12px 13px;
    background: #fff;
}
.pp-grid{
    display:grid;
    grid-template-columns:1.65fr .95fr;
    gap:35px;
    align-items:start;
}


.pp-left{
    display:flex;
    flex-direction:column;
    gap:25px;
}

.hero-box{

    background:linear-gradient(135deg,#17c3a5 0%,#1d7fd9 55%,#152d67 100%);
    border-radius:28px;
    color:#fff;
    padding:60px;
    overflow:hidden;
    position:relative;

}
.hero-box:before{

    content:'';
    position:absolute;
    width:420px;
    height:420px;
    right:-180px;
    top:-180px;
    background:rgba(255,255,255,.08);
    border-radius:50%;

}
.workshop-tag{

    display:inline-block;
    padding:10px 22px;
    border-radius:40px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.18);
    font-size:14px;
    font-weight:600;
    margin-bottom:25px;

}
.hero-box h1{

    font-size:60px;
    line-height:1.05;
    font-weight:800;
    margin-bottom:22px;

}
.hero-box h1 span{

    color:#56f2ae;

}
.hero-box p{

    font-size:23px;
    line-height:1.7;
    color:#edf6ff;
    max-width:700px;

}

.badges{

    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:40px;

}

.badge-item{

    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.20);
    border-radius:40px;
    padding:13px 24px;
    font-weight:600;
    font-size:16px;
    backdrop-filter:blur(15px);

}

/*=====================
PROGRESS
======================*/

.progress-card{

    margin-top:45px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.18);
    border-radius:18px;
    padding:25px;

}

.progress-top{

    display:flex;
    justify-content:space-between;
    margin-bottom:14px;
    font-weight:700;
    color:#fff;

}

.progress{

    width:100%;
    height:10px;
    border-radius:20px;
    overflow:hidden;
    background:rgba(255,255,255,.25);

}

.progress span{

    display:block;
    width:90%;
    height:100%;
    background:linear-gradient(90deg,#18d790,#43b2ff);

}

.pp-box{

    background:#fff;
    border-radius:22px;
    border:1px solid #dbe5ef;
    box-shadow:0 15px 35px rgba(0,0,0,.05);
    padding:28px;

}

.pp-box h4,
.pp-box h5,
.pp-box h6{

    color:#0f2b63;
    margin-bottom:15px;
    font-weight:700;

}

.pp-box p{

    color:#5b6470;
    line-height:1.8;
    margin-bottom:12px;

}

/*=======================
RIGHT SIDEBAR
========================*/

.pp-sidebar{

    position:sticky;
    top:30px;

}

.payment-card{

    background:#fff;
    border-radius:26px;
    padding:35px;
    border:1px solid #dfe8f3;
    box-shadow:0 20px 40px rgba(0,0,0,.08);

}

.price{

    font-size:48px;
    font-weight:800;
    color:#162d63;
    margin:15px 0;

}

.offer{

    display:inline-block;
    padding:6px 14px;
    border-radius:30px;
    background:#e8fff2;
    color:#1bb561;
    font-weight:600;
    font-size:14px;
    margin-left:10px;

}

/*======================
INPUT
=======================*/

.pp-input{

    width:100%;
    border:1px solid #dce6f1;
    border-radius:14px;
    padding:17px 18px;
    font-size:16px;
    margin-bottom:16px;
    background:#f9fbfd;
    transition:.3s;

}

.pp-input:focus{

    outline:none;
    border-color:#1b85ff;
    background:#fff;
    box-shadow:0 0 0 4px rgba(59,130,246,.15);

}

.pp-row{

    display:flex;
    gap:15px;

}

/*=======================
BUTTON
========================*/

.pp-btn{

    width:100%;
    border:none;
    border-radius:16px;
    padding:20px;
    font-size:20px;
    font-weight:700;
    color:#fff;
    cursor:pointer;
    transition:.3s;
    background:linear-gradient(90deg,#18c69c,#2578eb);

}

.pp-btn:hover{

    transform:translateY(-3px);
    box-shadow:0 18px 35px rgba(37,120,235,.30);

}

/*======================
LIST
=======================*/

.pp-list{

    padding-left:22px;

}

.pp-list li{

    margin-bottom:12px;
    color:#4d5662;

}


.mobilerefund {
    display:none;
}
/*======================
RESPONSIVE
=======================*/

@media(max-width:991px){

.pp-grid{

grid-template-columns:1fr;

}

.pp-sidebar{

position:relative;
top:auto;

}

.hero-box{

padding:35px;

}

.hero-box h1{

font-size:42px;

}

.hero-box p{

font-size:18px;

}

}

@media(max-width:576px){
    
.mobilerefund .refund-title {
    display: block;
}

.mobilerefund {
    display:block;
    margin-top:15px;
}

.pp-row{

flex-direction:column;

}

.hero-box h1{

font-size:34px;

}
.pp-left {
    display: none;
}
.payment-card {

    padding: 15px;


}
.badges{

gap:10px;

}

.badge-item{

font-size:14px;

padding:10px 16px;

}

.price{

font-size:36px;

}

}

