:root {
    --biru-1: #d2e0f0;
    --biru-2: #b3cbe6;
    --biru-3: #8eb2da;
    --biru-4: #6898cd;
    --biru-5: #427ec1;
    --biru-6: #1c64b4;
    --biru-7: #175396;
    --biru-8: #134378;
    --biru-9: #0e325a;
    --biru-10: #09213c;
    --biru-11: #061424;
    --biru-langit-1: #E6F1F9;
    --biru-langit-2: #D6E8F6;
    --biru-langit-3: #C2DDF1;
    --biru-langit-4: #ADD2EC;
    --biru-langit-5: #99C6E8;
    --biru-langit-6: #84BBE3;
    --biru-langit-7: #6E9CBD;
    --biru-langit-8: #587D97;
    --biru-langit-9: #425E72;
    --biru-langit-10: #2C3E4C;
    --biru-langit-11: #1A252D;
    --biru-tua-1: #d3dbe4;
    --biru-tua-2: #b6c3d1;
    --biru-tua-3: #92a5bb;
    --biru-tua-4: #6d87a4;
    --biru-tua-5: #49698d;
    --biru-tua-6: #244b76;
    --biru-tua-7: #1e3f62;
    --biru-tua-8: #18324f;
    --biru-tua-9: #12263b;
    --biru-tua-10: #0c1927;
    --biru-tua-11: #070f18;
    --biru-laut-1: #f2fbff;
    --biru-laut-2: #eaf8ff;
    --biru-laut-3: #dff5ff;
    --biru-laut-4: #d4f2ff;
    --biru-laut-5: #caeeff;
    --biru-laut-6: #bfebff;
    --biru-laut-7: #9fc4d5;
    --biru-laut-8: #7f9daa;
    --biru-laut-9: #607680;
    --biru-laut-10: #404e55;
    --biru-laut-11: #262f33;
    --hijau-1: #e8f8f6;
    --hijau-2: #c7eeea;
    --hijau-3: #9ADFD8;
    --hijau-4: #6cd2c7;
    --hijau-5: #3fc5b6;
    --hijau-6: #15b8a6;
    --hijau-7: #129c8d;
    --hijau-8: #0f8376;
    --hijau-9: #0c695f;
    --hijau-10: #09534b;
    --hijau-11: #023A34;
    --kuning-1: #fdf0ce;
    --kuning-2: #fbe6ae;
    --kuning-3: #fad985;
    --kuning-4: #f8cc5c;
    --kuning-5: #f6c034;
    --kuning-6: #f4b30b;
    --kuning-7: #cb9509;
    --kuning-8: #a37707;
    --kuning-9: #7a5a06;
    --kuning-10: #513c04;
    --kuning-11: #312402;
    --violet-1: #f5f2fe;
    --violet-2: #e6dffd;
    --violet-3: #d2c5fb;
    --violet-4: #bdaaf9;
    --violet-5: #a990f7;
    --violet-6: #9678f5;
    --violet-7: #8066d0;
    --violet-8: #6b55ae;
    --violet-9: #56448c;
    --violet-10: #44366e;
    --violet-11: #2F2352;
    --gr-violet-86: linear-gradient(to right, var(--violet-8) 0%, var(--violet-6) 100%);
    --gr-violet-108: linear-gradient(to right, var(--violet-10) 0%, var(--violet-8) 100%);
    --gr-violet-12: linear-gradient(to right, var(--violet-1) 0%, var(--violet-2) 100%);
    --gr-hijau-12: linear-gradient(to right, var(--hijau-1) 0%, var(--hijau-2) 100%);
    --gr-biru-12: linear-gradient(to right, var(--biru-1) 0%, var(--biru-2) 100%);
    --gr-kuning-12: linear-gradient(to right, var(--kuning-1) 0%, var(--kuning-2) 100%);
    --shadow-box1: 0 12px 24px 0 rgba(107, 85, 174, 0.25);
    --shadow-box2: 0 12px 24px 0 rgba(68, 54, 110, 0.25);
    --drop1: -8px 8px 12px rgba(68, 54, 110, 0.33);
    --drop2: 0 8px 24px rgba(107, 85, 174, 0.25);
    --drop3: 0 4px 14px rgba(107, 85, 174, 0.15);
    --sp-1: 8px;
    --sp-2: 16px;
    --sp-3: 24px;
    --sp-4: 32px;
    --sp-5: 48px;
    --sp-6: 64px;
    --sp-7: 80px;
    --sp-8: 100px;
}

html {
    scroll-behavior: smooth;
}

body.k-public {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    line-height: 1.6;
}

body.k-public img {
    max-width: 100%;
    height: auto;
}

.bg-gr-violet-86 {
    background-image: var(--gr-violet-86);
}

.bg-gr-violet-108 {
    background-image: var(--gr-violet-108);
}

.bg-gr-violet-12 {
    background-image: var(--gr-violet-12);
}

.bg-gr-hijau-12 {
    background-image: var(--gr-hijau-12);
}

.bg-violet-11 {
    background-color: var(--violet-11);
}

.text-violet-6 {
    color: var(--violet-6);
}

.text-violet-8 {
    color: var(--violet-8);
}

.text-violet-10 {
    color: var(--violet-10);
}

.text-violet-11 {
    color: var(--violet-11);
}

.text-biru-6 {
    color: var(--biru-6);
}

.text-biru-laut-7 {
    color: var(--biru-laut-7);
}

.text-biru-laut-10 {
    color: var(--biru-laut-10);
}

.drop-shadow-1 {
    filter: drop-shadow(var(--drop1));
}

.drop-shadow-2 {
    filter: drop-shadow(var(--drop2));
}

.drop-shadow-3 {
    filter: drop-shadow(var(--drop3));
}

.shadow-box-1 {
    box-shadow: var(--shadow-box1);
}

.shadow-box-2 {
    box-shadow: var(--shadow-box2);
}

.rounded-10 {
    border-radius: 10px;
}

.rounded-20 {
    border-radius: 20px;
}

.rounded-24 {
    border-radius: 24px;
}

.k-container {
    width: 100%;
    margin-inline: auto;
    padding-inline: 16px;
}

.lh-180 {
    line-height: 1.8;
}

p.lh-180 {
    max-inline-size: 68ch;
}

.text-center p.lh-180,
p.lh-180.text-center {
    margin-inline: auto;
}

.k-title {
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
}

.k-title-reg {
    font-weight: 400;
}

.k-testi-title {
    font-size: 32px;
}

.section {
    opacity: 0;
    transition: opacity 1s ease-out, transform 1s ease-out;
}

.section-scroll,
.rdn-sec[id] {
    scroll-margin-top: 80px;
}

.swiper-wrapper {
    width: 100%;
    position: relative;
    -webkit-transition-timing-function: linear !important;
    transition-timing-function: linear !important;
}

.swiper-pagination-bullet {
    background: #4f46e5;
}

.k-swiper-nav .swiper-button-prev,
.k-swiper-nav .swiper-button-next {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: #ffffff;
    color: var(--violet-8);
}

.k-swiper-nav .swiper-button-prev::after,
.k-swiper-nav .swiper-button-next::after {
    font-size: 14px;
    font-weight: 700;
}

.modal-dialog.k-modal {
    margin: 5rem auto 2rem;
    padding-inline: 16px;
    max-width: 100%;
}

