@font-face {
            font-family: 'InterVar';
            src: url('assets/css/vendors/Inter-VariableFont_opsz,wght.woff2') format('woff2');
            font-weight: 100 900;/* Rentang bobot variable */
            font-style: normal;
            font-display: swap;
        }
        html,
        body,
        
        .btn {
            font-family: 'ZurichSans', Arial, Helvetica, sans-serif;
            font-variation-settings: 'wght' 400;
            font-size: 16px;
            color: #23366f;
        }
        
        .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
		    color: #23366f;
		}
        .navbar .container::before,
        .navbar .container::after {
            display: none;
        }

        .navbar:not(.nav-mobile) a {
            font-size: 1rem;
            color: #23366f;
        }

        [class*="visible-"] {
            display: none;
        }

        /* .new-header .logo .visible-xs,
        .new-header .logo .visible-sm {
            height: 24px;
            width: auto;
        }

        .new-header .logo .visible-md,
        .new-header .logo .visible-lg {
            height: 32px;
            width: auto;
        } */

        /* .new-header~main>.content {
            margin-top: 154px;
        } */

        .new-header,
        .navbar {
            z-index: 999;
        }
        
		.accordion-button {
		    gap: 1.875rem;
		}
		
		.accordion-button::after {
		    margin-left: auto;
		    background-image: url(../../img/arrow-down-outline.svg) !important;
		    width: 1.75rem;
		    height: 1.75rem;
		    background-size: 1.75rem;
		}
		
		.accordion-item:last-of-type {
		    border-bottom-right-radius: 0;
		    border-bottom-left-radius: 0;
		}
        .zurich-accordion .accordion-item {
            border: none;
            border-bottom: 1px solid #2167ae !important;
        }

        .zurich-accordion .accordion-header .accordion-button {
            background-color: unset;
            border: none;
            box-shadow: none;
            font-size: 1.5rem;
            font-weight: 300;
            color: #2167ae;
            padding: 1.5rem 0;
        }

        .zurich-accordion .accordion-collapse .accordion-body {
            padding: 0 0 1.5rem;
            font-weight: 300;
            line-height: 1.875;
            color: #23366f;
        }

        .zurich-accordion .accordion-body .accordion-list {
            margin-top: 1.5rem;
            padding-left: 1.5rem;
        }
        .container-fluid::before, .container-fluid::after {
		    display: none;
		}
        .container-faq {
            margin-top: 90px;
        }
        .bullet-list li:before, .check-list li:before, .number-list li:before {
		    vertical-align: middle !important;
		}

        * {
            box-sizing: border-box;
        }
		.content.double-side > .container {
            justify-content:center;
        }
        .container {
            height: auto;
        }
        .content.double-side {
            min-height: calc(100vh - 80px - 66px - 56px);
        }

        .double-side {
            display: flex;
            flex-direction: column;
        }
        .double-side>.container {
            display: flex;
            flex: 1;
        }

        a {
            color: #2167ae;
            text-decoration: none;
        }

        a:hover {
            color: #23366f;
        }

        .navbar a {
            font-size: 1rem;
            color: #23366f;
        }

        .nav-mobile {
            display: none;
            z-index: 1000;
            width: 100%;
            color: #fff;
        }

        .nav-mobile a {
            color: #fff;
        }

        .login-form {
            max-width: 380px;
        }

        .login-form input {
            height: 52px;
            background-color: #f3f4f5;
            outline: unset;
            border: none;
            border-radius: 52px;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
            font-size: 1.5rem;
        }

        .login-form input::placeholder {
            font-style: italic;
            opacity: 0.2;
            letter-spacing: initial;
            font-size: 1.25rem;
        }

        .login-form input[type=submit] {
            height: 52px;
            width: 100%;
            background-color: #2167ae;
            border: none;
            border-radius: 52px;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
            font-size: 1rem;
            background-image:unset !important;
            color:#fff;
        }

        .login-form input[type=submit]:disabled {
            background-color: #b5bac0;
            color: #23366f;
        }

        .form-info {
            border-radius: 0.5rem;
            border: 0.5px solid #92bfec;
        }

        .form-info p {
            font-size: 0.85rem;
            margin: 0;
        }

        .form-info small {
            font-size: 0.7rem;
            color: #2167ae;
        }

        .image-shape-container {
            display: flex;
            flex-direction: column;
            align-items: end;
            justify-content: end;
            height: 100%;
        }

        .img-woman {
            width: 100%;
            max-width: 420px;
            height: auto;
            aspect-ratio: 1;
            object-fit: cover;
            border-radius: 100%;
        }

        .img-shape {
            width: 60%;
            max-width: 292px;
            height: auto;
        }

        .custom-image-mobile {
            display: none;
            padding: 0;
            z-index: 0;
            width: 100%;
            overflow: hidden;
            height: 220px;
            margin-bottom: 40px;
        }

        .image-mobile-wrapper {
            position: absolute;
            left: -40px;
            bottom: 0;
            width: 140%;
            height: 220px;
            overflow: hidden;
            border-radius: 0 0 60% 100%;
        }

        .img-background-mobile {
            width: 100vw;
            height: 100%;
            transform: translateX(40px);
            object-fit: cover;
            filter: brightness(0.85);

        }

        .toggle-password {
            position: absolute;
            top: 50%;
            right: 2rem;
            transform: translateY(-50%);
            cursor: pointer;
        }

        .password-requirements {
            text-align: left;
            margin-left: 1rem;
            margin-right: 1rem;
        }

        .password-requirements ul li>i:not(.bi-check-circle-fill) {
            opacity: 0.4;
        }

        
