@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaExtraboldRegular.woff2') format('woff2'),
    url('../fonts/ProximaNovaExtraboldRegular.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaBlackRegular.woff2') format('woff2'),
        url('../fonts/ProximaNovaBlackRegular.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaMediumRegular.woff2') format('woff2'),
        url('../fonts/ProximaNovaMediumRegular.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaRegular.woff2') format('woff2'),
        url('../fonts/ProximaNovaRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaLightRegular.woff2') format('woff2'),
        url('../fonts/ProximaNovaLightRegular.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaSemiboldRegular.woff2') format('woff2'),
        url('../fonts/ProximaNovaSemiboldRegular.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaBold.woff2') format('woff2'),
        url('../fonts/ProximaNovaBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url('../fonts/ProximaNovaThinRegular.woff2') format('woff2'),
        url('../fonts/ProximaNovaThinRegular.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

/* =============================================================================
   BASE TYPOGRAPHY
   ============================================================================= */
h1, h2, h3, h4, h5, h6 {
    text-transform: inherit;
    color: #000; /* UX/ACCESSIBILITY: High contrast color meets WCAG AAA standards */
    font-family: 'Poppins', sans-serif; /* UX: Fallback to sans-serif if Poppins fails */
    margin-top: 0; 
    margin-bottom: 0;
}

p {
    color: #000; /* UX/ACCESSIBILITY: High contrast color meets WCAG AAA standards */
    font-family: 'Poppins', sans-serif; /* UX: Fallback to sans-serif if Poppins fails */
    margin-top: 0; 
    margin-bottom: 0;
}

/* =============================================================================
   LAYOUT CONTAINERS
    ============================================================================= */


.new_header .container,
.getstarted_section .container,
.congratulation_section .container,
.cong_services .container {
    max-width: 1182px;
    width: 100%;
    margin: 0 auto;
}

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

.new_header {
    padding: 0 !important;
}

.new_header .header_midbox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 0;
}

.new_header .header_midbox img {
    max-width: 176px;
    max-height: 30.88px;
}

.new_header .header_midbox p {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    color: #000;
    font-size: 14px;
    line-height: 21px;
}

.new_header .header_midbox p a {
    font-weight: 600;
    font-size: 14px;
    line-height: 100%;
    text-decoration: underline;
    color: #EE283B;
    transition: opacity 0.2s ease, color 0.2s ease;
}


.new_header .header_midbox p a:hover {
    opacity: 0.85;
    text-decoration: none;
}

.new_header .header_midbox p a:focus {
    outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
    outline-offset: 2px;
}

.new_header .header_midbox p a:focus-visible {
    outline: 2px solid #04a3ab;
    outline-offset: 2px;
    text-decoration: underline; /* UX: Maintain underline on focus for clarity */
}

/* =============================================================================
   TEXT BANNER
   ============================================================================= */
.text_banner {
    background-color: #EE283B;
    color: #fff; /* UX/ACCESSIBILITY: White text on #EE283B background provides good contrast (WCAG AA compliant) */
    text-align: center;
	margin-top: 18px;
}
.text_banner {
    background-color: #EE283B;
    color: #fff; /* UX/ACCESSIBILITY: White text on #EE283B background provides good contrast (WCAG AA compliant) */
    text-align: center;
}

.text_banner h1 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 44px;
    line-height: 65px;
    text-align: center;
    margin: 0 auto;
    padding: 32px 0;
    color: #fff;
}

/* =============================================================================
   GET STARTED SECTION
   ============================================================================= */

.getstarted_section {
  background: #f5f5f6;
  padding: 64px 0;
}

.get_start {
    box-shadow: 0 21px 52px 0 #00000014;
    background-color: #fff;
    padding: 64px;
    border-radius: 15px;
    gap: 64px;
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: flex-start; /* UX FIX: Changed from "self-start" to "flex-start" */
    flex-wrap: wrap;
}

.get_start > div {
    width: 100%;
    min-width: 451px;
}

.get_start > div.getstarted_img {
    max-width: 485px;
}

.get_start > div.getstarted_img img {
    max-width: 100%;
    box-shadow: 0 21px 52px 0 #00000014;
}

.get_start > div.getstarted_img p {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 24px;
    margin: 0 0 16px;
    line-height: 36px;
    color: #000;
}

.get_start > div.getstarted_box {
    display: grid;
    gap: 32px;
    max-width: 451px;
}

.get_start > div.getstarted_box h2 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 28px;
    line-height: 41px;
    padding: 0 0 14px;
    border-bottom: 2px solid;
    margin: 0;
    margin-bottom: 0 !important;
    border-image-source: linear-gradient(90deg, #EDEDED 0%, #C8C8C8 51%, #EDEDED 100%);
    border-image-slice: 1;
    color: #000;
    text-transform: capitalize;
}

.get_start > div.getstarted_box h2.steps_heading {
    font-size: 42px;
    line-height: 65px;
}

.get_start > div.getstarted_box p {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
    padding: 0;
    margin: 0;
    height: auto;
}