.modal-dialog-scrollable.k-modal {
    height: calc(100% - 7rem);
}

.k-modal .modal-content {
    border: 0;
    border-radius: 16px;
    max-height: fit-content;
    overflow: auto;
    filter: drop-shadow(var(--drop2));
}

@media (min-width: 768px) {
    .k-container {
        max-width: 768px;
    }

    .modal-dialog.k-modal {
        max-width: 768px;
    }
}

@media (min-width: 1024px) {
    .k-container {
        max-width: 1024px;
        padding-inline: 2rem;
    }

    .k-title {
        font-size: 48px;
    }

    .k-swiper-nav .swiper-button-prev,
    .k-swiper-nav .swiper-button-next {
        width: 74px;
        height: 74px;
    }

    .k-swiper-nav .swiper-button-prev::after,
    .k-swiper-nav .swiper-button-next::after {
        font-size: 24px;
    }

    .modal-dialog.k-modal {
        max-width: 1024px;
        padding-inline: 2rem;
    }
}

@media (min-width: 1280px) {
    .k-container {
        max-width: 1280px;
        padding-inline: 10rem;
    }

    .modal-dialog.k-modal {
        max-width: 1280px;
        padding-inline: 10rem;
    }
}

@media (min-width: 1536px) {
    .k-container {
        max-width: 1536px;
    }
}

.text-biru-11 {
    color: var(--biru-11);
}

.text-biru-laut-9 {
    color: var(--biru-laut-9);
}

.text-biru-laut-11 {
    color: var(--biru-laut-11);
}

.k-btn-lift {
    transition: transform 1s ease, background-image 1s ease-in-out;
}

.k-btn-lift:hover {
    transform: translateY(-4px);
}

.k-btn-arrow {
    width: 16px;
}

.k-hero-carousel {
    position: relative;
    width: 100%;
    margin-bottom: var(--sp-1);
}

.k-hero-slide {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    background-image: var(--gr-violet-86);
    opacity: .15;
    border-radius: 10px;
}

.k-hero-slide img {
    width: 100%;
    border-radius: 10px;
}

.k-hero-title {
    color: var(--violet-11);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: var(--sp-1);
}

.k-content-title {
    color: var(--violet-11);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: var(--sp-1);
}

.k-content-gap {
    margin-bottom: var(--sp-8);
}

.k-pt-section {
    padding-top: var(--sp-5);
}

.k-pt-first {
    padding-top: var(--sp-4);
}

.k-pt-big {
    padding-top: var(--sp-5);
}

.k-manfaat-title {
    margin-bottom: 0;
}

.k-manfaat-holder {
    position: relative;
    display: flex;
    justify-content: center;
}

.k-manfaat-abs {
    position: absolute;
    display: none;
    justify-content: center;
    gap: 2rem;
    transform: scale(.9);
}

.k-manfaat-abs-2 {
    top: 210px;
    gap: 200px;
}

.k-manfaat-card {
    display: none;
    grid-template-columns: 1fr 3fr;
    gap: 16px;
    width: 534px;
    border: 1px solid var(--violet-8);
    border-radius: 32px;
    background-color: #ffffff;
    padding: 20px;
    box-shadow: var(--shadow-box1);
}

.k-manfaat-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: var(--gr-violet-86);
    border-radius: 20px;
    padding: 14px;
}

.k-manfaat-icon img {
    width: 78px;
}

.k-manfaat-card-sm {
    display: flex;
    gap: 16px;
    border: 1px solid var(--violet-8);
    border-radius: 16px;
    background-color: #ffffff;
    padding: 12px;
    box-shadow: var(--shadow-box1);
    margin-bottom: 16px;
}

.k-manfaat-icon-sm {
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: var(--gr-violet-86);
    border-radius: 10px;
    padding: 8px;
}

.k-manfaat-title-sm {
    color: var(--biru-11);
    font-size: 14px;
    line-height: 1.2;
    margin-bottom: 4px;
}

.k-manfaat-desc-sm {
    color: var(--biru-laut-9);
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 0;
}

.k-pills-holder {
    border: 1px solid var(--violet-8);
    border-radius: 16px;
    padding: .5rem;
    margin-bottom: var(--sp-3);
}

.k-pills .nav-link {
    width: 100%;
    border: 1px solid var(--violet-6);
    border-radius: 12px;
    padding: 16px;
    color: var(--biru-laut-9);
    font-size: 16px;
    line-height: 1.25;
    transition: all .3s ease-in-out;
}

.k-pills .nav-link:hover,
.k-pills .nav-link.active {
    border-color: transparent;
    background-image: var(--gr-violet-86);
    color: #ffffff;
}

.k-tab-title {
    color: var(--violet-11);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 0;
}

.k-tab-updated {
    color: var(--biru-laut-9);
    font-size: 16px;
    margin-bottom: var(--sp-4);
}

.k-kriteria-lead {
    color: var(--violet-11);
    font-size: 20px;
    line-height: 1.5;
    margin-bottom: 0;
}

.k-kriteria td {
    color: var(--biru-laut-10);
    font-size: 16px;
    line-height: 1.8;
    vertical-align: top;
}

.k-kriteria td + td {
    padding-left: .5rem;
}

.k-alur-item {
    display: grid;
    gap: 1rem;
    height: fit-content;
    width: 100%;
    border: 1px solid var(--violet-8);
    border-radius: 12px;
    padding: 1rem;
}

.k-alur-body {
    margin-bottom: 1rem;
    padding-inline: var(--sp-1);
}

.k-alur-head {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.k-alur-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-alur-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    width: 100%;
    border: 1px solid var(--violet-8);
    border-radius: 8px;
    background-color: transparent;
    padding: 10px 12px;
    color: var(--violet-11);
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: start;
}

.k-collapse-chevron {
    flex-shrink: 0;
    width: 20px;
    transform: rotate(-180deg);
    transition: transform .2s ease-in-out;
}

.k-alur-toggle.collapsed .k-collapse-chevron {
    transform: rotate(0deg);
}

.k-btn-outline-tab {
    float: inline-end;
    border: 1px solid var(--violet-6);
    border-radius: 8px;
    background-color: transparent;
    padding: 8px 16px;
    color: var(--violet-11);
    transition: all .3s ease-in-out;
}

.k-btn-outline-tab:hover {
    background-image: var(--gr-violet-86);
    color: #ffffff;
}

.k-alur-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 48px;
    width: 100%;
    height: 100%;
    border: 1px solid var(--violet-8);
    border-radius: 24px;
    padding: 32px;
}

.k-alur-badge {
    height: fit-content;
    border: 1px solid var(--violet-8);
    border-radius: 50rem;
    padding: 12px 24px;
}

.k-alur-card-title {
    color: var(--violet-11);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
}

.k-note-danger {
    font-style: italic;
    font-size: 14px;
}

.k-testi-text {
    color: var(--violet-11);
    font-size: 16px;
    text-align: center;
    margin-bottom: var(--sp-2);
}

.k-testi-avatar {
    width: 76px;
    border: 1px solid var(--violet-6);
    border-radius: 50%;
}

.k-testi-name {
    color: var(--violet-11);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    margin-bottom: 4px;
}

.k-testi-avatar-wrap {
    margin-bottom: var(--sp-2);
}