/* FORM FLOATING STARTS */
.form-floating-custom {
    position: relative;
}

.form-floating-custom input {
    height: 52px;
    padding: 1.25rem 3rem 0.5rem 1.5rem;
    /* top lebih besar untuk label */
    font-size: 1.25rem;
    background-color: #f3f4f5;
    border: 1px solid transparent;
    border-radius: 52px;
    outline: transparent;
    transition: none;
}

.form-floating-custom label {
    position: absolute;
    top: 50%;
    left: 1.5rem;
    transform: translateY(-50%);
    font-size: 1.25rem;
    color: rgba(35, 54, 111, 0.6);
    pointer-events: none;
    transition: all 0.2s ease;
}

.form-floating-custom input:focus+label,
.form-floating-custom input:not(:placeholder-shown)+label {
    top: 0.38rem;
    left: 1.5rem;
    font-size: 0.8rem;
    color: #2167ae;
    transform: translateY(0);
}

.form-floating-custom input:hover {
    background-color: #ECEEEF;
    border: 1px solid #91BFE3;
}

.form-floating-custom input:focus {
    background-color: #ECEEEF;
    border: 1px solid #1390CD;
    outline: none;
    box-shadow: none;
}

/* FORM FLOATING ENDS */

        .bullet-list {
            list-style: disc;
            text-align: start;
            font-size: 0.85rem;
            margin-top: 0.5rem;
            padding-left: 1.25rem;
        }
        
        
        /* NEW HEADER */
        .new-header {
        	height: 80px !important;
        	min-height: unset !important;
        	margin-bottom: 0 !important;
        	border-bottom: 1px solid rgba(223,227,228,1);
        }
        .new-header .header-container {
        	display: flex;
			padding: 0 2rem;
			justify-content: space-between;
			height: 100%;
        }
		.new-header .header-container::before,
		.new-header .header-container::after {
		    display: none;
		}
		.new-header .header-container a.logo {
			margin: 0;
			position: static;
			height: fit-content;
   			margin: auto 0;
		}
        .new-header .header-container .navigation-main {
        	display: flex;
        	align-items: center;
        }
        .new-header .header-container .navigation-main a.right-nav {
        	cursor: pointer;
        }
        .new-password-form {
            max-width: 380px;
        }

        .new-password-form input {
            height: 52px;
            background-color: #f3f4f5;
            outline: unset;
            border: none;
            border-radius: 52px;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
            font-size: 1.25rem;
        }

        .new-password-form input::placeholder {
            /* font-style: italic; */
            color: #23366f;
            opacity: 0.6;
            letter-spacing: initial;
            font-size: 1.25rem;
        }

         .new-password-form input[type=button],
         .zurich-modal form input[type=button] {
            height: 52px;
            width: 100%;
            background-color: #2167ae;
            border: none;
            border-radius: 52px;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
            font-size: 1rem;
            background-image:unset !important;
            color:#fff;
        }

        .new-password-form input[type=button]:disabled,
         .zurich-modal form input[type=button]:disabled {
            background-color: #b5bac0;
            color: #23366f;
        }
        .img-right-area {
            width: 100%;
            max-width: 400px;
            height: auto;
            aspect-ratio: 1;
            object-fit: cover;
            border-radius: 100%;
        }
        .form-select {
            height: 52px;
            padding: 0.5rem 3rem 0.5rem 1.5rem;
            font-size: 1.25rem;
            background-color: #f3f4f5;
            border: none;
            border-radius: 52px;
            outline: none;
        }

        /* MODAL START */
        .zurich-modal .modal-content {
            position: relative;
            border-radius: 1.25rem;
        }

        .zurich-modal .modal-header {
            border: none;
            padding: 0 0.25rem;
            position: absolute;
            width: 100%;
            z-index: 999;
        }

        .zurich-modal .modal-header .close-modal {
            font-size: 1.75rem;
            font-weight: 300;
            color: #2167ae !important;
            margin-left: auto;
            border: none;
            outline: unset;
        }

        .zurich-modal .modal-header .close-modal:focus,
        .zurich-modal .modal-header .close-modal:active {
            border: none;
            outline: unset;
        }

        .zurich-modal .modal-body {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: start;
            padding: 3rem 1.5rem 1.5rem 1.5rem;
            gap: 1rem;
            text-align: center;
            font-weight: 300; 
            font-size: 18px;
            line-height: 1.65;
        }

        .zurich-modal .modal-body .modal-icon {
            max-width: 180px;
            margin-bottom: 0.5rem;
        }

        .zurich-modal .modal-body .modal-title {
            font-weight: 300;
		    margin-left: 1rem;
		    margin-right: 1rem;
		    font-size: 1.875rem;
        }
        
		.zurich-modal .modal-body .modal-subtitle {
		    max-width: 60%;
		    min-width: 244px;
		    margin-bottom: 0.5rem;
		}

        .zurich-modal .modal-body input {
            height: 52px;
            background-color: #f3f4f5;
            outline: unset;
            border: none;
            border-radius: 52px;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
            font-size: 1.5rem;
            letter-spacing: 4px;
        }

        .zurich-modal .modal-body input:not([type=button]) {
            letter-spacing: 4px;
        }

        .zurich-modal .modal-body button {
            height: 52px;
            width: 100%;
            background-color: #2167ae;
            border: none;
            border-radius: 52px;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
        }

        .zurich-modal .modal-body button:disabled {
            background-color: #b5bac0;
            color: #23366f;
        }

        .text-spacer {
            display: block;
            margin-bottom: 0.75rem;
        }
        #pageBody {
		    min-height: unset;
		    color: #23366f;
		}
        
        /* NEW FOOTER */
        .new-footer {
            height: 66px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            padding: 0 2rem;
            border-top: 1px solid rgba(223, 227, 228, 1);
        }

        .new-footer .footer-left-side {
            display: block;
        }

        .new-footer .copyright {
            color: #23366F;
        }

        .new-footer .footer-left-side>*,
        .new-footer .footer-right-side>* {
            display: inline;
            font-size: 12px;
            font-weight: 500;
            line-height: 18px;
        }

        .new-footer .footer-left-side>* {
            margin-right: 2rem;
        }

        .new-footer .footer-right-side>* {
            margin-left: 2rem;
        }
         /* NEW FOOTER ENDS */
        /*DROP DOWN*/
		.select-wrapper {
		  position: relative;
		  width: 100%;
		}
		
		.select2-container {
		  width: 100% !important;
		}
		
		.select2-dropdown {
		  width: 100% !important;
		  left: 0 !important;
		  right: 0 !important;
		  box-sizing: border-box;
		  z-index: 9999;
		}

		.select2-container--default .select2-selection--single {
		    height: 52px !important;
		    background-color: #f3f4f5 !important;
		    outline: unset !important;
		    border: none !important;
		    border-radius: 52px !important;
		    padding-left: 1.5rem !important;
		    padding-right: 1.5rem !important;
		    font-size: 1.5rem !important;
		    display: flex !important;
		    align-items: center !important;
		}
		
		.select2-container--default .select2-selection--single .select2-selection__rendered {
		    font-size: 20px !important;
		    padding: 0 !important;
		}
		
		.select2-container--default .select2-selection--single .select2-selection__arrow {
		    top: 13px !important;
		    right: 13px !important;
		}
		
		.select2-results__option {
			border-bottom: 1px solid #b8b8b8 !important;
		}
		
		.select2-results__option:last-child {
			border-bottom: unset !important;
		}

        .forgot-password-form .new-password-form input {
        	font-size: 20px !important;
        }
		.password-icon {
		    width: 24px;
		    height: 24px;
		}
		.toggle-password::before {
		  content: none !important;
		}
		
		