/* =============================================================================
   FORM ELEMENTS
   ============================================================================= */
   
   
.get_start > div.getstarted_box form {
    gap: 16px;
    display: flex;
    flex-direction: column;
}

.get_start > div.getstarted_box form .started_submit {
    margin-top: 16px;
    padding: 10px 32px;
    border: none;
    font-family: 'Proxima Nova', sans-serif;
    font-weight: 800;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle;
    border-radius: 8px;
    color: #fff;
    background-color: #000;
    max-width: 140px;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
}

.get_start > div.getstarted_box form .started_submit:hover {
    background-color: #333;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.get_start > div.getstarted_box form .started_submit:active {
    transform: translateY(0);
}

.get_start > div.getstarted_box form .started_submit:focus {
    outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color for keyboard navigation */
    outline-offset: 2px;
}

/* UX/ACCESSIBILITY: Enhanced focus-visible for better keyboard navigation support */
.get_start > div.getstarted_box form .started_submit:focus-visible {
    outline: 2px solid #04a3ab;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(4, 163, 171, 0.2);
}
.get_start > div.getstarted_box form input.form-control {
    border: 1px solid #c4c4ca;
    background-color: #fff;
    padding: 11px 8px;
    border-radius: 8px;
    min-height: 46px;
    max-width: 411px;
    font-family: 'Poppins', sans-serif;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    width: 100%;
}

.get_start > div.getstarted_box form input.form-control:focus {
    border-color: #04a3ab;
    box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.1);
    outline: none;
}

/* UX/ACCESSIBILITY: Enhanced focus-visible for better keyboard navigation */
.get_start > div.getstarted_box form input.form-control:focus-visible {
    border-color: #04a3ab;
    box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.2);
    outline: 2px solid #04a3ab;
    outline-offset: 2px;
}

.get_start > div.getstarted_box form input.form-control:hover {
    border-color: #999;
}
.get_start > div.getstarted_box form div {
    position: relative;
}

.get_start > div.getstarted_box form div .info_icon {
    position: absolute;
    right: 4px;
    top: 38px;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.get_start > div.getstarted_box form div .info_icon:hover {
    opacity: 0.7;
    transform: scale(1.1);
}

.get_start > div.getstarted_box form div .info_icon:focus {
    outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
    outline-offset: 2px;
}

.get_start > div.getstarted_box form div .info_icon:focus-visible {
    outline: 2px solid #04a3ab;
    outline-offset: 2px;
    box-shadow: 0 0 0 2px rgba(4, 163, 171, 0.2);
}
.get_start > div.getstarted_box form div label {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #58595b;
  margin-bottom: 4px;
  line-height: 21px;
  letter-spacing: 0.21px;
  cursor: pointer;
}

.get_start > div.getstarted_box form div label span {
  color: #ee283b;
}

/* =============================================================================
   ERROR STATES
   ============================================================================= */

.get_start > div.getstarted_box form div .error_mes {
  display: block;
  margin-top: 4px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px; /* UX: Minimum readable size - consider 16px for better accessibility on mobile */
  line-height: 21px;
  color: #ee283b; /* UX: High contrast error color for visibility */
  animation: fadeIn 0.2s ease-in;
  min-height: 21px;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.get_start > div.getstarted_box form div .get-error {
  position: absolute;
  right: 50px;
  top: 38px;
}

.get_start > div.getstarted_box form input.form-control.error_border {
  border-color: #ee283b; /* UX: Clear visual error indication. Consider adding aria-invalid="true" in HTML */
}

.get_start > div.getstarted_box form input.form-control:disabled {
  background-color: #f5f5f6;
  color: #999;
  cursor: not-allowed;
  opacity: 0.7;
}

/* =============================================================================
   HELP SECTION
   ============================================================================= */
.help_section {
  padding: 64px 0;
  text-align: center;
}

.help_box h2 {
  margin: 0 auto;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 28px;
  line-height: 39px;
  text-align: center;
  margin-bottom: 0 !important;
  color: #333;
  text-transform: capitalize;
}

.help_box {
  display: grid;
  gap: 32px;
  max-width: 550px;
  margin: 0 auto;
}

.help_box p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  margin: 0;
  color: #000;
}

.help_box p a {
  font-weight: 600;
  color: #ee283b;
  transition: opacity 0.2s ease, color 0.2s ease;
}
.help_box p a:hover {
  opacity: 0.85;
  text-decoration: none;
}
.help_box p a:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.help_box p a:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
}
/* =============================================================================
   FOOTER SECTION
   ============================================================================= */

.new_footer {
  background-color: #f5f5f6;
  padding: 64px 0;
}

.footer_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.new_footer .footer_social ul {
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 11.89px;
  margin: 0;
}
.new_footer .footer_social ul li {
  transition: transform 0.2s ease;
}

.new_footer .footer_social ul li:hover {
  transform: translateY(-2px);
}

.new_footer .footer_social ul li a:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
  border-radius: 2px;
}

.new_footer .footer_social ul li a:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  border-radius: 2px;
}