.k-testi-role {
    color: var(--biru-laut-10);
    font-size: 14px;
    text-align: center;
    margin-bottom: 0;
}

.k-testi-nav .swiper-button-prev,
.k-testi-nav .swiper-button-next {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: .5rem;
    border: 1px solid var(--violet-6);
    border-radius: 50%;
    background: transparent;
    color: var(--violet-6);
    transition: all .5s ease;
}

.k-testi-nav .swiper-button-prev {
    left: 20px;
}

.k-testi-nav .swiper-button-next {
    right: 20px;
}

.k-testi-nav .swiper-button-prev::after,
.k-testi-nav .swiper-button-next::after {
    content: '';
}

.k-testi-nav .swiper-button-prev:hover,
.k-testi-nav .swiper-button-next:hover {
    background-image: var(--gr-violet-86);
    color: #ffffff;
}

.k-faq .accordion-item {
    border: 1px solid #e5e7eb;
    background-color: #ffffff;
}

.k-faq .accordion-item:first-child {
    border-top-left-radius: .75rem;
    border-top-right-radius: .75rem;
}

.k-faq .accordion-button {
    padding: 1.25rem;
    background-color: #ffffff;
    color: #111827;
    font-weight: 500;
}

.k-faq .accordion-button:hover {
    background-color: var(--violet-1);
}

.k-faq .accordion-button:not(.collapsed) {
    color: var(--violet-11);
    box-shadow: none;
}

.k-faq .accordion-button:focus {
    box-shadow: 0 0 0 2px rgba(189, 170, 249, .5);
}

.k-faq .accordion-body {
    color: var(--biru-laut-10);
    max-inline-size: 68ch;
}

.k-auth-bg {
    background-image: url('../kontrib/img/bg-pattern.jpg');
    background-position: center;
    background-repeat: repeat-y;
}

.k-auth-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-8) var(--sp-2);
}

.k-auth-card {
    width: 100%;
    border-radius: 16px;
    background-color: #ffffff;
    padding: 24px;
    filter: drop-shadow(var(--drop2));
}

.k-auth-carousel-panel {
    position: relative;
    width: 100%;
    border-radius: 12px;
    background-image: var(--gr-violet-86);
    margin-bottom: 32px;
}

.k-auth-carousel .carousel-inner {
    min-height: 400px;
    border-radius: .5rem;
}

.k-auth-carousel .carousel-item {
    height: 100%;
}

.k-auth-slide {
    display: grid;
    align-content: center;
    gap: var(--sp-4);
    min-height: 400px;
    padding-inline: 16px;
}

.k-auth-slide img {
    width: 100%;
}

.k-auth-slide-title {
    color: #ffffff;
    font-size: 16px;
    text-align: center;
    margin-bottom: 0;
}

.k-auth-slide-text {
    color: #ffffff;
    font-size: 14px;
    text-align: center;
    margin-bottom: 0;
    padding-inline: 16px;
}

.k-auth-form {
    position: relative;
    display: grid;
    gap: 16px;
    width: 100%;
    padding-inline: 16px;
}

.k-auth-logo {
    width: 150px;
}

.k-auth-greet {
    color: var(--violet-11);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 0;
}

.k-auth-title {
    color: var(--violet-11);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 0;
}

.k-auth-desc {
    color: var(--biru-laut-9);
    font-size: 14px;
    margin-bottom: 0;
    max-inline-size: 68ch;
}

.k-fs-sm {
    font-size: 14px;
}

.k-hero-wrap {
    padding-block: var(--sp-2);
}

.k-mb-section {
    margin-bottom: var(--sp-5);
}

.k-my-section {
    margin-block: var(--sp-5);
}

.k-testi-section {
    padding-block: var(--sp-5);
}

.k-jadwal-head {
    display: grid;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--sp-3);
}

.k-jadwal-head .k-title {
    margin-bottom: 0;
}

.k-jadwal-sub {
    font-size: 16px;
}

.k-jadwal-kosong {
    font-size: 16px;
}

.k-jadwal-timeline {
    display: flex;
    flex-direction: column;
}

.k-jadwal-step {
    position: relative;
    display: flex;
    gap: 16px;
    padding-bottom: 32px;
}

.k-jadwal-step:last-child {
    padding-bottom: 0;
}

.k-jadwal-step::before {
    content: "";
    position: absolute;
    left: 27px;
    top: 28px;
    bottom: -28px;
    width: 2px;
    background-color: var(--violet-3);
}

.k-jadwal-step:last-child::before {
    display: none;
}

.k-jadwal-node-wrap {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 56px;
    flex-shrink: 0;
}

.k-jadwal-node {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-image: var(--gr-violet-86);
    color: #ffffff;
    font-weight: 600;
    font-size: 18px;
    box-shadow: var(--drop3);
}

.k-jadwal-step-selesai .k-jadwal-node {
    background-image: none;
    background-color: var(--biru-laut-9);
}

.k-jadwal-step-aktif .k-jadwal-node {
    width: 56px;
    height: 56px;
    box-shadow: 0 0 0 6px var(--violet-2), var(--drop2);
}

.k-jadwal-card {
    flex-grow: 1;
    background-color: #ffffff;
    border: 1px solid var(--violet-2);
    border-radius: 24px;
    padding: 20px 24px;
    box-shadow: var(--drop3);
}

.k-jadwal-step-aktif .k-jadwal-card {
    border-color: var(--violet-5);
    box-shadow: var(--drop2);
}

.k-jadwal-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    padding: 4px 12px;
    border-radius: 9999px;
    margin-bottom: 8px;
}

.k-jadwal-badge-selesai {
    background-color: #e9edf0;
    color: var(--biru-laut-10);
}

.k-jadwal-badge-aktif {
    background-image: linear-gradient(to right, var(--hijau-6) 0%, var(--hijau-4) 100%);
    color: var(--hijau-11);
}

.k-jadwal-badge-nanti {
    border: 1px solid var(--violet-6);
    color: var(--violet-8);
    background-color: transparent;
}

.k-jadwal-nama {
    font-size: 16px;
    font-weight: 600;
    color: var(--violet-11);
    margin-bottom: 4px;
}

.k-jadwal-tanggal {
    font-size: 14px;
    color: var(--biru-laut-10);
    margin-bottom: 0;
}

.k-jadwal-ket {
    font-size: 13px;
    color: var(--biru-laut-9);
    margin: 8px 0 0;
}

.k-jadwal-kuota {
    font-size: 13px;
    font-weight: 600;
    color: var(--violet-8);
    margin: 8px 0 0;
}

.k-faq-inner {
    padding-inline: 0;
}

@media (min-width: 768px) {
    .k-faq-inner {
        padding-inline: 16px;
    }
}

.k-faq-heading {
    color: var(--violet-11);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: var(--sp-3);
}

.k-error-card {
    max-width: 560px;
    margin-inline: auto;
    border-radius: 24px;
    background-color: #ffffff;
    box-shadow: var(--shadow-box1);
    padding: 48px 32px;
    text-align: center;
}