/* SELECT2 STARTS */

.select2 {
    margin-bottom: 1.5rem;
}

/* Hapus ikon bawaan */
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    display: none;
}

/* Ganti ikon bawaan dengan SVG lokal */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    background: url('icons/arrow-down-outline.svg') no-repeat center;
    background-size: 1.5rem;
    width: 2rem;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.4s ease;
    pointer-events: none;
}

/* Saat dropdown terbuka (select2 menambahkan class ini) */
.select2-container--open .select2-selection--single .select2-selection__arrow {
    transform: translateY(-60%) scaleY(-1);
}

.select2-selection__arrow {
    transform-origin: center center;
}

.select2-container--default .select2-selection--single {
    padding-right: 2.5rem;
    /* beri ruang untuk icon kanan */
    height: 2.5rem;
    display: flex;
    align-items: center;
}

.select2 .selection .select2-selection {
    height: 52px;
    padding: 0.5rem 3rem 0.5rem 1.5rem;
    /* top lebih besar untuk label */
    font-size: 1.25rem;
    background-color: #f3f4f5;
    border: 1px solid transparent;
    border-radius: 52px;
    outline: transparent;
    transition: none;
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom-left-radius: 52px !important;
    border-bottom-right-radius: 52px !important;
}

/* Saat fokus atau dropdown terbuka */
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border: 1px solid #1390CD;
    background-color: #ECEEEF;
    outline: none;
}