.new_footer .footer_social {
  max-width: 167px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 12px; /* UX/ACCESSIBILITY: 12px is below recommended 14px minimum. Consider 14px for better readability */
  line-height: 152%;
  color: #000;
}

.new_footer .footer_social p {
  margin: 0;
}


.new_footer .footer_policy_link ul {
  list-style: none;
  padding: 0;
  display: flex;
  max-width: 600px;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  margin: 0;
}


.new_footer .footer_policy_link ul li a {
  line-height: 18px;
  color: #58595b;
  font-family: Poppins;
  font-weight: 400;
  font-size: 12px; /* UX/ACCESSIBILITY: 12px is below recommended 14px minimum. Consider 14px for better readability */
  text-align: center;
  padding: 0 7px;
  border-right: 0 solid #58595b;
  border-width: 1px;
}


.new_footer .footer_policy_link ul li a:hover {
  text-decoration: none;
}
.new_footer .footer_policy_link ul li a:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.new_footer .footer_policy_link ul li a:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
}

.new_footer .footer_policy_link ul li:last-child a {
  border-width: 0;
}

/* =============================================================================
   ACCOUNT INFO SECTION
   ============================================================================= */

.get_start.account_info {
  display: flex;
  gap: 32px;
  flex-direction: column;
}

.account_field_box {
  display: grid;
  gap: 16px;
}
.account_form-group {
  position: relative;
  max-width: 485px;
}
.account_form-group label {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #58595b;
  margin-bottom: 4px;
  letter-spacing: 0.21px;
  cursor: pointer;
  display: block;
}
.account_form-group label span {
  color: #ee283b;
}
.account_form-group .form-control {
  border: 1px solid #c4c4ca;
  background-color: #fff;
  padding: 11px 8px;
  border-radius: 8px;
  min-height: 46px;
  max-width: 451px;
  font-family: 'Poppins', sans-serif;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  width: 100%;
}

.account_form-group .form-control:focus {
  border-color: #04a3ab;
  box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.1);
  outline: none;
}

/* UX/ACCESSIBILITY: Enhanced focus-visible for better keyboard navigation */
.account_form-group .form-control:focus-visible {
  border-color: #04a3ab;
  box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.2);
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
}

.account_form-group .form-control:hover {
  border-color: #999;
}

.account_form-group .form-control:disabled {
  background-color: #f5f5f6;
  color: #999;
  cursor: not-allowed;
  opacity: 0.7;
}

.account_form-group .toggle-password {
  position: absolute;
  top: 35px;
  right: 50px;
  border: none;
  border-radius: 2px;
  font-family: Poppins;
  font-weight: 400;
  font-size: 12px; /* UX/ACCESSIBILITY: 12px is below recommended 14px minimum. Consider 14px for better readability */
  vertical-align: middle;
  line-height: 24px;
  color: #000;
}

.account_form-group .toggle-password:hover {
  color: #ee283b;
}

.account_form-group .toggle-password:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.account_form-group .toggle-password:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  box-shadow: 0 0 0 2px rgba(4, 163, 171, 0.2);
}

.account_form-group .toggle-password i {
  font-family: "FontAwesome", sans-serif;
  font-style: normal;
}

.account_form-group .info_icon {
  position: absolute;
  right: 4px;
  top: 38px;
  cursor: pointer;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.account_form-group .info_icon:hover {
  opacity: 0.7;
  transform: scale(1.1);
}

.account_form-group .info_icon:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.account_form-group .info_icon:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  box-shadow: 0 0 0 2px rgba(4, 163, 171, 0.2);
}

.account_form-group .error_mes {
  display: block;
  margin-top: 4px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px; /* UX: Consider 16px for better mobile readability */
  line-height: 21px;
  color: #ee283b; /* UX: High contrast error color for visibility */
  animation: fadeIn 0.2s ease-in;
  min-height: 21px;
}
.account_form-group .get-error {
  position: absolute;
  right: 50px;
  top: 38px;
}

.account_field_box_two .account_form-group .get-error {
  right: 16px;
}

/* =============================================================================
   ACCOUNT INFO BOX FORM
   ============================================================================= */

form.account_info_box {
  width: 100%;
}

.account_info_box .account_field {
  display: grid;
  width: 100%;
  align-items: flex-start;
  gap: 50px;
  grid-template-columns: 1fr 1fr;
}
.account_field_box_two {
  max-width: 451px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.review_part {
  display: grid;
  margin-top: 16px;
  grid-template-columns: 1fr 1fr;
}

form.account_info_box {
  display: grid;
  gap: 32px;
}

/* =============================================================================
   CHECKBOX STYLES
   ============================================================================= */
.account_info_box .account_checkbox {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.account_info_box .account_checkbox.transfer_portin {
  flex-direction: column;
}

.account_info_box .account_checkbox [type="checkbox"] {
  width: 16px;
  height: 16px;
  border: 1px solid #c4c4ca;
  min-width: 16px;
  accent-color: #04a3ab;
  margin: 4px;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  flex-shrink: 0;
}

.account_info_box .account_checkbox [type="checkbox"]:focus {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
}
.account_info_box .account_checkbox p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 12px; /* UX/ACCESSIBILITY: 12px is below recommended 14px minimum. Consider 14px for better readability, especially for terms/legal text */
  line-height: 18px;
  color: #000;
  letter-spacing: -0.24px;
  margin-bottom: 0;
  flex: 1;
}

.account_info_box .account_checkbox p a {
  color: #ee283b;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.account_info_box .account_checkbox p a:hover {
  opacity: 0.85;
  text-decoration: none;
}

.account_info_box .account_checkbox p a:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.account_info_box .account_checkbox p a:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
}