.k-error-code {
    font-size: 48px;
    font-weight: 700;
    line-height: 1;
    background-image: var(--gr-violet-86);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.k-cms-section {
    padding-block: 48px;
}

.k-richtext {
    color: var(--biru-laut-10);
    line-height: 1.8;
}

.k-richtext p {
    max-inline-size: 68ch;
}

.k-step-item {
    border: 1px solid var(--violet-8);
    border-radius: 12px;
    padding: 1rem;
}

.k-step-no {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-image: var(--gr-violet-86);
    color: #ffffff;
    font-weight: 600;
}

.k-step-arrow {
    width: 20px;
    transform: rotate(-180deg);
    transition: transform .2s ease-in-out;
}

[aria-expanded="false"] .k-step-arrow {
    transform: rotate(0deg);
}

.k-contact-item {
    border: 1px solid var(--violet-2);
    border-radius: 16px;
    padding: 1.5rem;
}

.k-bg-violet {
    background-color: var(--violet-10);
}

.k-btn-cta {
    display: inline-block;
    border: 1px solid #ffffff;
    border-radius: 10px;
    background-color: #ffffff;
    padding: 10px 24px;
    color: var(--violet-10);
    font-weight: 600;
    text-decoration: none;
    transition: all .3s ease-in-out;
}

.k-btn-cta:hover {
    background-color: transparent;
    color: #ffffff;
}

.k-feature-card {
    height: 100%;
    border: 1px solid var(--violet-8);
    border-radius: 24px;
    background-color: #ffffff;
    box-shadow: var(--shadow-box1);
    padding: 20px;
}

.k-feature-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-image: var(--gr-violet-86);
    border-radius: 20px;
    padding: 14px;
    color: #ffffff;
    font-size: 24px;
}

.k-feature-icon img {
    width: 48px;
}

.k-cms-testi-avatar {
    width: 76px;
    border: 1px solid var(--violet-6);
    border-radius: 50%;
}

.pk-text-biru {
    color: var(--biru-6);
}

.pk-text-violet {
    color: var(--violet-11);
}

.pk-list li {
    color: var(--biru-laut-10);
    line-height: 1.8;
}

.pk-alur-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.pk-alur-icon {
    width: 48px;
    flex-shrink: 0;
}

.pk-alur-card {
    height: 100%;
    border: 1px solid var(--violet-8);
    border-radius: 24px;
    padding: 24px;
}

.pk-alur-badge {
    float: inline-end;
    border: 1px solid var(--violet-8);
    border-radius: 50rem;
    padding: 6px 16px;
}

.k-cms-testi-track {
    display: grid;
    gap: 1.5rem;
    justify-content: center;
}

.k-cms-testi-card {
    max-width: 420px;
    border: 1px solid var(--violet-2);
    border-radius: 24px;
    background-color: #ffffff;
    box-shadow: var(--drop3);
    padding: 1.5rem;
    text-align: center;
}

.k-cms-testi-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--violet-6);
    border-radius: 50%;
    background: transparent;
    color: var(--violet-6);
    transition: all .3s ease-in-out;
}

.k-cms-testi-nav:hover {
    background-image: var(--gr-violet-86);
    color: #ffffff;
}

