.affiliate-page {background-color: var(--c-affiliate); padding-block: 30px;}
.affiliate-page .wrapper {display: grid; grid-template-columns: repeat(2, 1fr); align-items: start; gap: 30px;}
.affiliate-page .left-col {background-color: #fff; padding: 15px;}
.affiliate-page .left-col > :first-child {display: block; font-size: 20px; font-weight: 700; text-transform: capitalize; color: var(--c-card-anchor); padding-bottom: 15px; margin: 0 0 30px; position: relative;}
.affiliate-page .left-col > :first-child::after {content: ""; width: 70px; height: 3px; position: absolute; bottom: 0; left: 0; background: var(--c-heading-after);}
.affiliate-page form label {display: block; font-size: 13px; font-weight: 700; color: #000; margin-bottom: 8px;}
.affiliate-page form input, .affiliate-page form textarea {height: 40px; font-size: 12px; color: var(--c-affiliate-input); background-color: #fff; padding: 6px 12px; border: 1px solid var(--c-input-complaint); margin-bottom: 16px;}
.affiliate-page form textarea {height: 100px;}
.affiliate-page form button { width: 100%; max-width: 200px; font-size: 14px; color: #fff; background-color: var(--c-affiliate-btn); padding: 10px; border: 1px solid var(--c-affiliate-btn);}
.affiliate-page .right-col {columns: #000; background-color: #fff; padding: 15px;}
.affiliate-page .description > :first-child {font-size: 24px; font-weight: 500; line-height: 1.2; margin-bottom: 8px;}
.affiliate-page .description b {font-weight: 800;}
.affiliate-page .description p {margin-bottom: 16px;}
.affiliate-page .description :where(h3, h4, h5, h6) {font-size: 20px; font-weight: 500; line-height: 1.2; margin-bottom: 8px;}

/* ORDER TRACK */
.track-order {margin-bottom: 40px;}
.track-order .breadcrumb a {text-decoration: unset;}
.track-order .breadcrumb span {color: var(--c-hover);}
.track-order .track-content > :first-child {font-size: 22px; font-weight: 700; text-transform: capitalize; color: var(--c-card-anchor); padding-bottom: 15px; margin: 0 0 40px; position: relative;}
.track-order .track-content > :first-child::after {content: ""; width: 70px; height: 3px; position: absolute; bottom: 0; left: 0; background: var(--c-heading-after);}
.track-order .track-content p {font-size: 13px; color: #000; margin-bottom: 16px;}
.track-order form {display: flex; align-items: center; gap: 10px;}
.track-order form input {width: 40%; height: 40px; font-size: 16px; font-weight: 400; line-height: 1.5; background-color: #fff; color: var(--c-affiliate-input); padding: 6px 12px; border: 1px solid var(--c-input-complaint); border-radius: 4px;}
.track-order form button {width: 100%;  max-width: 200px; height: 40px; font-size: 13px; color: #fff; background-color: var(--c-primary); padding: 5px 20px; border-radius: 3px; transition: background-color 0.1s;}
.track-order form button:hover {background-color: var(--c-hover-lg);}

/* SELL AT LAPTAB */
.sell-laptab .breadcrumb a {text-decoration: unset;}
.sell-laptab .breadcrumb span {color: var(--c-hover);}
.sell-laptab .main-content > :first-child {font-size: 22px; font-weight: 700; text-transform: capitalize; color: var(--c-card-anchor); padding-bottom: 15px; margin: 0 0 40px; position: relative;}
.sell-laptab .main-content > :first-child::after {content: ""; width: 70px; height: 3px; position: absolute; bottom: 0; left: 0; background: var(--c-heading-after);}
.sell-laptab .note-img {padding-left: 15px;}
.sell-laptab .laptab-customer {position: relative; padding-bottom: 10px;}
.sell-laptab .laptab-customer > img {height: 100%; position: absolute; top: 0; left: 0;}
.sell-laptab .laptab-customer h2 {font-size: 26px; font-weight: 500; text-transform: uppercase; text-align: center; line-height: 1.2; color: #fff; padding: 20px; margin-bottom: 8px; position: relative;}
.sell-laptab .laptab-customer p {font-size: 13px; text-align: center; color: #fff; padding: 25px; position: relative; margin-bottom: 16px;} 
.sell-laptab .laptab-customer a {width: fit-content; margin-inline: auto; position: relative;}
.sell-laptab .laptab-content > :first-child {font-size: 32px; font-weight: 500; text-transform: uppercase; line-height: 1.2; padding: 20px; margin-bottom: 8px;}
.sell-laptab .laptab-content > :first-child > * {font-weight: 800; color: var(--c-progress);}
.sell-laptab .laptab-content .list-wrap {display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; margin-bottom: 16px;}
.sell-laptab .laptab-content li {font-size: 13px; color: #000; list-style: none;}
.sell-laptab .content {display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px;}
.sell-laptab .left-col {display: flex; align-items: center; justify-content: end;}
.sell-laptab .right-col {padding-top: 25px;}
.sell-laptab .right-col > :first-child {display: block; font-size: 32px; font-weight: 700; text-transform: uppercase; line-height: 1.2; margin-bottom: 8px;}
.sell-laptab .right-col > :nth-child(2) {font-size: 32px; font-weight: 700; text-transform: uppercase; line-height: 1.2; margin-bottom: 8px;}
.sell-laptab .right-col ul {margin-bottom: 16px;}
.sell-laptab .right-col li {font-size: 13px; color: #000; list-style: none;}
.sell-laptab .step-1 .left-col img {margin-block: 25px 65px; }
.sell-laptab .step-1 .right-col > :first-child, .sell-laptab .step-3 .right-col > :first-child {color: var(--c-sell-heading);}
.sell-laptab .step-2 {background-color: var(--c-step2-bg);}
.sell-laptab .step-2 .right-col > :first-child {color: #fff;}
.sell-laptab .step-4 {background-color: var(--c-step4-bg);}
.sell-laptab .step-4 .left-col {justify-content: start;}
.sell-laptab .step-4 .right-col > :first-child {color: #fff;}


@media only screen and (max-width: 1200px) {
    .sell-laptab .laptab-customer h2 {font-size: 22px; padding: 15px;}
    .sell-laptab .laptab-customer p {padding: 15px 25px;}
    .sell-laptab .laptab-content > :first-child {font-size: 26px; padding: 15px;}
    .sell-laptab .right-col > :first-child,
    .sell-laptab .right-col > :nth-child(2) {font-size: 26px;}
}

@media only screen and (max-width: 992px) {
    .sell-laptab .main-content > :first-child {font-size: 20px; margin-bottom: 25px;}
    .sell-laptab .note-img {padding-left: 0;}
    .sell-laptab .laptab-customer h2 {font-size: 18px; padding: 10px;}
    .sell-laptab .laptab-customer p {font-size: 12px; padding: 10px 20px;}
    .sell-laptab .laptab-content {overflow-x: hidden;}
    .sell-laptab .laptab-content > :first-child {font-size: 22px; margin-bottom: 0; padding: 15px 0;}
    .sell-laptab .laptab-content .list-wrap {gap: 15px;}
    .sell-laptab .content {gap: 15px;}
    .sell-laptab .right-col {padding-top: 15px;}
    .sell-laptab .right-col > :first-child,
    .sell-laptab .right-col > :nth-child(2) {font-size: 20px;}
}

@media only screen and (max-width: 768px) {
    .sell-laptab .main-content > :first-child {font-size: 18px; margin-bottom: 20px;}

    .sell-laptab .laptab-customer h2 {position: relative; padding: 15px 10px 5px;}
    .sell-laptab .laptab-customer p {position: relative; padding: 0 10px 8px; margin-bottom: 10px;}
    .sell-laptab .laptab-customer a {position: relative;}

    .sell-laptab .laptab-content > :first-child {font-size: 20px; text-align: center; padding: 15px 0;}
    

    .sell-laptab .content {grid-template-columns: 1fr; text-align: center;}
    .sell-laptab .left-col {justify-content: center;}
    .sell-laptab .step-4 .left-col {justify-content: center;}
    .sell-laptab .right-col {padding-top: 0; padding-inline: 15px 15px;}
    .sell-laptab .right-col ul {text-align: left;}
    .sell-laptab .step-4 .right-col {padding-bottom: 15px;}
    .sell-laptab .step-1 .left-col img {margin-block: 15px 25px;}
}

@media only screen and (max-width: 576px) {
    .sell-laptab .main-content > :first-child {font-size: 16px; margin-bottom: 15px;}
    .sell-laptab .laptab-customer h2 {font-size: 16px;}
    .sell-laptab .laptab-customer p {font-size: 12px;}
    .sell-laptab .laptab-content .list-wrap {grid-template-columns: 1fr;} 
    .sell-laptab .laptab-content > :first-child {font-size: 18px;}
    .sell-laptab .laptab-content li,
    .sell-laptab .right-col li {font-size: 12px;}
    .sell-laptab .right-col > :first-child,
    .sell-laptab .right-col > :nth-child(2) {font-size: 18px;}
    .sell-laptab .left-col img {max-width: 100%; height: auto;}
    .sell-laptab .step-1 .left-col img {margin: 0;}
}

@media only screen and (max-width: 480px) {
    .sell-laptab .laptab-customer h2 {padding: 10px 8px 5px;}
    .sell-laptab .laptab-customer p {padding: 0 8px 10px;}
    .sell-laptab .right-col {padding-inline: 10px;}
}




@media only screen and (max-width: 1200px) {
    .affiliate-page .wrapper {gap: 20px;}
    .affiliate-page .left-col > :first-child {margin-bottom: 20px;}
    .affiliate-page form input, .affiliate-page form textarea {margin-bottom: 10px;}
}

@media only screen and (max-width: 992px) {
    .affiliate-page {padding-block: 20px;}
    .affiliate-page .left-col {padding: 15px;}
    .affiliate-page .left-col > :first-child {font-size: 18px; margin-bottom: 20px;}
    .affiliate-page .right-col {padding: 15px;}
    .affiliate-page .description > :first-child {font-size: 20px;}
    .affiliate-page .description :where(h3, h4, h5, h6) {font-size: 18px;}
    /* ORDER TRACK */
    .track-order {margin-bottom: 30px;}
    .track-order .track-content > :first-child {font-size: 20px; margin-bottom: 20px;}
}

@media only screen and (max-width: 768px) {
    .affiliate-page .wrapper {grid-template-columns: 1fr; gap: 20px;}
    .affiliate-page .left-col > :first-child {font-size: 17px; margin-bottom: 15px;}
    .affiliate-page .description > :first-child {font-size: 18px;}
    .affiliate-page .description :where(h3, h4, h5, h6) {font-size: 17px;}
    .affiliate-page form label {margin-bottom: 4px;}
    /* ORDER TRACK */
    .track-order {margin-bottom: 20px;}
    .track-order .track-content > :first-child {font-size: 18px; padding-bottom: 10px; margin-bottom: 18px;}
    .track-order .track-content p {font-size: 12px;}
    .track-order form input {width: 100%;}
    .track-order form button {max-width: 180px;}
}

@media only screen and (max-width: 576px) {
    .affiliate-page {padding-block: 15px;}
    .affiliate-page .left-col {padding: 12px;}
    .affiliate-page .left-col > :first-child {font-size: 16px; padding-bottom: 10px; margin-bottom: 15px;}
    .affiliate-page form label {font-size: 12px;}
    .affiliate-page form input, .affiliate-page form textarea {height: 36px; font-size: 12px; margin-bottom: 12px;}
    .affiliate-page form textarea {height: 90px;}
    .affiliate-page form button {max-width: 100%;}
    .affiliate-page .right-col {padding: 12px;}
    .affiliate-page .description > :first-child {font-size: 16px;}
    .affiliate-page .description :where(h3, h4, h5, h6) {font-size: 15px;}
    .affiliate-page .description p {font-size: 13px; margin-bottom: 12px;}
    /* ORDER TRACK */
    .track-order .track-content > :first-child {font-size: 16px; padding-bottom: 10px; margin-bottom: 15px;}
    .track-order form {gap: 10px;}
    .track-order form input {height: 36px; font-size: 13px;}
    .track-order form button {height: 36px;}
}

@media only screen and (max-width: 480px) {
    .affiliate-page .left-col > :first-child {margin-bottom: 12px;}
    .affiliate-page form input, .affiliate-page form textarea {margin-bottom: 10px;}
    /* ORDER TRACK */
    .track-order .track-content p, .track-order .track-content > :first-child {margin-bottom: 10px;}
    .track-order form {flex-direction: column; gap: 6px;}
    .track-order form button {max-width: unset;}
}