.select2-container--default.select2-container--below .select2-selection--single>span,
.select2-container--default.select2-container--focus .select2-selection--single>span,
.select2-container--default.select2-container--open .select2-selection--single>span {
    color: #2167ae;
}

/* Style options dropdown */
.select2-dropdown {
    background-color: #ECEEEF;
    padding: 1rem;
    border: none;
    outline: none;
    border-radius: 1.5rem !important;
    box-shadow: 0.0px 10.0px 13.0px -6.0px rgba(0, 0, 0, 0.07), 0.0px 20.0px 31.0px 3.0px rgba(0, 0, 0, 0.05), 0.0px 8.0px 38.0px 7.0px rgba(0, 0, 0, 0.03);
}

.select2-results .select2-results__options li {
    border-radius: 100px;
    font-size: 1.25rem;
    padding: 0.5rem 1.25rem;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #2167ae;
}

.select2-container--default .select2-results__option--selected {
    background-color: transparent;
}

/* SLECET2 ENDS */
				
				
/* FORM VALIDATION STARTS */
.form-floating-custom.error-filled.has-hint {
    margin-bottom: 3rem !important;
}

.form-floating-custom.error-filled input {
    border: 1px solid #cb4b3f;
}

.form-floating-custom.error-filled input,
.form-floating-custom.error-filled label,
.form-floating-custom.error-filled input:focus+label,
.form-floating-custom.error-filled input:not(:placeholder-shown)+label {
    color: #cb4b3f;
}

.error-filled .error-hint {
    display: block;
    font-size: 0.8rem;
    line-height: 1.5rem;
    width: 100%;
    left: 0;
    text-align: start;
    margin-left: 1.5rem;
    color: #cb4b3f;
}

.error-hint {
    display: none;
}

/* FORM VALIDATION ENDS */