@media (min-width: 992px) {
    .k-btn-arrow {
        width: 24px;
    }

    .k-hero-wrap {
        padding-block: var(--sp-5);
    }

    .k-mb-section {
        margin-bottom: var(--sp-8);
    }

    .k-my-section {
        margin-block: var(--sp-8);
    }

    .k-testi-section {
        padding-block: var(--sp-8);
    }

    .k-faq-heading {
        font-size: 32px;
    }

    .k-hero-title {
        font-size: 48px;
    }

    .k-content-title {
        font-size: 48px;
    }

    .k-pt-section {
        padding-top: var(--sp-6);
    }

    .k-pt-first {
        padding-top: var(--sp-6);
    }

    .k-pt-big {
        padding-top: var(--sp-8);
    }

    .k-manfaat-title {
        margin-bottom: var(--sp-6);
    }

    .k-jadwal-head {
        gap: 12px;
        margin-bottom: var(--sp-7);
    }

    .k-jadwal-sub {
        font-size: 20px;
    }

    .k-jadwal-timeline {
        flex-direction: row;
        align-items: stretch;
        gap: 24px;
    }

    .k-jadwal-step {
        flex: 1 1 0;
        flex-direction: column;
        align-items: center;
        padding-bottom: 0;
    }

    .k-jadwal-step::before {
        left: 50%;
        right: auto;
        top: 27px;
        bottom: auto;
        width: calc(100% + 24px);
        height: 2px;
    }

    .k-jadwal-node-wrap {
        height: 56px;
        align-items: center;
    }

    .k-jadwal-card {
        width: 100%;
        flex-grow: 1;
        text-align: center;
        padding: 24px;
    }

    .k-jadwal-nama {
        font-size: 18px;
    }

    .k-alur-item {
        border-radius: 16px;
    }

    .k-alur-toggle {
        padding: 10px 16px;
    }

    .k-testi-avatar-wrap {
        margin-bottom: var(--sp-4);
    }

    .k-faq-inner {
        padding-inline: 2rem;
    }

    .k-manfaat-abs {
        display: flex;
    }

    .k-manfaat-card {
        display: grid;
    }

    .k-manfaat-card-sm {
        display: none;
    }

    .k-tab-title {
        font-size: 32px;
    }

    .k-kriteria-lead {
        font-size: 24px;
    }

    .k-kriteria td {
        font-size: 20px;
    }

    .k-testi-text {
        font-size: 32px;
        margin-bottom: var(--sp-4);
    }

    .k-testi-avatar {
        width: 154px;
    }

    .k-testi-name {
        font-size: 24px;
        margin-bottom: 8px;
    }

    .k-testi-role {
        font-size: 24px;
    }

    .k-testi-nav .swiper-button-prev,
    .k-testi-nav .swiper-button-next {
        width: 74px;
        height: 74px;
    }

    .k-testi-title {
        font-size: 48px;
    }

    .k-auth-wrap {
        padding-inline: 250px;
    }

    .k-auth-carousel .carousel-inner {
        min-height: 900px;
    }

    .k-auth-slide {
        gap: var(--sp-6);
        min-height: 900px;
        padding-inline: 32px;
    }

    .k-auth-card {
        display: flex;
        align-items: center;
        gap: 32px;
        border-radius: 32px;
    }

    .k-auth-carousel-panel {
        border-radius: 24px;
        margin-bottom: 0;
    }

    .k-auth-slide-title {
        font-size: 32px;
    }

    .k-auth-slide-text {
        font-size: 20px;
        padding-inline: 32px;
    }

    .k-auth-form {
        gap: 32px;
        padding-inline: 24px;
    }

    .k-auth-logo {
        width: 250px;
    }

    .k-auth-greet {
        font-size: 20px;
    }

    .k-auth-title {
        font-size: 32px;
    }

    .k-auth-desc {
        font-size: 16px;
    }

    .k-cms-testi-track {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.k-navbar {
    padding-block: 12px;
}

.k-nav-left {
    gap: 24px;
}

.k-nav-brand {
    gap: 12px;
    text-decoration: none;
}

.k-nav-menu {
    gap: var(--sp-3);
}

.k-nav-link {
    display: inline-block;
    text-align: center;
    padding-block: 10px;
    color: var(--violet-8);
    font-size: 16px;
    text-decoration: none;
    transition: color .3s ease-in-out;
}

.k-nav-link::after {
    content: attr(data-label);
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    font-weight: 600;
}

.k-nav-link:hover {
    color: var(--violet-11);
}

.k-nav-aktif {
    color: var(--violet-11);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: var(--violet-6);
    text-decoration-thickness: 2px;
    text-underline-offset: 8px;
}

a.k-dropdown-item.k-nav-aktif {
    color: var(--violet-11);
    font-weight: 600;
    text-decoration: none;
}

.k-btn-outline-violet {
    display: inline-block;
    border: 1px solid var(--violet-6);
    border-radius: 10px;
    background-color: #ffffff;
    padding: 10px 20px;
    color: var(--violet-11);
    font-size: 16px;
    transition: all .5s ease-in-out;
}

.k-btn-outline-violet:hover {
    background-image: var(--gr-violet-86);
    border-color: transparent;
    color: #ffffff;
}

.k-btn-violet {
    display: inline-block;
    border: 0;
    border-radius: 10px;
    background-image: var(--gr-violet-86);
    padding: 10px 20px;
    color: #ffffff;
    font-size: 16px;
    transition: all 1s ease-in-out;
}

.k-btn-violet:hover {
    background-image: var(--gr-violet-108);
    color: #ffffff;
}

.k-btn-nav-sm {
    border-radius: 8px;
    padding: 11px 20px;
    font-size: 14px;
}

.k-btn-hamburger {
    border: 0;
    background-color: transparent;
    padding: 0;
}

.k-btn-hamburger img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.k-dropdown {
    border: 0;
    border-radius: 8px;
    min-width: 50vw;
    filter: drop-shadow(var(--drop1));
}

.k-dropdown-item {
    color: var(--violet-8);
    font-size: 14px;
    padding-block: 12px;
}

.k-dropdown-item:hover,
.k-dropdown-item:focus {
    background-image: var(--gr-violet-12);
    color: var(--violet-10);
}

.k-nav-dropdown {
    position: relative;
}

.k-nav-caret {
    display: inline-block;
    margin-left: .35em;
    vertical-align: .2em;
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-left: .3em solid transparent;
}

.k-dropdown.k-nav-submenu {
    min-width: 14rem;
}

.k-dropdown-induk {
    display: block;
    color: var(--violet-11);
    font-size: 14px;
    font-weight: 600;
    padding-block: 12px;
}

.k-dropdown-item.k-dropdown-anak {
    padding-left: 2rem;
}

.k-footer {
    background-color: var(--violet-11);
    padding: var(--sp-5) var(--sp-2);
}

.k-footer-inner {
    width: 100%;
    padding-inline: 16px;
}

.k-footer-logo {
    height: 60px;
    margin-bottom: var(--sp-2);
}

.k-footer-desc {
    color: #ffffff;
    font-size: 14px;
    margin-bottom: var(--sp-2);
    max-inline-size: 68ch;
}

.k-social {
    display: flex;
    gap: var(--sp-4);
    margin-bottom: var(--sp-2);
}

.k-copyright {
    color: #ffffff;
    margin-bottom: var(--sp-2);
}

.k-footer-links {
    color: #ffffff;
    font-size: 14px;
}

.k-footer-links h5 {
    font-size: inherit;
    font-weight: 600;
    margin-bottom: var(--sp-1);
}

.k-footer-links a {
    display: block;
    color: #ffffff;
    text-decoration: none;
    margin-bottom: var(--sp-1);
    padding-block: 2px;
}

.k-footer-links a:hover {
    text-decoration: underline;
}

.k-footer-links p {
    margin-bottom: var(--sp-1);
}

.k-g-32 {
    --bs-gutter-x: 2rem;
    --bs-gutter-y: 2rem;
}

.k-modal-form {
    display: grid;
    gap: 16px;
    align-content: start;
    padding-inline: 16px;
}

.k-modal-logo {
    width: 80px;
}

.k-btn-exit {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--violet-8);
    border-radius: 50rem;
    background-color: #ffffff;
    padding: 11px 16px;
    color: var(--violet-8);
    font-size: 14px;
}

.k-btn-exit:hover {
    box-shadow: 0 0 0 1px var(--violet-8);
}

.k-btn-exit img {
    width: 14px;
}

.k-modal-greet {
    color: var(--violet-11);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 0;
}

.k-modal-title {
    color: var(--violet-11);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 0;
}

.k-form-fields {
    display: grid;
    gap: 12px;
}

.k-form-actions {
    display: grid;
    gap: 12px;
}

.k-field-label {
    color: var(--violet-11);
    font-size: 14px;
    font-weight: 600;
    margin-bottom: var(--sp-1);
}

.k-input-group {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--biru-laut-9);
    border-radius: 10px;
    padding: 10px 16px;
}

.k-input-group:focus-within {
    box-shadow: 0 0 0 2px var(--violet-6);
}

.k-input-group img {
    width: 18px;
}

.k-input-group input {
    width: 100%;
    border: 0;
    outline: 0;
    background-color: transparent;
    color: var(--violet-11);
}

.k-btn-eye {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-width: 44px;
    min-height: 44px;
    border: 0;
    background-color: transparent;
    padding: 0;
    margin-block: -10px;
    margin-inline: -13px;
}

.k-btn-eye img {
    width: 18px;
}

.k-btn-submit {
    display: block;
    width: 100%;
    border: 0;
    border-radius: 10px;
    background-image: var(--gr-violet-86);
    padding-block: 12px;
    color: #ffffff;
}

.k-btn-submit:hover {
    background-image: var(--gr-violet-108);
    color: #ffffff;
}

.k-link-violet {
    border: 0;
    background-color: transparent;
    padding: 12px 0;
    margin-block: -12px;
    color: var(--violet-8);
    font-size: 14px;
    text-decoration: none;
}

.k-link-violet:hover {
    color: var(--violet-10);
}

.k-modal-note {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    color: var(--violet-8);
    font-size: 14px;
}

.k-link-strong {
    border: 0;
    background-color: transparent;
    padding: 12px 0;
    margin-block: -12px;
    color: var(--violet-8);
    font-weight: 600;
    text-decoration: none;
}

.k-link-strong:hover {
    text-decoration: underline;
}

.k-forget-note {
    color: var(--biru-laut-9);
    font-size: 14px;
    margin-bottom: 0;
}

.k-carousel-panel {
    border-radius: 12px;
}

.k-carousel-slide {
    display: grid;
    gap: 32px;
    padding: 16px;
}

.k-slide-text {
    font-size: 14px;
    margin-bottom: 0;
}

.k-carousel .carousel-indicators [data-bs-target] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.k-carousel .carousel-control-prev,
.k-carousel .carousel-control-next {
    width: auto;
    padding-inline: 16px;
    opacity: 1;
}

.k-carousel-ctl {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, .3);
}

.k-carousel-ctl:hover {
    background-color: rgba(255, 255, 255, .5);
}

.k-carousel-ctl .carousel-control-prev-icon,
.k-carousel-ctl .carousel-control-next-icon {
    width: 16px;
    height: 16px;
}

