.peserta-layout {
    --peserta-teal: #0d5c52;
    --bs-primary: #0d5c52;
    --bs-primary-rgb: 13, 92, 82;
    --bs-link-color: #0d5c52;
    --bs-link-color-rgb: 13, 92, 82;
    --bs-link-hover-color: #09453e;
    --bs-link-hover-color-rgb: 9, 69, 62;
    margin: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f4f6f8;
    color: #24343c;
    font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
    font-size: .9375rem;
}
.peserta-skip-link { position: fixed; top: -80px; left: 16px; padding: 12px; background: white; z-index: 2000; }
.peserta-skip-link:focus { top: 12px; }
.peserta-header { background: white; border-bottom: 1px solid #e4ebe8; }
.peserta-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 18px; padding-bottom: 18px; }
.peserta-brand { display: flex; align-items: center; gap: 14px; color: var(--peserta-teal); text-decoration: none; }
.peserta-brand img { object-fit: contain; flex-shrink: 0; }
.peserta-brand strong { display: block; font-size: 1.15rem; letter-spacing: .035em; }
.peserta-brand small { display: block; margin-top: 4px; color: #667972; font-size: .9rem; }
.peserta-header-right { display: flex; flex-direction: column; align-items: flex-end; gap: 14px; }
.peserta-contacts, .peserta-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.peserta-contact { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #d1e7dd; border-radius: 30px; padding: 5px 13px; color: #0d5c52; background: #f1f8f6; font-size: .78rem; font-weight: 600; text-decoration: none; }
.peserta-whatsapp { background: linear-gradient(135deg, #e8f5e9, #c8e6c9); color: #1b5e20; border-color: #a5d6a7; }
.peserta-online-dot { width: 7px; height: 7px; border-radius: 50%; background: #25d366; }
.peserta-nav-link { padding: 7px 10px; color: var(--peserta-teal); font-weight: 600; text-decoration: none; font-size: .85rem; border-radius: 6px; }
.peserta-nav-link:hover, .peserta-nav-link.active { background: #f1f8f6; color: #09453e; }
.peserta-account { color: var(--peserta-teal); font-size: .85rem; border: 1px solid #d1e7dd; }
.peserta-account:hover { background: #f1f8f6; }
.peserta-main { flex: 1; padding: 40px 0 64px; }
.peserta-heading { margin: 0 auto 30px; max-width: 780px; }
.peserta-badge { display: inline-block; padding: 7px 14px; margin-bottom: 14px; border-radius: 6px; background: #d97706; color: white; font-weight: 700; font-size: .75rem; letter-spacing: .04em; }
.peserta-heading h1 { color: var(--peserta-teal); font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 700; margin-bottom: 12px; }
.peserta-heading p { color: #6b7780; margin-bottom: 0; }
.peserta-content { max-width: 1080px; margin: 0 auto; }
.peserta-content > .container-fluid { padding-left: 0; padding-right: 0; }
.peserta-layout .card { border: 0; border-top: 4px solid var(--peserta-teal); border-radius: 12px; box-shadow: 0 8px 28px rgba(22, 49, 42, .07); }
.peserta-layout .card-header { padding: 20px 26px; background: white; border-bottom: 1px solid #e6eeeb; border-radius: 9px 9px 0 0; color: var(--peserta-teal); }
.peserta-layout .card-header::after { display: none; }
.peserta-layout .card-title { float: none; font-size: 1.15rem; font-weight: 600; margin: 0; }
.peserta-layout .card-body { padding: 26px; }
.peserta-layout .card-footer { padding: 18px 26px; background: #fbfcfc; border-top: 1px solid #e6eeeb; border-radius: 0 0 12px 12px; }
.peserta-layout .form-control, .peserta-layout .form-select { border-radius: 8px; font-size: .9375rem; border-color: #cbd5e1; }
.peserta-layout .form-control:focus, .peserta-layout .form-select:focus { border-color: var(--peserta-teal); box-shadow: 0 0 0 3px rgba(13, 92, 82, .15); }
.peserta-layout .form-label { font-weight: 600; }
.peserta-layout .form-check-input:checked { background-color: var(--peserta-teal); border-color: var(--peserta-teal); }
.peserta-layout .btn-primary { --bs-btn-bg: #0d5c52; --bs-btn-border-color: #0d5c52; --bs-btn-hover-bg: #09453e; --bs-btn-hover-border-color: #09453e; --bs-btn-active-bg: #09453e; --bs-btn-active-border-color: #09453e; --bs-btn-disabled-bg: #0d5c52; --bs-btn-disabled-border-color: #0d5c52; }
.peserta-layout .btn-success { --bs-btn-bg: #0d5c52; --bs-btn-border-color: #0d5c52; --bs-btn-hover-bg: #09453e; --bs-btn-hover-border-color: #09453e; --bs-btn-active-bg: #09453e; --bs-btn-active-border-color: #09453e; }
.peserta-layout .btn-orange-custom { color: white; font-weight: 600; background: linear-gradient(135deg, #ff7a00, #ee3a00); border: 0; }
.peserta-layout .btn-orange-custom:hover { color: white; background: linear-gradient(135deg, #ff8c1a, #ff4b14); }
.peserta-layout .text-primary, .peserta-layout .text-teal { color: var(--peserta-teal) !important; }
.peserta-layout .border-primary { border-color: var(--peserta-teal) !important; }
.peserta-layout .bg-primary { background-color: var(--peserta-teal) !important; }
.peserta-layout .nav-tabs { gap: 4px; }
.peserta-layout .nav-tabs .nav-link { color: var(--peserta-teal); }
.peserta-layout .nav-tabs .nav-link.active { color: #09453e; font-weight: 600; }
.peserta-layout .select2-container { max-width: 100%; }
.peserta-layout .select2-container .select2-selection--single { min-height: 38px; border: 1px solid #cbd5e1; border-radius: 8px; padding: 4px 8px; }
.peserta-layout .select2-container .select2-selection__rendered { line-height: 28px; }
.peserta-layout .select2-container .select2-selection__arrow { height: 36px; }
.peserta-layout .select2-container--focus .select2-selection { border-color: var(--peserta-teal); }
.peserta-layout .select2-selection.is-invalid { border-color: #dc3545; }
.peserta-footer { background: #0b302c; color: white; padding-top: 34px; }
.peserta-footer-brand { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 20px; text-align: left; font-weight: 700; color: white; text-decoration: none; font-size: .9rem; }
.peserta-footer-brand img { object-fit: contain; }
.peserta-footer-logo { display: grid; width: 330px; max-width: 100%; }
.peserta-footer-brand .peserta-footer-wordmark { grid-area: 1 / 1; width: 100%; height: auto; }
.peserta-footer-text-white { filter: brightness(0) invert(1); clip-path: inset(0 0 0 17%); }
.peserta-footer-brand { max-width: 100%; }
.peserta-footer-brand small { display: block; font-size: .65rem; letter-spacing: .2em; margin-top: 3px; }
.peserta-footer-brand:hover { color: white; }
.peserta-footer p { color: #becfcb; font-size: .8rem; line-height: 1.8; margin-bottom: 28px; }
.peserta-copyright { background: #082823; padding: 20px 16px; text-align: center; color: #b7cbc5; font-size: .75rem; }
@media (max-width: 767.98px) {
    .peserta-header-inner { flex-direction: column; gap: 16px; padding-top: 16px; padding-bottom: 16px; }
    .peserta-brand img { width: 52px; height: 58px; }
    .peserta-brand strong { font-size: 1rem; }
    .peserta-brand small { font-size: .8rem; }
    .peserta-header-right { align-items: center; gap: 12px; width: 100%; }
    .peserta-contacts, .peserta-nav { justify-content: center; gap: 6px; }
    .peserta-contact { font-size: .7rem; padding: 5px 9px; }
    .peserta-main { padding: 28px 0 40px; }
    .peserta-heading { margin-bottom: 24px; }
    .peserta-heading p { font-size: .85rem; }
    .peserta-layout .card-header, .peserta-layout .card-body, .peserta-layout .card-footer { padding: 18px; }
}
.peserta-login { width: 100%; max-width: 460px; margin: 0 auto; }
.peserta-login .card-body { padding: 32px; }
.peserta-login-icon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin: 0 auto 20px; border-radius: 50%; background: #e8f3ef; color: var(--peserta-teal); font-size: 1.8rem; }
.peserta-login .input-group-text { background: #f5f9f7; color: var(--peserta-teal); border-color: #cbd5e1; min-width: 42px; justify-content: center; }
.peserta-login .input-group .form-control { border-radius: 0; min-height: 44px; }
.peserta-login .input-group .form-control:last-child { border-radius: 0 8px 8px 0; }
.peserta-login .input-group-text:first-child { border-radius: 8px 0 0 8px; }
@media (max-width: 575.98px) {
    .peserta-login .card-body { padding: 24px 20px; }
}