.account_button {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.account_button .started_back {
  border: 1px solid #000000;
  border-radius: 6px;
  max-width: 105px;
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Proxima Nova', sans-serif;
  font-weight: 800;
  font-size: 18px;
  line-height: 24px;
  text-align: center;
  vertical-align: middle;
  color: #000;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.1s ease;
  background-color: transparent;
}

.account_button .started_back:hover {
  background-color: #000;
  color: #fff;
  transform: translateY(-2px);
}

.account_button .started_back:active {
  transform: translateY(0);
}

.account_button .started_back:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.account_button .started_back:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.2);
}

.account_button .started_submit {
  background-color: #000;
  color: #fff;
  border: none;
  border-radius: 6px;
  height: 44px;
  min-width: 140px;
  font-family: 'Proxima Nova', sans-serif;
  font-weight: 800;
  font-size: 18px;
  line-height: 24px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.1s ease,
    box-shadow 0.2s ease;
}

.account_button .started_submit:hover:not(.disabled) {
  background-color: #333;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.account_button .started_submit:active:not(.disabled) {
  transform: translateY(0);
}

.account_button .started_submit:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.account_button .started_submit:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.2);
}
.account_button .started_submit.disabled,
.account_button .started_submit:disabled {
  background-color: #b5b5b5;
  cursor: not-allowed;
  opacity: 0.6;
  transform: none;
  box-shadow: none;
}

.account_button .started_submit.disabled:hover,
.account_button .started_submit:disabled:hover {
  background-color: #b5b5b5;
  transform: none;
  box-shadow: none;
}

/* =============================================================================
   REVIEW SECTION
   ============================================================================= */

.review_plan_details h4 {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 35px;
  margin: 0 0 16px;
}

.review_plan_details .plan_namereview {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
  color: #000;
}
.review_plan_details .renewal_date {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
  color: #58595b;
}
.review_account_info .review_account_heading,
.autoPay_account_info .review_account_heading {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  margin-bottom: 16px;
  color: #000;
}

.review_account_info p,
.autoPay_account_info p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #58595b;
  margin-bottom: 0;
}

.review_account_info p.review_account_heading {
  letter-spacing: 0.36px;
}

.review_account_info p {
  letter-spacing: 0.24px;
}

.account_info_box .account_checkbox.review_account_check p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.21px;
  margin: 0;
}

.account_info_box .account_checkbox.review_account_check {
  align-items: center;
}
/* =============================================================================
   CONGRATULATION SECTION
   ============================================================================= */

.congratulation_section {
  background-color: #f5f5f6;
  padding: 64px 0;
}

.congratulation_section .container .congratulation_box {
  padding: 64px 0 40px 64px;
  border-radius: 15px;
  background-color: #fff;
  box-shadow: 0 21px 52px 0 #00000014;
  background-image: url(../images/congratulation_banner.png);
  background-position: bottom right;
  background-repeat: no-repeat;
  background-size: contain;
}

.congratulation_text h1 {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 44px;
  line-height: 65px;
  padding-bottom: 11px;
  border-bottom: 2px solid;
  margin: 0 0 31px;
  border-image-source: linear-gradient(
    90deg,
    #ededed 0%,
    #c8c8c8 51%,
    #ededed 100%
  );
  border-image-slice: 1;
  color: #000;
  max-width: 451px;
}

.congratulation_text {
  max-width: 546px;
}

.congratulation_text .congrat_activate {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  margin-bottom: 16px;
  color: #000;
}

.congratulation_text p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #000;
  margin-bottom: 24px;
  max-width: 100%;
}

.congratulation_text p a {
  color: #ee283b;
  font-weight: 600;
  transition: opacity 0.2s ease;
}

.congratulation_text p a:hover {
  opacity: 0.85;
  text-decoration: none;
}

.congratulation_text p a:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.congratulation_text p a:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
}

/* =============================================================================
   INSERTING SECTION
   ============================================================================= */
.inserting_section .container {
  max-width: 1102px;
  width: 100%;
}

.inserting_section .container .inserting_box {
  padding: 64px 0;
  display: flex;
  gap: 50px;
}