@media (min-width: 992px) {
    .k-navbar {
        padding-block: var(--sp-3);
    }

    .k-nav-left {
        gap: var(--sp-6);
    }

    .k-logo-nav {
        height: 42px;
    }

    .k-footer {
        padding: var(--sp-7) 160px;
    }

    .k-footer-inner {
        padding-inline: 2rem;
    }

    .k-footer-logo {
        height: 80px;
        margin-bottom: var(--sp-3);
    }

    .k-footer-desc {
        font-size: 20px;
        line-height: 1.8;
        margin-bottom: var(--sp-6);
    }

    .k-social {
        margin-bottom: var(--sp-6);
    }

    .k-footer-links {
        font-size: 16px;
    }

    .k-footer-links h5 {
        margin-bottom: var(--sp-3);
    }

    .k-footer-links a {
        margin-bottom: var(--sp-1);
    }

    .k-footer-links p {
        margin-bottom: var(--sp-1);
    }

    .k-modal-form {
        gap: 24px;
        padding-inline: 24px;
    }

    .k-modal-logo {
        width: 150px;
    }

    .k-btn-exit {
        font-size: 16px;
    }

    .k-btn-exit img {
        width: 20px;
    }

    .k-modal-greet {
        font-size: 20px;
    }

    .k-modal-title {
        font-size: 32px;
    }

    .k-form-fields {
        gap: var(--sp-2);
    }

    .k-form-actions {
        gap: var(--sp-3);
    }

    .k-field-label {
        font-size: 16px;
        margin-bottom: var(--sp-1);
    }

    .k-input-group {
        padding: 16px 24px;
    }

    .k-input-group img {
        width: 24px;
    }

    .k-btn-eye img {
        width: 24px;
    }

    .k-btn-submit {
        padding-block: 14px;
        font-size: 20px;
    }

    .k-link-violet {
        font-size: 16px;
    }

    .k-modal-note {
        font-size: 16px;
    }

    .k-forget-note {
        font-size: 16px;
    }

    .k-carousel-panel {
        border-radius: 24px;
    }

    .k-carousel-slide {
        gap: 64px;
        padding: 32px;
    }

    .k-slide-text {
        font-size: 14px;
        padding-inline: 32px;
    }

    .k-carousel-ctl {
        width: 40px;
        height: 40px;
    }
}

.pk-portalku-shell {
    font-family: 'Montserrat', sans-serif;
}

.pk-portalku-loader {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background-color: rgba(107, 0, 255, 0.25);
    display: none;
}

.pk-portalku-loader-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 240px;
    max-width: 80vw;
    padding: 8px;
}

.pk-portalku-page-head {
    margin-bottom: 1.5rem;
}

.pk-portalku-avatar-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--violet-6);
    font-size: 1.9rem;
}

.avatar-lg .pk-portalku-avatar-icon {
    font-size: 3.5rem;
}

.pk-portalku-rating-stars {
    color: var(--kuning-6);
    font-size: 1rem;
}

.pk-portalku-rating-stars i {
    margin-right: 2px;
}

.pk-portalku-card-link {
    display: block;
    padding: 14px 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    color: var(--violet-8);
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
}

.pk-portalku-card-link:hover,
.pk-portalku-card-link:focus {
    color: var(--violet-11);
    text-decoration: underline;
}

.pk-profil-card {
    border-radius: 16px;
}

.pk-profil-card .card-body {
    padding: 1.25rem 1.5rem;
}

.pk-profil-card-title {
    margin-bottom: 0.25rem;
    font-size: 18px;
    font-weight: 700;
}

.pk-profil-card-meta {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.02em;
    opacity: 0.95;
}

.pk-profil-card-desc {
    margin-top: 0.5rem;
    opacity: 0.95;
    white-space: pre-line;
}

.pk-profil-card-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    margin-top: 0.75rem;
}

.pk-profil-card-link {
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    text-decoration: underline;
}

.pk-profil-card-link:hover,
.pk-profil-card-link:focus {
    color: #fff;
    text-decoration-thickness: 2px;
}

.pk-profil-empty {
    padding: 1.5rem 0;
}

.pk-kontribusi-card {
    border-radius: 16px;
    margin-bottom: 1.5rem;
}

.pk-kontribusi-card .card-body {
    padding: 1.25rem 1.5rem;
}

.pk-kontribusi-card-title {
    margin-bottom: 0.75rem;
    font-size: 18px;
    font-weight: 700;
}

.pk-kontribusi-card-meta {
    font-weight: 700;
}

.pk-kontribusi-card-desc {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.02em;
    opacity: 0.95;
}

.pk-kontribusi-card-contact {
    text-align: end;
}

.profil-foto-preview {
    width: 100%;
    max-width: 180px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border: 3px solid gainsboro;
    border-radius: 16px;
    box-shadow: rgba(0, 0, 0, 0.24) 0 3px 8px;
    margin-bottom: var(--sp-1);
}

.pk-kontribusi-scroll {
    max-height: 75vh;
    overflow-y: auto;
}

.pk-tp-catatan {
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.k-btn-hero {
    border-radius: 8px;
    padding: 10px 16px;
}

@media (min-width: 992px) {
    .k-btn-hero {
        border-radius: 10px;
        padding: 16px 24px;
        gap: 12px;
    }
}

@media (min-width: 1280px) {
    .k-faq-inner {
        padding-inline: 10rem;
    }

    .k-footer-inner {
        padding-inline: 10rem;
    }
}

body.k-public a:focus-visible,
body.k-public button:focus-visible,
body.k-public input:focus-visible,
body.k-public [role="button"]:focus-visible,
.pk-portalku-shell a:focus-visible,
.pk-portalku-shell button:focus-visible {
    outline: 3px solid var(--violet-5);
    outline-offset: 2px;
}

body.k-public .k-input-group input:focus-visible,
.k-input-group input:focus-visible {
    outline: 0;
    outline-offset: 0;
    box-shadow: none;
}

.pk-portalku-shell .op-7,
.pk-portalku-shell .op-8 {
    opacity: .85 !important;
}

.pk-portalku-shell .bg-secondary-gradient .op-7,
.pk-portalku-shell .bg-secondary-gradient .op-8 {
    opacity: .95 !important;
}

.pk-portalku-shell .text-small {
    font-size: 14px;
}

.pk-portalku-shell .pk-profil-card h2,
.pk-portalku-shell .pk-kontribusi-card h2 {
    font-size: 20px;
    line-height: 1.2;
}

@media (max-width: 991.98px) {
    .pk-portalku-shell .btn {
        min-height: 44px;
    }
}

.k-wizard-wrap {
    display: flex;
    justify-content: center;
    padding: var(--sp-6) var(--sp-2);
}

.k-wizard-card {
    width: 100%;
    max-width: 1080px;
    background-color: #ffffff;
    border: 1px solid var(--violet-2);
    border-radius: 20px;
    padding: 32px 32px 24px;
    filter: drop-shadow(var(--drop2));
}

.k-wizard-head {
    text-align: center;
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--violet-1);
}

.k-wizard-head .k-auth-desc {
    margin-inline: auto;
}

.wizard-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0 0 12px 0;
}

.wizard-nav-item {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 120px;
    padding: 9px 12px;
    border-radius: 12px;
    background-color: var(--violet-1);
    color: var(--violet-9);
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

.wizard-nav-item.active {
    background-image: var(--gr-violet-86);
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(107, 85, 174, .28);
}

.wizard-nav-item.done {
    background-color: var(--hijau-2);
    color: var(--hijau-10);
}

.wizard-nav-no {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, .35);
    font-weight: 700;
    flex: 0 0 auto;
}

