@charset "utf-8";

.customer-support-banner .left { width: 50%; position: relative; min-height: 700px; }
.customer-support-banner .left .pic {position: absolute; left: 150px; top: 100px; width: 100%;}
.customer-support-banner .right { width: 50%;}
.customer-support-form { background-color: #fff; padding: 40px; border-radius: 16px; border: 1px solid #C6E1FF;}
.customer-support-form h3 { font-size: 48px; font-weight: 500; padding-bottom: 30px; margin: 0;}
.support-options {display: flex; gap: 20px;}
.option {display: flex; align-items: center; cursor: pointer; position: relative; width: 50%; margin: 0; padding: 0 0 30px; left: 0; top: 0;}
.option input[type="radio"] {display: none;}
.custom-radio {width: 24px; height: 24px; border: 2px solid #9F9F9F; border-radius: 50%; position: relative; margin-right: 13px; flex-shrink: 0; transition: all 0.3s ease;}
.option input[type="radio"]:checked + .custom-radio::after { content: ""; width: 11px; height: 11px; background: #F28C52; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.option .text { font-family: var(--title-font); font-size: 20px; font-weight: 500; color: #04043F; line-height: 1.3;}
.privacy-consent {display: flex; align-items: flex-start;  gap: 20px; padding: 6px 0 30px;}
.checkbox-wrap {position: relative; width: 24px; height: 24px; flex-shrink: 0; cursor: pointer; left: 0; top: 0; padding: 0; margin: 5px 0 0;}
.checkbox-wrap input {position: absolute; opacity: 0; cursor: pointer;}
.checkmark {width: 24px; height: 24px; display: block; border: 2px solid #C1C1C1; border-radius: 2px; background: #fff; transition: all 0.3s ease;}
.checkbox-wrap input:checked + .checkmark { background: #EF8354; border-color: #EF8354;}
.checkbox-wrap input:checked + .checkmark:after {content: ""; position: absolute; left: 9px; top: 5px; width: 4px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);}
.privacy-text {font-size: 16px; line-height: 1.3; color: #3C3C3C;}
.privacy-text .title { margin: 0 0 10px;}
.privacy-text .description { margin: 0; padding: 0;}
.form-row.btn-row .form-group { margin-bottom: 0;}
.form-row.btn-row { justify-content: space-between;}
.form-row.btn-row .form-group { margin: 0; width: auto;}

@media (max-width: 1800px) {
    .customer-support-banner .left .pic { left: 0;}
    .customer-support-form { padding: 25px;}
    .customer-support-form h3 { font-size: 35px;}
    .option .text {font-size: 16px;}
}
@media (min-width: 1199px) {
    .customer-support-form { padding: 20px;}
    .customer-support-banner .left { width: 45%;}
    .customer-support-banner .right { width: 55%;}
}
@media (max-width: 991px) {
    .customer-support-banner .left, .customer-support-banner .right { width: 100%;}
    .customer-support-form .form-group { margin-bottom: 15px;}
    .form-row.btn-row .form-group.capcha { margin-bottom: 15px;}
}

@media (max-width: 767px) {
    .customer-support-banner.home-banner .left h1 { font-size: 34px; text-align: center; }
    .customer-support-banner .left { width: 100%; position: relative; min-height: 100px; padding-right: 0!important; }
    .customer-support-banner .left .pic {position: relative; left: 0px; top: 0px; margin-top: -30%;}
    .customer-support-banner .right { width: 100%;}
    .privacy-consent {gap: 15px; }
    .privacy-text .title, .privacy-text .description {font-size: 13px; }
    .customer-support-form { padding: 20px;}
    .customer-support-form h3 { font-size: 26px;}
    .support-options { flex-wrap: wrap; gap: 15px; padding-bottom: 15px;}
    .option { width: 100%; padding: 0;}
    .form-row.btn-row { flex-direction: column-reverse;}
}