.body-key.checkout-page {
     background-color: #0f0f0f;
     min-height: 100vh;
     padding-bottom: 0px;
 }


 .body-key.checkout-page .site-tabs-contents {
     background-color: #0f0f0f;
 }

 .body-key.checkout-page .ad-area {
     background-color: #0f0f0f;
     margin-top: 3rem !important;
 }

 .body-key.checkout-page h1.size-200 {
     color: #FFFFFF;
     margin-top: -20px;
     padding-bottom: 20px;
 }


 /* -------------------------------------------------
   CARD BASE
   ------------------------------------------------- */
 .card {
     background: linear-gradient(180deg, #444 0%, #000 100%) !important;
     border-radius: 12px;
     border: 1px solid rgba(255, 255, 255, .08);
     padding: 34px 40px;
     transition: all .3s ease;
     margin-bottom: 30px;
 }

 /* Popular card */
 .card.popular {
     border: 1.5px solid #b899ff;
     background-color: #161616 !important;
     position: relative;
     box-shadow: 0 0 12px rgba(184, 153, 255, .2);
 }

 .card.popular::before {
     content: "Most popular";
     position: absolute;
     top: -14px;
     left: 50%;
     transform: translateX(-50%);
     background: #fff;
     color: #000;
     font-size: .75rem;
     font-weight: 600;
     padding: 4px 12px;
     border-radius: 12px;
 }

 .card img {
     display: block;
     margin-bottom: 20px;
     width: 85px;
     margin-left: -6px;
 }

 .card h3 {
     font-size: 19px;
     font-weight: 500;
     letter-spacing: 0.4px;
     margin: 0 0 8px 0;
     color: white;
 }

 .card p.sub {
     font-size: 15px;
     color: #b3b3b3;
     margin: 0 0 14px 0;
 }

 .price {
     font-size: 32px;
     font-weight: 500;
     margin: 0 0 18px 0;
     color: white;
 }

 .pay-btn {
     display: block;
     width: 100%;
     background-color: #b899ff;
     border: none;
     border-radius: 6px;
     color: #000;
     font-size: 16px;
     font-weight: 500;
     padding: 13px 0;
     text-align: center;
     text-decoration: none;
     transition: background-color 0.3s ease, transform 0.2s ease;
 }

 .pay-btn:hover {
     background-color: #a178ff;
     transform: translateY(-2px);
 }

 .includes-title {
     font-size: 15px;
     font-weight: 500;
     color: #fff;
     margin-top: 22px;
     margin-bottom: 10px;
 }

 .features {
     margin-top: 10px;
 }

 .features p {
     font-size: 14px;
     color: #ccc;
     margin: 12px 0;
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .features p::before {
     content: '✔';
     color: #b899ff;
     background-color: #1c1c1c;
     border-radius: 50%;
     width: 18px;
     height: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 12px;
     line-height: 1;
     flex-shrink: 0;
 }

 .features p.red::before {
     content: '✖';
     color: #ff4b4b;
     background-color: #1c1c1c;
     font-size: 12px;
 }


 .checkout-page .pro-badge-strip {
     padding: 20px 15px 20px 25px;
     background: linear-gradient(180deg, #444 0%, #000 150%);
     border-radius: 15px;
 }

 .checkout-page .pro-badge-strip p {
     letter-spacing: 1px;
 }

 /* -------------------------------------------------
   RESPONSIVE BREAKPOINTS (optional – keep your own)
   ------------------------------------------------- */
 @media (max-width: 576px) {
     .card {
         padding: 24px 20px;
     }
 }