.wizard-nav-item:not(.active):not(.done) .wizard-nav-no {
    background-color: #ffffff;
    color: var(--violet-9);
}

.wizard-nav-item.done .wizard-nav-no {
    background-color: var(--hijau-6);
    color: #ffffff;
    font-size: 0;
}

.wizard-nav-item.done .wizard-nav-no::after {
    content: "\2713";
    font-size: 14px;
    font-weight: 800;
}

.wizard-progress {
    height: 6px;
    border-radius: 6px;
    background-color: var(--violet-2);
    overflow: hidden;
    margin-bottom: 20px;
}

.wizard-progress-bar {
    height: 100%;
    width: 0;
    background-image: var(--gr-violet-86);
    transition: width .3s ease;
}

.wizard-step {
    display: none;
}

.wizard-step.active {
    display: block;
    min-height: 320px;
    animation: wizardFade .25s ease;
}

@keyframes wizardFade {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

.wizard-step-title {
    color: var(--violet-11);
    font-weight: 700;
    margin-bottom: 4px;
}

.wizard-step-desc {
    color: var(--biru-laut-9);
    font-size: 14px;
    margin-bottom: 16px;
}

.wizard-batch-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.wizard-batch-grid > .wizard-empty {
    flex: 1 1 100%;
}

.wizard-batch-grid .wizard-batch-card {
    flex: 1 1 100%;
    min-width: 0;
}

.wizard-batch-grid.cols-1 .wizard-batch-card {
    cursor: default;
}

.wizard-batch-grid.cols-2 .wizard-batch-card {
    flex-basis: calc((100% - 14px) / 2);
}

.wizard-batch-grid.cols-3 .wizard-batch-card {
    flex-basis: calc((100% - 28px) / 3);
}

.wizard-batch-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 2px solid var(--violet-2);
    border-radius: 14px;
    padding: 18px;
    background-color: #ffffff;
    cursor: pointer;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.wizard-batch-card:hover {
    border-color: var(--violet-4);
    box-shadow: 0 8px 18px rgba(107, 85, 174, .12);
    transform: translateY(-2px);
}

.wizard-batch-card.selected {
    border-color: var(--violet-8);
    background-color: var(--violet-1);
    box-shadow: 0 0 0 3px var(--violet-3);
}

.wizard-batch-name {
    color: var(--violet-11);
    font-weight: 700;
    margin-bottom: 8px;
}

.wizard-batch-meta {
    color: var(--biru-laut-9);
    font-size: 13px;
    margin-bottom: 4px;
}

.wizard-batch-desc {
    color: var(--biru-laut-10);
    font-size: 13px;
    margin-top: 8px;
    margin-bottom: 0;
}

.wizard-empty {
    color: var(--biru-laut-9);
    font-size: 14px;
    padding: 12px 0;
}

.wizard-context {
    border: 1px solid var(--violet-2);
    border-radius: 12px;
    padding: 16px;
    background-color: var(--violet-1);
    height: 100%;
}

.wizard-context-title {
    color: var(--violet-11);
    font-weight: 700;
    margin-bottom: 10px;
}

.wizard-context-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 10px;
}

.wizard-context-crit {
    display: block;
    font-weight: 600;
    color: var(--violet-10);
}

.wizard-context-crit-desc {
    display: block;
    font-size: 13px;
    color: var(--biru-laut-10);
}

.wizard-essay {
    resize: vertical;
}

.wizard-essay-counter {
    font-size: 12px;
    color: var(--biru-laut-9);
    margin-top: 6px;
}

.wizard-pendidikan-table th {
    background-color: var(--violet-1);
    color: var(--violet-11);
    font-size: 13px;
}

.wizard-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 4px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--violet-2);
}

.wizard-review {
    display: grid;
    gap: 8px;
}

.wizard-review-row {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--violet-2);
}

.wizard-review-label {
    font-weight: 600;
    color: var(--violet-10);
}

.wizard-review-value {
    color: var(--biru-laut-10);
}

.wizard-review-list {
    margin: 0;
    padding-left: 18px;
}

.wizard-review-essay {
    white-space: pre-wrap;
}

.k-bio {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.k-bio-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 12px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--violet-1);
}

.k-bio-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background-color: var(--violet-1);
    color: var(--violet-8);
    font-size: 16px;
}

.k-bio-title {
    color: var(--violet-11);
    font-size: 16px;
    font-weight: 700;
    margin: 0;
}

.k-bio-sub {
    color: var(--biru-laut-9);
    font-size: 13px;
    margin: 2px 0 0;
}

.k-hide {
    display: none;
}

.k-field .cascade-hint {
    display: block;
    font-size: 12px;
}

.k-field .form-text {
    display: block;
    font-size: 12px;
    margin-top: 4px;
}

.wizard-form .k-bio-section {
    border: 1px solid var(--violet-2);
    border-radius: 14px;
    padding: 20px;
    background-color: #ffffff;
}

.wizard-form .form-label {
    font-size: 14px;
    font-weight: 600;
    color: var(--violet-11);
    margin-bottom: 6px;
}

.wizard-form .form-control {
    font-size: 15px;
}

.wizard-form .form-control::placeholder {
    color: #a3a9b6;
}

.wizard-form .form-control[readonly] {
    background-color: var(--violet-1);
    color: var(--biru-laut-10);
}

.wizard-form .select2-container--default .select2-selection--single {
    display: flex;
    align-items: center;
    height: 38px;
    border-color: #ced4da;
    border-radius: 4px;
}

.wizard-form .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-size: 15px;
    line-height: 36px;
    padding-left: 12px;
    color: #212529;
}

.wizard-form .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #a3a9b6;
}

.wizard-form .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px;
    right: 6px;
}

.wizard-form .select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: #f1f2f6;
    cursor: not-allowed;
}

.wizard-form .select2-container--default.select2-container--focus .select2-selection--single,
.wizard-form .select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--violet-6);
    box-shadow: 0 0 0 3px var(--violet-2);
}

@media (max-width: 767.98px) {
    .k-wizard-card {
        padding: 18px;
    }

    .wizard-nav-label {
        display: none;
    }

    .wizard-form .k-bio-section {
        padding: 14px;
    }

    .k-bio-sub {
        display: none;
    }

    .wizard-review-row {
        grid-template-columns: 1fr;
        gap: 2px;
    }

    .wizard-batch-grid.cols-2 .wizard-batch-card,
    .wizard-batch-grid.cols-3 .wizard-batch-card {
        flex-basis: 100%;
    }
}

.btn-violet {
    background: var(--violet-6);
    border: 1px solid var(--violet-6);
    color: #fff;
}

.btn-violet:hover,
.btn-violet:focus {
    background: var(--violet-8);
    border-color: var(--violet-8);
    color: #fff;
}

.btn-outline-violet {
    background: transparent;
    border: 1px solid var(--violet-6);
    color: var(--violet-8);
}

.btn-outline-violet:hover,
.btn-outline-violet:focus {
    background: var(--violet-2);
    color: var(--violet-10);
}

.k-status-hero {
    border-top: 4px solid var(--violet-6);
}

.k-status-hero-icon {
    width: 64px;
    height: 64px;
    margin: 4px auto 12px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    background: var(--violet-2);
    color: var(--violet-8);
}