.inserting_section .container .inserting_box .inserting_text {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.inserting_section .container .inserting_box .inserting_text h3 {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 47px;
  margin-top: 0;
  margin-bottom: 0;
}

.inserting_section .container .inserting_box .inserting_text ul {
  display: flex;
  flex-direction: column;
  gap: 32px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.inserting_section .container .inserting_box .inserting_text ul li {
  display: grid;
  gap: 16px;
  grid-template-columns: 35px auto;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #000;
}

.inserting_section .container .inserting_box .inserting_text ul li span {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background-color: #ee283b;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 100%;
  text-align: center;
  vertical-align: middle;
  flex-shrink: 0;
}

/* =============================================================================
   SERVICES SECTION
   ============================================================================= */
.cong_services {
  background-color: #f5f5f7;
  padding: 65px 0;
}

.cong_services .container .services_box h3 {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 51px;
  text-align: center;
  margin-bottom: 32px;
  color: #000;
  margin-top: 0;
}

.cong_services .container .services_box .services_sign {
  display: flex;
  gap: 64px;
  justify-content: center;
}

.cong_services .container .services_box .services_sign .cong_app {
  background-color: #fff;
  border-radius: 15px;
  max-width: 415px;
  width: 100%;
  box-shadow: 0 21px 52px 0 #00000014;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  gap: 16px;
}

.cong_services .container .services_box .services_sign .cong_sign {
  background-color: #fff;
  border-radius: 15px;
  max-width: 415px;
  width: 100%;
  box-shadow: 0 21px 52px 0 #00000014;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 32px;
}

.cong_services .container .services_box .services_sign .cong_sign p {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  margin-bottom: 16px;
}

.cong_services .container .services_box .services_sign .cong_sign a {
  cursor: pointer;
  background-color: #000;
  color: #fff;
  border-radius: 6px;
  padding: 10px 32px;
  font-family: 'Proxima Nova', sans-serif;
  font-weight: 800;
  font-size: 18px;
  line-height: 24px;
  text-align: center;
  vertical-align: middle;
  margin-bottom: 10px;
  text-decoration: none;
  transition: background-color 0.2s ease, transform 0.1s ease,
    box-shadow 0.2s ease;
}

.cong_services .container .services_box .services_sign .cong_sign a:hover {
  background-color: #333;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.cong_services .container .services_box .services_sign .cong_sign a:active {
  transform: translateY(0);
}

.cong_services .container .services_box .services_sign .cong_sign a:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.cong_services .container .services_box .services_sign .cong_sign a:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.2);
}

.cong_services
  .container
  .services_box
  .services_sign
  .cong_app
  .cong_app_text
  p {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #000;
  margin-bottom: 16px;
}

.cong_services
  .container
  .services_box
  .services_sign
  .cong_app
  .cong_app_text {
  max-width: 227px;
}

/* =============================================================================
   ENROLL AUTOPAY SECTION
   ============================================================================= */
.enroll_autopay_box {
  display: flex;
  justify-content: space-between;
  gap: 50px;
}

.enroll_autopay_box .account_info_box {
  max-width: 616px;
  width: 100%;
}

.enroll_autopay_box .enroll_summary {
  max-width: 358px;
}

.enroll_autopay_box .enroll_summary h3 {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 100%;
  letter-spacing: -0.02em;
  text-align: center;
  vertical-align: middle;
  color: #080808;
  padding-bottom: 16px;
  margin-bottom: 16px;
  margin-top: 0;
  border-image-source: linear-gradient(
    90deg,
    #ededed 0%,
    #c8c8c8 51%,
    #ededed 100%
  );
  border-image-slice: 1;
  border-bottom: 1px solid;
}

.enrollsummary_box .enroll_plan_summary {
  list-style: none;
  padding: 0;
  border-image-source: linear-gradient(
    90deg,
    #ededed 0%,
    #c8c8c8 51%,
    #ededed 100%
  );
  border-image-slice: 1;
  border-bottom: 1px solid;
  padding-bottom: 16px;
  margin-bottom: 16px;
  display: grid;
  gap: 16px;
}

.enrollsummary_box .enroll_plan_summary li {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: -0.02em;
  gap: 16px;
  color: #080808;
}

.enrollsummary_box .enroll_plan_summary li span:last-child {
  font-weight: 500;
}

.enrollsummary_box .enroll_plan_summary li span span {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.02em;
  display: block;
  color: #080808;
  margin-top: 5px;
}

.enrollsummary_box .enroll_total {
  list-style: none;
  padding: 0;
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
}

.enrollsummary_box .enroll_total li {
  display: flex;
  gap: 16px;
  justify-content: space-between;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: -0.02em;
  vertical-align: middle;
  color: #080808;
}

.enrollsummary_box .enroll_total li.total_valu {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 24px;
}

.enrollsummary_box .enroll_total li span:last-child {
  color: #000;
}

.enrollsummary_box p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 12px; /* UX/ACCESSIBILITY: 12px is below recommended 14px minimum. Consider 14px for better readability */
  line-height: 18px;
  letter-spacing: -0.02em;
  vertical-align: middle;
  color: #000000;
  margin-bottom: 0;
}

.terms_portin p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 12px; /* UX/ACCESSIBILITY: 12px is below recommended 14px minimum. Legal/terms text should be at least 14px for readability */
  line-height: 18px;
  margin: 0;
  letter-spacing: -0.02em;
  color: #000;
}

.terms_portin p a {
  color: #ee283b;
  font-weight: 600;
  transition: opacity 0.2s ease; /* UX: Added transition */
}

.terms_portin p a:hover {
  opacity: 0.85;
  text-decoration: none;
}

.terms_portin p a:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.terms_portin p a:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
}

/* =============================================================================
   PROGRESS INDICATOR
   ============================================================================= */

.progress-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #e53935;
  padding: 32px 0;
  color: #fff;
  max-width: 1095px;
  margin: 0 auto;
}

.progress_step {
  display: flex;
  align-items: center;
  flex: 1;
  position: relative;
  z-index: 1;
  max-width: 418px;
  width: 100%;
}
.progress_step:last-child {
  max-width: 165px;
}

.progress_step:not(:last-child)::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0%;
  left: 10%;
  width: 87%;
  height: 3px;
  border-radius: 6px;
  background: #fff;
  z-index: -1;
  transform: translateY(-50%);
}

.progress_circle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 148%;
  text-align: center;
}

.progress_label {
  background-color: #e53935;
  padding: 0 7px;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 148%;
  text-align: center;
}

/* Active step */
.progress_active .progress_circle {
  background: #115E67;
  color: #ffffff;
  border: 4px solid #ffffff;
}

/* Inactive steps */
.progress_inactive .progress_circle {
  background: #d9d9d9;
  color: #ffffff;
  border: 4px solid #ffffff;
}

.progress-card-mobile {
  padding: 32px 0;
  display: none;
  align-items: center;
  gap: 23px;
  justify-content: flex-start;
}

.progress-card-mobile .progress-circle {
  width: 51px;
  height: 51px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 12px; /* UX/ACCESSIBILITY: 12px is below recommended 14px minimum. Consider 14px for better mobile readability */
  line-height: 148%;
  text-align: center;
  vertical-align: middle;
  border-width: 5px;
  border-radius: 50%;
}

.progress-card-mobile .progress-circle::before {
  content: "";
  position: absolute;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: #ee283b;
}
.progress-card-mobile .progress-circle span {
  position: relative;
}

.progress-card-mobile .progress-text {
  text-align: left;
}

.progress-card-mobile .title {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 148%;
  text-align: center;
}

.progress-card-mobile .subtitle {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 12px; /* UX/ACCESSIBILITY: 12px is below recommended 14px minimum. Consider 14px for better mobile readability */
  line-height: 148%;
}

/* =============================================================================
   MODAL POPUP BOXES
   ============================================================================= */
.locatingsim_imei .modal-dialog {
  max-width: 674px;
  border-radius: 15px;
  width: auto;
  margin: 20% auto 0;
}

.locatingsim_imei .modal-dialog .modal-body {
  padding: 32px;
}

.locatingsim_imei .modal-dialog .modal-content {
  border-radius: 15px;
}

.locatingsim_imei .modal-dialog .modal-body h3 {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 35px;
  padding-bottom: 14px;
  border-bottom: 2px solid;
  margin: 0;
  border-image-source: linear-gradient(
    90deg,
    #ededed 0%,
    #c8c8c8 51%,
    #ededed 100%
  );
  border-image-slice: 1;
  margin-bottom: 16px;
}

.locatingsim_imei .modal-dialog .modal-body p {
  margin-bottom: 16px;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #000;
}

.locatingmodal_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 61px;
  margin-bottom: 16px;
}

.locatingmodal_box .locating_img {
  max-width: 231px;
  width: 100%;
}

.locatingmodal_box .locating_img img {
  width: 100%;
  max-height: 186px;
  max-width: max-content;
  margin: 0 auto;
}

.locatingmodal_box .locatingtext p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 100%;
}

.locatingsim_imei .modal-dialog .modal-body .locatingtext p:last-child {
  margin-bottom: 0;
}

.locatingsim_imei .btn.btn-default {
  background-color: #000;
  color: #fff;
  border: none;
  border-radius: 8px;
  margin: 0 auto;
  min-width: 111px;
  font-family: 'Proxima Nova', sans-serif;
  font-weight: 800;
  font-size: 18px;
  line-height: 24px;
  text-align: center;
  vertical-align: middle;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.1s ease,
    box-shadow 0.2s ease;
}

.locatingsim_imei .btn.btn-default:hover {
  background-color: #333;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.locatingsim_imei .btn.btn-default:active {
  transform: translateY(0);
}

.locatingsim_imei .btn.btn-default:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.locatingsim_imei .btn.btn-default:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.2);
}
.locatingimei_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.locatingimei_box h4 {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  margin-bottom: 4px;
  margin-top: 0;
}
.new_compatibility .modal-content {
  border-radius: 15px;
}

.new_compatibility .modal-dialog {
  max-width: 440px;
  margin: 20% auto 0;
}

.new_compatibility .modal-content .modal-body {
  padding: 32px;
}