.k-status-hero-label {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 12px;
    font-weight: 600;
    color: var(--violet-8);
    margin-bottom: 2px;
}

.k-status-hero-text {
    font-weight: 700;
    color: var(--violet-11);
    margin-bottom: 8px;
}

.k-status-hero-batch {
    font-size: 14px;
    color: var(--violet-10);
    margin-bottom: 0;
}

.k-status-badge-success {
    border-top-color: var(--hijau-6);
}

.k-status-badge-success .k-status-hero-icon {
    background: var(--hijau-2);
    color: var(--hijau-10);
}

.k-status-badge-danger {
    border-top-color: #e05a5a;
}

.k-status-badge-danger .k-status-hero-icon {
    background: #fbe1e1;
    color: #b02a2a;
}

.k-status-badge-warning {
    border-top-color: var(--kuning-6);
}

.k-status-badge-warning .k-status-hero-icon {
    background: var(--kuning-2);
    color: var(--kuning-10);
}

.k-status-badge-review {
    border-top-color: var(--biru-langit-6);
}

.k-status-badge-review .k-status-hero-icon {
    background: var(--biru-langit-2);
    color: var(--biru-langit-10);
}

.k-status-badge-info {
    border-top-color: var(--biru-6);
}

.k-status-badge-info .k-status-hero-icon {
    background: var(--biru-1);
    color: var(--biru-8);
}

.k-status-note {
    border-radius: 10px;
    padding: 14px 16px;
    font-size: 14px;
    border-left: 4px solid var(--violet-6);
    background: var(--violet-2);
    color: var(--violet-11);
}

.k-status-note-success {
    border-left-color: var(--hijau-6);
    background: var(--hijau-1);
    color: var(--hijau-11);
}

.k-status-note-danger {
    border-left-color: #e05a5a;
    background: #fdeded;
    color: #7a1f1f;
}

.k-status-note-warning {
    border-left-color: var(--kuning-6);
    background: var(--kuning-1);
    color: var(--kuning-11);
}

.k-status-note-info {
    border-left-color: var(--biru-6);
    background: var(--biru-1);
    color: var(--biru-10);
}

.k-timeline {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 0;
}

.k-timeline-item {
    flex: 1 1 0;
    min-width: 110px;
    text-align: center;
    position: relative;
    padding-top: 8px;
}

.k-timeline-item::before {
    content: "";
    position: absolute;
    top: 30px;
    left: -50%;
    width: 100%;
    height: 3px;
    background: var(--violet-2);
    z-index: 0;
}

.k-timeline-item:first-child::before {
    display: none;
}

.k-timeline-dot {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 8px;
    position: relative;
    z-index: 1;
    background: #fff;
    border: 3px solid var(--violet-2);
    color: var(--violet-6);
    font-size: 16px;
}

.k-timeline-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--violet-10);
}

.k-timeline-selesai .k-timeline-dot {
    background: var(--hijau-6);
    border-color: var(--hijau-6);
    color: #fff;
}

.k-timeline-selesai::before {
    background: var(--hijau-6);
}

.k-timeline-aktif .k-timeline-dot {
    background: var(--violet-6);
    border-color: var(--violet-6);
    color: #fff;
}

.k-timeline-pending .k-timeline-label {
    color: var(--violet-8);
    opacity: 0.7;
}

.k-jadwal-grid {
    display: grid;
    gap: 8px;
}

.k-jadwal-cell {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    border-radius: 8px;
    background: var(--violet-2);
}

.k-jadwal-key {
    font-weight: 600;
    color: var(--violet-10);
}

.k-jadwal-val {
    color: var(--violet-11);
    text-align: right;
}

.k-jadwal-ket {
    font-size: 14px;
    color: var(--violet-10);
}

.k-kriteria-list {
    margin: 0;
    padding-left: 18px;
    color: var(--violet-11);
    font-size: 14px;
}

.k-kriteria-list li {
    margin-bottom: 4px;
}

.k-kriteria-desc {
    color: var(--violet-8);
}

.k-checklist {
    list-style: none;
    margin: 0;
    padding: 0;
}

.k-checklist li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--violet-2);
    font-size: 14px;
}

.k-checklist li:last-child {
    border-bottom: none;
}

.k-checklist .k-check-text {
    flex: 1 1 auto;
    color: var(--violet-11);
}

.k-check-done > i {
    color: var(--hijau-6);
}

.k-check-todo > i {
    color: var(--kuning-6);
}

.k-check-link {
    font-weight: 600;
    color: var(--violet-6);
    text-decoration: none;
}

.k-check-link:hover {
    text-decoration: underline;
}

.k-checklist-done {
    margin-top: 12px;
    padding: 10px 14px;
    border-radius: 8px;
    background: var(--hijau-1);
    color: var(--hijau-11);
    font-weight: 600;
}

.k-kontak-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.k-kontak-item {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: 8px;
    background: var(--violet-2);
    color: var(--violet-10);
    text-decoration: none;
    font-weight: 600;
}

.k-kontak-item:hover {
    background: var(--violet-6);
    color: #fff;
}

.k-menu-locked > a {
    opacity: 0.55;
    cursor: not-allowed;
}

.k-batch-picker {
    display: grid;
    gap: 10px;
}

.k-batch-card {
    border: 2px solid var(--violet-2);
    border-radius: 10px;
    padding: 12px 14px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.k-batch-card:hover {
    border-color: var(--violet-6);
}

.k-batch-card-active {
    border-color: var(--violet-6);
    background: var(--violet-2);
}

.k-batch-card-title {
    font-weight: 700;
    color: var(--violet-11);
}

.k-batch-card-period {
    font-size: 13px;
    color: var(--violet-8);
    margin-top: 2px;
}

.k-batch-card-ket {
    font-size: 13px;
    color: var(--violet-10);
    margin-top: 4px;
}

.k-essay {
    resize: vertical;
}

@media (max-width: 767.98px) {
    .k-jadwal-cell {
        flex-direction: column;
        gap: 2px;
    }

    .k-jadwal-val {
        text-align: left;
    }
}

/* ── Pratinjau (dibuka dari admin) ─────────────────────────── */
.k-pratinjau-pita {
    position: sticky;
    top: 0;
    z-index: 1080;
    background: #f9a703;
    color: #231f20;
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-align: center;
    padding: 8px 12px;
}
.k-pratinjau-auth { padding: 32px 0; }
.k-pratinjau-form-placeholder { padding: 32px 24px; color: #6b7a8c; }

.pf-wrap {
    max-width: 960px;
    margin: 0 auto;
    padding: 8px 0;
}

.pf-judul {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: .5rem;
}

.pf-pengantar,
.pf-keterangan p,
.pf-sukses,
.pf-galat-umum {
    white-space: pre-line;
}

.pf-pengantar,
.pf-keterangan p {
    color: #4b5563;
}

.pf-label {
    font-weight: 600;
}

.pf-wajib {
    color: #c62828;
}

.pf-keterangan h5 {
    font-size: 1.1rem;
    font-weight: 700;
    margin: .75rem 0 .25rem;
}

.pf-hp {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

.pf-lencana {
    display: inline-block;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #9a6700;
    background: #fff4d6;
    border-radius: 4px;
    padding: 2px 8px;
    margin-bottom: 8px;
}

.pf-kirim {
    min-width: 140px;
}