.new_compatibility .modal-content h3 {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 35px;
  color: #000;
  margin: 0 0 16px;
  padding-bottom: 14px;
  border-bottom: 2px solid;
  border-image-source: linear-gradient(
    90deg,
    #ededed 0%,
    #c8c8c8 51%,
    #ededed 100%
  );
  border-image-slice: 1;
}

.new_compatibility .modal-content p {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #000;
  margin-bottom: 32px;
}

.new_compatibility .btn-default {
  background-color: #000;
  color: #fff;
  border: none;
  border-radius: 8px;
  margin: 0 auto;
  min-width: 111px;
  font-family: 'Proxima Nova', sans-serif;
  font-weight: 800;
  font-size: 18px;
  line-height: 24px;
  text-align: center;
  vertical-align: middle;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.1s ease,
    box-shadow 0.2s ease;
}
.new_compatibility .btn-default:hover {
  background-color: #333;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.new_compatibility .btn-default:active {
  transform: translateY(0);
}

.new_compatibility .btn-default:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Changed from transparent to visible color */
  outline-offset: 2px;
}

.new_compatibility .btn-default:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(4, 163, 171, 0.2);
}

/* =============================================================================
   PORT IN AUTO PAY SECTION
   ============================================================================= */

.account_checkbox.transfer_portin {
  display: flex;
  gap: 16px;
}
.account_checkbox.transfer_portin p {
  color: #000;
  letter-spacing: -0.018em;
  margin-bottom: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
}
.account_checkbox.transfer_portin p span {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 1.5%;
}
.account_info_box .account_checkbox.transfer_portin div {
  max-width: 494px;
  min-height: 24px;
  gap: 32px;
  display: flex;
}
.account_checkbox.transfer_portin div label {
  width: auto;
  height: 24px;
  gap: 9px;
  display: flex;
  position: relative;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: 0.4px;
  color: #58595b;
  cursor: pointer;
  align-items: center;
  margin-bottom: 0;
}
.account_checkbox.transfer_portin div label [type="checkbox"] {
  width: 16.9px;
  height: 16.9px;
  display: flex;
  cursor: pointer;
  border: 1px solid #d9d9d9;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.account_checkbox.transfer_portin div label [type="checkbox"]:focus {
  outline: 2px solid #04a3ab; /* UX/ACCESSIBILITY: Good - visible focus indicator */
  outline-offset: 2px;
}

.account_checkbox.transfer_portin div label [type="checkbox"]:focus-visible {
  outline: 2px solid #04a3ab;
  outline-offset: 2px;
  box-shadow: 0 0 0 2px rgba(4, 163, 171, 0.2);
}
.port_yes {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.account_checkbox.transfer_portin p.currentCarrier {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.4px;
  color: #000;
}
.port_add p {
  font-family: Poppins;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.4px;
  color: #000000;
  margin: 0;
}

/* =============================================================================
   CUSTOM CHECKBOX / RADIO STYLES
   ============================================================================= */

.new_header .header_midbox p br {
  display: none;
}


.checkbox-label input[type="checkbox"],
.checkbox-label input[type="radio"] {
  display: none;
}


.checkbox-label {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin: 0;
}


.custom-checkbox {
  min-width: 21px;
  height: 21px;
  border-radius: 4px;
  border: 1px solid #d9d9d9;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease;
}


.custom-checkbox::after {
  content: url("../images/check_box_check.png");
  font-size: 14px;
  color: #d9d9d9;
  display: none;
  font-family: FontAwesome;
}


input[type="checkbox"]:checked + .custom-checkbox,
input[type="radio"]:checked + .custom-checkbox {
  background: #00bfc8;
  border-color: #d9d9d9;
}

input[type="checkbox"]:checked + .custom-checkbox::after,
input[type="radio"]:checked + .custom-checkbox::after {
  display: block;
}

.checkbox-label input {
  position: absolute;
  opacity: 0;
}

.required_show {
  color: #ee283b;
}
.review_account_heading_box {
  display: grid;
  align-items: center;
  margin-bottom: 16px;
  grid-template-columns: auto 1fr;
  gap: 20px;
}

.review_account_heading_box > p {
  margin-bottom: 0 !important;
}

.review_account_heading_box a.edit-link {
  color: #00bfc8;
  font-family: Poppins;
  font-weight: 500;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 1.5px;
  text-transform: lowercase;
    transition: color 0.2s ease, opacity 0.2s ease;
}

.review_account_heading_box a.edit-link:hover {
    color: #037f86;
    opacity: 0.9;
}

.review_account_heading_box a.edit-link:focus {
    outline: 2px solid #00BFC8; /* UX/ACCESSIBILITY: Good - visible focus indicator */
    outline-offset: 2px;
}

.review_account_heading_box a.edit-link:focus-visible {
    outline: 2px solid #00BFC8;
    outline-offset: 2px;
    box-shadow: 0 0 0 2px rgba(0, 191, 200, 0.2);
}
.swal-text {
  color: #000;
}

.swal-modal .swal-button-container .swal-button {
  background-color: #000000 !important;
  border: 1px solid #000000 !important;
}

@media (max-width: 1158px) {
  .get_start {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .get_start > div {
    min-width: min-content;
  }
}

@media (max-width: 1024px) {
  .enroll_autopay_box .enroll_summary h3 {
    line-height: 36px;
  }
}

@media (max-width: 991px) {
  .enroll_autopay_box {
    display: grid;
    gap: 16px;
  }

  .enroll_autopay_box .enroll_summary {
    max-width: 100%;
  }

  .progress-container-desktop {
    display: none;
  }

  .progress-card-mobile {
    display: flex;
    justify-content: center;
  }

  .get_start > div.getstarted_box h2.steps_heading {
    font-size: 28px;
    line-height: 41px;
  }

  .congratulation_section .container .congratulation_box {
    padding: 32px 20px 230px;
  }

  .footer_box {
    gap: 16px;
    flex-direction: column;
  }
    .text_banner {
    margin-top: 23px;
}
}

@media (min-width: 768px) and (max-width: 1158px) {
  .get_start {
    gap: 32px;
    padding: 32px 20px;
  }
  .get_start > div.getstarted_box form input.form-control {
    max-width: 90%;
  }

  .account_form-group .form-control {
    max-width: 90%;
  }

  .account_form-group .toggle-password {
    right: 52px;
  }

  .account_field_box_two {
    max-width: 90%;
  }
  .account_field_box_two input.form-control {
    max-width: 100%;
  }
}

@media (max-width: 767px) {
   .text_banner {
        margin-top: 26px;
    }		
  .text_banner h1 {
    font-size: 28px;
    line-height: 41px;
  }
  .get_start {
    display: grid;
    grid-template-columns: 1fr;
    padding: 32px 20px;
    gap: 40px;
  }
  .get_start > div.getstarted_img,
  .get_start > div.getstarted_box {
    max-width: 100%;
  }
  .get_start > div.getstarted_box form input.form-control {
    max-width: 90%;
  }
  .get_start > div.getstarted_box form div .get-error {
    right: 15%;
  }

  .account_form-group .form-control {
    max-width: 90%;
  }

  .account_info_box .account_field {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .account_field_box_two {
    max-width: 90%;
  }
  .account_field_box_two .account_form-group .form-control {
    width: 100%;
    max-width: 100%;
  }
  .inserting_section .container .inserting_box,
  .cong_services .container .services_box .services_sign {
    display: grid;
  }
  .inserting_img {
    order: 2;
  }

  .inserting_img img {
    max-height: 233px;
    margin: 0 auto;
    display: block;
  }

  .congratulation_text h1 {
    font-size: 28px;
    line-height: 41px;
  }

  .congratulation_section .container .congratulation_box {
    background-image: url(../images/mobile-congratulation_banner.png);
  }

  .cong_services .container .services_box h3 {
    font-size: 28px;
    line-height: 39px;
  }
  .inserting_section .container .inserting_box .inserting_text h3 {
    font-size: 28px;
    line-height: 41px;
  }

  .locatingmodal_box,
  .locatingimei_box {
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
  }

  .new_compatibility .modal-content .modal-body {
    padding: 32px 20px;
  }

  .locatingsim_imei .modal-dialog .modal-body {
    padding: 32px 20px;
  }
  .locatingmodal_box .locating_img {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }

  .account_info_box .account_checkbox.review_account_check {
    align-items: flex-start;
  }

  .account_form-group .toggle-password {
    right: 15%;
  }
}
@media (max-width: 680px) {
    .text_banner {
        margin-top: 46px;
    }
}
@media (max-width: 575px) {
  .account_info_box .account_checkbox.transfer_portin > div {
    display: grid;
    gap: 16px;
  }

  .account_info_box .account_checkbox.transfer_portin > div.current_yesno {
    display: flex;
  }

  .cong_services .container .services_box .services_sign .cong_sign,
  .cong_services .container .services_box .services_sign .cong_app {
    padding: 32px 20px;
  }
  .cong_app_text div img {
    max-width: 89px;
  }
  .get_start > div.getstarted_img p {
    font-family: Poppins;
    line-height: 35px;
  }

  .new_header .header_midbox img {
    max-width: 141px;
  }
  .new_header .header_midbox p br {
    display: block;
  }

  .inserting_section .container .inserting_box {
    gap: 48px;
  }

  .get_start > div.getstarted_box p {
    line-height: 24px;
  }
}
@media (max-width: 400px) {
    .text_banner {
        margin-top: 16px;
    }
}
@media (max-width: 374px) {
  .get_start > div.getstarted_box h2.steps_heading {
    font-size: 21px;
    line-height: 30px;
  }

  .inserting_img img {
    width: 100%;
  }

  .cong_app_text div img {
    max-width: 64px;
  }

  .cong_services
    .container
    .services_box
    .services_sign
    .cong_app
    .cong_app_text
    p {
    font-size: 13px;
    line-height: 18px;
    margin-bottom: 15px;
  }
  .cong_services .container .services_box .services_sign .cong_sign p {
    font-size: 13px;
    line-height: 18px;
  }
}
@media (max-width: 360px) {
    .text_banner {
        margin-top: 35px;
    }
}