/* Public membership presentation; registration behaviour stays in keahlian.php. */
.membership-page { background: #fff; color: #1a1a1a; }
.membership-page .page-header { padding: 30px 0 26px; background: linear-gradient(120deg, #1a1a1a, #302318); }
.membership-eyebrow { color: #ffad68; font-size: .7rem; letter-spacing: .15em; font-weight: 600; }
.membership-page .page-header h1 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.045em; margin: 10px 0 !important; }
.membership-page .page-header h1 span { color: #FF8218; }
.membership-page .page-header .lead { color: #ddd; font-size: .95rem; margin-bottom: 14px; }
.membership-page .breadcrumb { font-size: .78rem; margin-bottom: 0; }
.membership-shortcuts { display: flex; justify-content: center; gap: 12px; padding-top: 22px; padding-bottom: 4px; flex-wrap: wrap; }
.membership-shortcuts a { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 18px; border: 1px solid #e6e6e6; border-radius: 9px; color: #444; background: #fafafa; font-size: .8rem; text-decoration: none; min-height: 44px; }
.membership-shortcuts a:hover { color: #9b4300; background: #fff1e5; border-color: #ffc99c; }
.membership-shortcuts i { color: #e67316; }
.membership-page section.py-5 { padding-top: 46px !important; padding-bottom: 46px !important; }
.membership-page .section-title.mb-5 { margin-bottom: 30px !important; }
.membership-page .section-title h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); font-weight: 700; letter-spacing: -.035em; }
.membership-page .section-title h2::after { width: 44px; height: 3px; }
.membership-page p, .membership-page li { line-height: 1.8; }
.membership-page .section-title p { font-size: .9rem; }
.membership-page .card-pelekat { border: 1px solid #e8e8e8 !important; border-radius: 15px; box-shadow: none; overflow: hidden; background: #fff; }
.membership-page .card-pelekat:hover { transform: none; box-shadow: 0 8px 24px #00000008; }
.membership-page .card-body { padding: 26px !important; }
.membership-page .card-body p { font-size: .88rem; }
.membership-page .card-body h5 { font-size: 1.05rem; line-height: 1.5; }
.membership-page .icon { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 13px; background: #fff1e5; color: #e67316 !important; font-size: 1.6rem !important; margin-top: 0 !important; }
.membership-page .membership-plans .card-pelekat { border-top: 3px solid #FF8218 !important; }
.membership-plans .card-body { display: flex; flex-direction: column; text-align: left !important; }
.membership-plans h4 { font-size: 1.25rem; }
.membership-plans .price { min-height: 146px; padding-bottom: 18px; border-bottom: 1px solid #eee; }
.membership-plans .price h2 { color: #1a1a1a !important; font-size: clamp(1.5rem, 2.2vw, 1.9rem); letter-spacing: -.04em; }
.membership-plans .price small { display: block; margin-top: 8px; line-height: 1.7; }
.membership-plans ul li { display: flex; align-items: baseline; gap: 9px; font-size: .85rem; color: #555; }
.membership-plans ul li i { color: #e67316 !important; flex-shrink: 0; }
.membership-plans .card-body > .btn { margin-top: auto; }
.membership-page .membership-plans .plan-biasa { background: linear-gradient(145deg, #fff3e8, #ffe0c3); border-color: #ffc18c !important; }
.membership-page .membership-plans .plan-biasa .icon { background: #fff9f3; color: #a84800 !important; }
.membership-plans .plan-biasa .price { border-color: #edbd95; }
.membership-plans .plan-biasa .text-muted, .membership-plans .plan-biasa ul li { color: #704a2d !important; }
.membership-page .membership-plans .plan-bersekutu { background: linear-gradient(145deg, #ffe6d6, #ffc5a3); border-color: #efac85 !important; border-top-color: #FF8218 !important; color: #402719; }
.membership-plans .plan-bersekutu .price h2 { color: #8b390b !important; }
.membership-plans .plan-bersekutu .price { border-color: #dfa27d; }
.membership-plans .plan-bersekutu .text-muted, .membership-plans .plan-bersekutu ul li { color: #69432d !important; }
.membership-page .membership-plans .plan-bersekutu .icon { background: #fff5ed; color: #a84800 !important; }
.membership-plans .plan-bersekutu ul li i { color: #a84800 !important; }
.membership-page .membership-plans .plan-kehormat { background: linear-gradient(145deg, #fffaf4, #f1e7da); border-color: #e4c8a9 !important; }
.membership-page .membership-plans .plan-kehormat .icon { background: #fff; color: #a84800 !important; }
.membership-plans .plan-kehormat .price { border-color: #dfcdb9; }
.membership-plans .plan-kehormat .text-muted, .membership-plans .plan-kehormat ul li { color: #675443 !important; }
.membership-page .btn { min-height: 44px; border-radius: 9px; padding: 11px 18px; font-size: .9rem; font-weight: 600; }
.membership-page #syarat .card-body { padding: 30px !important; }
.membership-page #syarat li { font-size: .9rem; color: #555; padding-left: 4px; }
.membership-page #syarat li::marker { color: #e67316; }
.membership-page #syarat h5 { border-left: 3px solid #FF8218; padding-left: 12px; }
.membership-page #daftar .card-pelekat { border-top: 3px solid #FF8218 !important; }
.membership-page #daftar .card-body { padding: 32px !important; }
.membership-page #membershipForm h5 { color: #1a1a1a !important; padding-bottom: 14px; border-bottom: 1px solid #eee; }
.membership-page .form-label { font-size: .85rem; font-weight: 600; margin-bottom: 7px; }
.membership-page .form-control, .membership-page .form-select { min-height: 48px; border: 1px solid #d9d9d9; border-radius: 9px; padding: 11px 13px; font-size: 1rem; }
.membership-page .form-select { padding-right: 36px; }
.membership-page .form-control:focus, .membership-page .form-select:focus { border-color: #FF8218; box-shadow: 0 0 0 3px #ff82181a; }
.membership-page .form-control[readonly] { background: #f5f5f5; color: #666; }
.membership-page form small { display: block; margin-top: 6px; font-size: .75rem; line-height: 1.7; }
.membership-page #ic_gate_hint { padding: 12px 14px; border-radius: 8px; background: #fff5ec; color: #874611 !important; }
.membership-page .alert { border-radius: 10px; font-size: .88rem; line-height: 1.8; overflow-wrap: anywhere; }
.membership-page .form-check-label { font-size: .85rem; line-height: 1.8; }
.membership-page .form-check-input:checked { background-color: #e67316; border-color: #e67316; }
.membership-page #semakan .card-pelekat { background: #fafafa; }
.membership-page #semakan .form-control { background: #fff; }
.membership-page a:focus-visible, .membership-page button:focus-visible { outline: 3px solid #FF8218; outline-offset: 3px; }
@media (max-width: 991.98px) {
    .membership-plans .price { min-height: 0; }
}
@media (max-width: 575.98px) {
    .membership-page .container { padding-left: 20px; padding-right: 20px; }
    .membership-page .page-header { padding: 24px 0; }
    .membership-page .page-header .lead { font-size: .85rem; }
    .membership-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding-top: 18px; }
    .membership-shortcuts a { font-size: .72rem; padding: 10px 8px; gap: 6px; }
    .membership-page section.py-5 { padding-top: 32px !important; padding-bottom: 32px !important; }
    .membership-page .section-title.mb-5 { margin-bottom: 24px !important; }
    .membership-page .card-body, .membership-page #syarat .card-body, .membership-page #daftar .card-body { padding: 22px !important; }
    .membership-page #syarat ul { padding-left: 20px; }
    .membership-page .form-control[type="file"] { font-size: .85rem; }
    .membership-page .membership-plans .price h2 { font-size: 1.8rem; }
}
@media (prefers-reduced-motion: reduce) {
    .membership-page *, .membership-page *::before, .membership-page *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
/* Compact phone layout only. Keep all information and usable form controls. */
@media (max-width: 575.98px) {
    .membership-page .container { padding-left: 16px; padding-right: 16px; }
    .membership-page .page-header { padding: 16px 0; }
    .membership-eyebrow { font-size: .6rem; letter-spacing: .1em; }
    .membership-page .page-header h1 { font-size: 1.7rem; margin: 6px 0 !important; }
    .membership-page .page-header .lead { font-size: .78rem; margin-bottom: 6px; }
    .membership-page .breadcrumb { font-size: .7rem; }
    .membership-shortcuts { padding-top: 12px; gap: 6px; }
    .membership-shortcuts a { padding: 6px 8px; }
    .membership-page section.py-5 { padding-top: 22px !important; padding-bottom: 18px !important; }
    .membership-page .section-title.mb-5 { margin-bottom: 16px !important; }
    .membership-page .section-title h2 { font-size: 1.3rem; margin-bottom: 8px; padding-bottom: 10px; }
    .membership-page .section-title p { font-size: .78rem; margin-bottom: 0; line-height: 1.5; }
    .membership-page .row { --bs-gutter-x: 12px; }
    .membership-page .row > .mb-4 { margin-bottom: 12px !important; }
    .membership-page .card-body, .membership-page #syarat .card-body, .membership-page #daftar .card-body { padding: 16px !important; }
    .membership-page .icon { width: 36px; height: 36px; border-radius: 9px; font-size: 1.2rem !important; margin-bottom: 10px !important; }
    .membership-plans .card-body { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 0 10px; }
    .membership-plans .card-body > .icon { grid-column: 1; grid-row: 1; }
    .membership-plans .card-body > h4 { grid-column: 2; grid-row: 1; align-self: center; font-size: 1.05rem; margin-bottom: 10px !important; }
    .membership-plans .price, .membership-plans .card-body > ul, .membership-plans .card-body > .btn { grid-column: 1 / -1; }
    .membership-plans .price { padding-bottom: 10px; margin-bottom: 10px !important; }
    .membership-page .membership-plans .price h2 { font-size: 1.45rem; margin-bottom: 2px; }
    .membership-plans .price small { margin-top: 4px; font-size: .75rem !important; line-height: 1.5; }
    .membership-plans .price p { margin-bottom: 0; }
    .membership-plans ul { margin-bottom: 12px !important; }
    .membership-plans ul li { font-size: .78rem; line-height: 1.5; gap: 6px; margin-bottom: 5px !important; }
    .membership-page .btn { padding: 9px 12px; font-size: .82rem; }
    .membership-page .membership-benefits .row > .col-md-4 { width: 50%; }
    .membership-page .membership-benefits .card-body { padding: 12px !important; }
    .membership-page .membership-benefits h5 { font-size: .86rem; line-height: 1.4; margin-bottom: 8px !important; overflow-wrap: anywhere; }
    .membership-page .membership-benefits p { font-size: .76rem; line-height: 1.55; margin-bottom: 0; }
    .membership-page #syarat h5 { font-size: .9rem; margin-bottom: 10px !important; }
    .membership-page #syarat ul { margin-bottom: 16px !important; }
    .membership-page #syarat ul:last-child { margin-bottom: 0 !important; }
    .membership-page #syarat li { font-size: .8rem; line-height: 1.6; margin-bottom: 5px !important; }
    .membership-page form .mb-3 { margin-bottom: 12px !important; }
    .membership-page .form-label { margin-bottom: 4px; font-size: .8rem; }
    .membership-page .form-control, .membership-page .form-select { min-height: 44px; padding-top: 8px; padding-bottom: 8px; }
    .membership-page #membershipForm h5 { font-size: .95rem; padding-bottom: 10px; margin-bottom: 12px !important; }
    .membership-page form small { font-size: .7rem; line-height: 1.5; margin-top: 4px; }
    .membership-page #ic_gate_hint { padding: 8px 10px; }
}
@media (min-width: 390px) and (max-width: 575.98px) {
    .membership-plans .card-body > ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; }
}

/* Registration form: clear sections and a readable receipt upload. */
.membership-page #daftar{background:#f7f8fa!important}.membership-page #daftar>.container>.row>.col-lg-8{width:100%;max-width:960px}.membership-page #daftar .card-pelekat{border:1px solid #e5e7eb!important;border-radius:20px;box-shadow:0 12px 36px #15223808}.membership-page #daftar .card-body{padding:32px!important}.registration-intro{display:flex;align-items:flex-start;gap:16px;padding-bottom:24px;margin-bottom:26px;border-bottom:1px solid #eceef1}.registration-symbol{display:grid;place-items:center;width:48px;height:48px;flex-shrink:0;border-radius:14px;background:#fff0e3;color:#994500;font-size:1.5rem}.registration-intro h3{font-size:1.3rem;font-weight:700;margin:2px 0 8px}.registration-intro p{color:#626875;font-size:.85rem!important;line-height:1.8;margin:0}.registration-heading{display:flex;align-items:center;gap:10px;font-size:1rem;font-weight:700;line-height:1.5;margin:28px 0 20px;color:#232733}.registration-heading>span{display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;border-radius:50%;background:#fff0e3;color:#924000;font-size:.8rem}.registration-heading>i{color:#a34a00}.registration-intro+.registration-heading{margin-top:0}.membership-page #membershipForm #contact_section,.membership-page #membershipForm #farming_section,.membership-page #membershipForm #payment_section{border-top:1px solid #eceef1;margin-top:24px;padding-top:1px}.membership-page #membershipForm .row{--bs-gutter-x:24px}.membership-page #membershipForm .mb-3{margin-bottom:20px!important}.membership-page #membershipForm .form-label{font-size:.85rem;color:#343944;margin-bottom:8px}.membership-page #membershipForm .form-control,.membership-page #membershipForm .form-select{width:100%;min-width:0;max-width:100%;min-height:48px;background-color:#fff;border-color:#dce0e5;border-radius:10px;font-size:.94rem;padding:12px 14px}.membership-page #membershipForm .form-select{padding-right:36px}.membership-page #membershipForm .form-control[readonly]{background:#f5f6f8!important;color:#626875}.membership-page #membershipForm .form-control:focus,.membership-page #membershipForm .form-select:focus{border-color:#ed8a35;box-shadow:0 0 0 4px #ff821815}.membership-page #membershipForm small{font-size:.75rem;line-height:1.7}.membership-page #membershipForm .registration-bank{background:#fff8f0;border:1px solid #f2d4b8;border-left:4px solid #ff8218;color:#674126;padding:20px;font-size:.87rem;line-height:1.95;border-radius:12px}.membership-page #membershipForm #payment_amount{font-size:1.2rem;font-weight:700;color:#202530}.membership-page #membershipForm .receipt-upload-panel{padding:20px;border:1px dashed #deb78f;border-radius:12px;background:#fffcf8}.membership-page #membershipForm input[type=file]{padding:0;background:white;min-height:48px;font-size:.86rem}.membership-page #membershipForm input[type=file]::file-selector-button{margin:0 12px 0 0;padding:14px;border:0;border-right:1px solid #e5e7eb;background:#fff0e3;color:#7c3900;font-weight:600}.receipt-selection{font-size:.8rem!important;color:#596273;margin:10px 0 0;overflow-wrap:anywhere}.receipt-selection.receipt-error{color:#b42318;font-weight:500}.membership-page #membershipForm .registration-consent{padding:16px 16px 16px 44px;border:1px solid #e8eaee;background:#fafbfc;border-radius:10px}.membership-page #membershipForm .registration-consent .form-check-input{width:18px;height:18px;margin-left:-28px;margin-top:4px}.membership-page #membershipForm .registration-consent a{color:#9a4500!important;text-underline-offset:3px}.membership-page #membershipForm #submit_button{width:100%;min-height:50px;display:flex;align-items:center;justify-content:center;gap:10px;background:#ff8218;border:1px solid #ff8218;color:#1a1a1a;border-radius:10px;font-size:.95rem}.membership-page #membershipForm #submit_button:hover{background:#ff9a47;transform:none}.membership-page #membershipForm #ic_gate_hint{background:#f6f7f9;color:#606875!important;border:1px solid #e8eaee;padding:12px 14px}.membership-page #membershipForm input[type=date],.membership-page #membershipForm input[type=time]{appearance:none;min-width:0}.membership-page #membershipForm .row>*{min-width:0}.membership-page #daftar .section-title.text-center::after{left:50%;transform:translateX(-50%)}
@media(max-width:575px){.membership-page #daftar .card-body{padding:20px 16px!important}.membership-page #daftar .card-pelekat{border-radius:14px}.registration-intro{gap:12px;padding-bottom:20px;margin-bottom:22px}.registration-symbol{width:40px;height:40px;font-size:1.2rem;border-radius:11px}.registration-intro h3{font-size:1.05rem}.registration-intro p{font-size:.79rem!important}.registration-heading{font-size:.92rem;margin:24px 0 18px;gap:8px}.registration-heading>i{display:none}.membership-page #membershipForm .form-control,.membership-page #membershipForm .form-select{font-size:16px}.membership-page #membershipForm .form-label{font-size:.82rem}.membership-page #membershipForm .row{--bs-gutter-x:14px}.membership-page #membershipForm .registration-bank{padding:16px;font-size:.82rem}.membership-page #membershipForm .receipt-upload-panel{padding:14px}.membership-page #membershipForm input[type=file]{font-size:.78rem}.membership-page #membershipForm input[type=file]::file-selector-button{padding:14px 10px;margin-right:8px}.membership-page #membershipForm .registration-consent{padding-right:12px}.membership-page #membershipForm .form-check-label{font-size:.8rem}}

/* Match application-status checks to the registration form. */
.membership-page #semakan{background:#f7f8fa;border-top:1px solid #eceef1}.membership-page #semakan>.container>.row>.col-lg-6{width:100%;max-width:960px}.membership-page #semakan .section-title.text-center::after{left:50%;transform:translateX(-50%)}.membership-page #semakan .card-pelekat{background:#fff;border:1px solid #e5e7eb!important;border-radius:20px;box-shadow:0 12px 36px #15223808}.membership-page #semakan .card-body{padding:32px!important}.membership-page #semakan .status-intro{margin-bottom:24px}.membership-page #checkStatusForm .form-label{font-size:.85rem;color:#343944;margin-bottom:8px}.membership-page #checkStatusForm .form-control{min-height:48px;width:100%;min-width:0;border:1px solid #dce0e5;border-radius:10px;font-size:1rem;padding:12px 14px;background:#fff}.membership-page #checkStatusForm .form-control:focus{border-color:#ed8a35;box-shadow:0 0 0 4px #ff821815}.membership-page #checkStatusForm .mb-3{margin-bottom:20px!important}.membership-page #checkStatusForm small{font-size:.75rem;line-height:1.7;margin-top:7px}.membership-page #checkStatusBtn,.membership-page #statusResult .btn{min-height:50px;display:flex;align-items:center;justify-content:center;gap:10px;background:#ff8218;border:1px solid #ff8218;color:#1a1a1a;border-radius:10px;font-size:.95rem;font-weight:600}.membership-page #checkStatusBtn:hover,.membership-page #statusResult .btn:hover{background:#ff9a47;transform:none}.membership-page #checkStatusBtn:disabled{opacity:.7;cursor:wait}.membership-page #statusResult{padding-top:24px;border-top:1px solid #eceef1;overflow-wrap:anywhere}.membership-page #statusResult .alert{margin:0;padding:22px;border-radius:12px;border-width:1px;border-left-width:4px;line-height:1.85}.membership-page #statusResult .alert-heading{font-size:1.05rem;line-height:1.6;font-weight:700}.membership-page #statusResult p{font-size:.87rem;line-height:1.85}.membership-page #statusResult .alert-success{background:#f0faf4;border-color:#b8dfc8;color:#23583d}.membership-page #statusResult .alert-warning{background:#fff8eb;border-color:#ecd49e;color:#73521b}.membership-page #statusResult .alert-info,.membership-page #statusResult .alert-primary{background:#f1f6ff;border-color:#c5d6ed;color:#294a73}.membership-page #statusResult .alert-danger{background:#fff3f1;border-color:#efc4bc;color:#8a3027}.membership-page #statusResult hr{opacity:.14;margin:18px 0}.membership-page #statusResult .btn{display:inline-flex;padding:10px 18px;min-height:44px;font-size:.85rem}.membership-page #statusResult .badge{font-size:.75rem;padding:6px 9px}.membership-page #statusResult .text-muted{color:inherit!important;opacity:.85}
@media(max-width:575px){.membership-page #semakan .card-body{padding:20px 16px!important}.membership-page #semakan .card-pelekat{border-radius:14px}.membership-page #checkStatusForm .form-control{font-size:16px}.membership-page #checkStatusForm .form-label{font-size:.82rem}.membership-page #checkStatusBtn{font-size:.9rem}.membership-page #statusResult .alert{padding:16px}.membership-page #statusResult .alert-heading{font-size:.95rem}.membership-page #statusResult p{font-size:.82rem}.membership-page #statusResult .btn{width:100%;font-size:.8rem}}

/* Compact registration layout, keeping all fields in the same form. */
.membership-page #membershipForm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}
.membership-page #membershipForm>*{grid-column:1/-1;min-width:0}
.membership-page #membershipForm>.mb-3{grid-column:auto}
.membership-page #membershipForm .registration-intro{padding-bottom:16px;margin-bottom:18px}
.membership-page #membershipForm .registration-heading{margin:18px 0 14px;font-size:.95rem}
.membership-page #membershipForm .registration-intro+.registration-heading{margin-top:0}
.membership-page #membershipForm .mb-3{margin-bottom:14px!important}
.membership-page #membershipForm .form-label{margin-bottom:6px}
.membership-page #membershipForm .form-control,.membership-page #membershipForm .form-select{min-height:44px;padding-top:9px;padding-bottom:9px}
.membership-page #membershipForm textarea.form-control{min-height:80px}
.membership-page #membershipForm small{margin-top:4px;line-height:1.5}
.membership-page #membershipForm #new_member_section[style*="display: block"]{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}
.membership-page #membershipForm #new_member_section>.mb-3:first-child{grid-column:1/-1}
.membership-page #membershipForm #new_member_section>.row{grid-column:1;grid-row:2}
.membership-page #membershipForm #new_member_section>.mb-3:last-child{grid-column:2;grid-row:2}
.membership-page #membershipForm #new_member_section .row>.col-md-6{width:50%}
.membership-page #membershipForm #contact_section,.membership-page #membershipForm #farming_section{grid-column:auto;margin-top:10px;padding-top:0}
.membership-page #membershipForm #farming_section{border-left:1px solid #eceef1;padding-left:22px}
.membership-page #membershipForm #contact_section>.row>.col-md-6{width:50%}
.membership-page #membershipForm #contact_section>.row>.col-md-4{width:50%}
.membership-page #membershipForm #contact_section>.row>.col-md-4:first-child{width:100%}
.membership-page #membershipForm #farming_section .row>.col-md-6{width:50%}
.membership-page #membershipForm #payment_section{margin-top:12px}
.membership-page #membershipForm #payment_section[style*="display: block"]{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}
.membership-page #membershipForm #payment_section>.registration-heading,.membership-page #membershipForm #payment_section>.registration-bank,.membership-page #membershipForm #payment_section>.mb-3:last-child{grid-column:1/-1}
.membership-page #membershipForm .registration-bank{padding:14px 18px;line-height:1.7;font-size:.82rem;margin-bottom:16px}
.membership-page #membershipForm #payment_section>.row>.col-md-6{width:50%}
.membership-page #membershipForm .receipt-upload-panel{padding:12px 14px}
.membership-page #membershipForm .receipt-selection{margin-top:5px;font-size:.73rem!important}
.membership-page #membershipForm .registration-consent{padding-top:12px;padding-bottom:12px}
.membership-page #membershipForm #submit_button{min-height:46px}
@media(max-width:767px){
 .membership-page #membershipForm{gap:0 14px}
 .membership-page #membershipForm #contact_section,.membership-page #membershipForm #farming_section{grid-column:1/-1}
 .membership-page #membershipForm #farming_section{border-left:0;padding-left:0}
 .membership-page #membershipForm #contact_section>.row>.col-md-4{width:33.333333%}
 .membership-page #membershipForm #contact_section>.row>.col-md-4:first-child{width:33.333333%}
 .membership-page #membershipForm #payment_section[style*="display: block"]{gap:0 14px}
 .membership-page #membershipForm #payment_section>.mb-3,.membership-page #membershipForm #payment_section>.row{grid-column:1/-1}
 .membership-page #membershipForm #new_member_section[style*="display: block"]{gap:0 14px}
 .membership-page #membershipForm #new_member_section>.row{grid-column:1/-1}
 .membership-page #membershipForm #new_member_section>.mb-3:last-child{grid-column:1/-1;grid-row:3}
}
@media(max-width:575px){
 .membership-page #daftar .card-body{padding:16px!important}
 .membership-page #membershipForm>.mb-3{grid-column:1/-1}
 .membership-page #membershipForm .registration-intro{padding-bottom:12px;margin-bottom:14px}
 .membership-page #membershipForm .registration-intro p{font-size:.75rem!important;line-height:1.6}
 .membership-page #membershipForm .registration-heading{margin:16px 0 12px;font-size:.9rem}
 .membership-page #membershipForm .mb-3{margin-bottom:12px!important}
 .membership-page #membershipForm .form-label{font-size:.76rem;line-height:1.5}
 .membership-page #membershipForm #contact_section>.row>.col-md-6{width:100%}
 .membership-page #membershipForm #contact_section>.row>.col-md-4{width:50%}
 .membership-page #membershipForm #contact_section>.row>.col-md-4:first-child{width:100%}
 .membership-page #membershipForm .registration-bank{padding:12px;font-size:.78rem;line-height:1.7}
}

@media(max-width:359px){.membership-page #membershipForm #payment_section>.row>.col-md-6{width:100%}}

/* Consistent membership-page layout across desktop, tablet and phone. */
.membership-page{background:#fff;color:#20242c}.membership-page .container{min-width:0}.membership-page .row>*{min-width:0}.membership-page .section-title.text-center::after{left:50%;transform:translateX(-50%)}.membership-page section.py-5{padding-top:48px!important;padding-bottom:48px!important}.membership-page .section-title h2{line-height:1.4;letter-spacing:-.025em}.membership-page .section-title p{max-width:650px;margin-left:auto;margin-right:auto;line-height:1.8}.membership-page .membership-shortcuts{gap:10px;padding-top:24px;padding-bottom:0}.membership-shortcuts a{background:#fff;border-color:#e2e5e9;font-size:.83rem}.membership-shortcuts a:hover{border-color:#f4b77e;background:#fff6ed}.membership-page .membership-plans .row{--bs-gutter-x:20px}.membership-page .membership-plans .card-body{padding:24px!important}.membership-page .membership-plans .card-pelekat{border-radius:16px}.membership-page .membership-plans .plan-biasa{background:#fff8f0;border-color:#edb781!important}.membership-page .membership-plans .plan-bersekutu,.membership-page .membership-plans .plan-kehormat{background:#fff;border-color:#e2e5e9!important;border-top-color:#e1c4a6!important}.membership-page .membership-plans .price h2{font-size:1.65rem!important;line-height:1.4;color:#292929!important}.membership-page .membership-plans .price{min-height:144px}.membership-page .membership-plans .price small{font-size:.78rem!important}.membership-page .membership-plans h4{font-size:1.15rem}.membership-page .membership-plans ul li{line-height:1.65;font-size:.83rem;color:#5e626a!important}.membership-page .membership-plans .text-muted{color:#646972!important}.membership-page .membership-benefits{background:#faf8f5!important}.membership-page .membership-benefits .row{--bs-gutter-x:20px}.membership-page .membership-benefits .card-body{padding:22px!important}.membership-page .membership-benefits h5{font-size:1rem}.membership-page .membership-benefits p{font-size:.84rem;line-height:1.8;margin-bottom:0}.membership-page .membership-benefits .icon{width:44px;height:44px;font-size:1.3rem!important}.membership-page #syarat .card-body{padding:26px!important}.membership-page #syarat li{line-height:1.85;font-size:.86rem}.membership-page .btn-pelekat{background:#ff8218;color:#1a1a1a;border:1px solid #ff8218}.membership-page .btn-pelekat:hover{background:#ff9a47;color:#1a1a1a;transform:none}.membership-page .btn:disabled{background:#f0f1f3;color:#727780;border-color:#e1e3e7;opacity:1}.membership-page #daftar>.container>.row>.col-lg-8,.membership-page #semakan>.container>.row>.col-lg-6{max-width:1000px}.membership-page #membershipForm input,.membership-page #membershipForm select,.membership-page #membershipForm textarea{max-width:100%}.membership-page #semakan .registration-intro,.membership-page #daftar .registration-intro{align-items:flex-start}
@media(min-width:992px) and (max-width:1199px){.navbar-pelekat .navbar-brand{margin-right:10px}.navbar-pelekat .navbar-brand .brand-name{font-size:1.1rem}.navbar-pelekat .navbar-brand .brand-tagline{max-width:170px;white-space:normal;font-size:.55rem}.navbar-pelekat .navbar-nav .nav-link{font-size:.75rem;padding:.5rem .35rem!important}.navbar-pelekat .navbar-nav .btn{font-size:.75rem;padding:9px 12px!important;white-space:nowrap}}
@media(min-width:768px) and (max-width:991px){.membership-page .membership-plans .col-lg-4{width:50%}.membership-page .membership-plans .col-lg-4:last-child{width:100%}.membership-page .membership-plans .col-lg-4:last-child .price{min-height:0}.membership-page .membership-benefits .col-md-4{width:50%}.membership-page .membership-plans .price{min-height:144px}}
@media(max-width:767px){.membership-page section.py-5{padding-top:32px!important;padding-bottom:32px!important}.membership-page .section-title.mb-5{margin-bottom:24px!important}.membership-page .membership-plans .price{min-height:0}.membership-page .membership-plans .card-body{padding:20px!important}.membership-page .membership-plans .card-body>h4{margin-bottom:12px!important}.membership-page .membership-plans ul{margin-bottom:18px!important}.membership-page .membership-benefits .col-md-4{width:50%}.membership-page .membership-benefits .card-body{padding:18px!important}.membership-page .membership-benefits h5{font-size:.92rem}.membership-page .membership-benefits p{font-size:.8rem}.membership-page #syarat .card-body{padding:20px!important}.membership-page #membershipForm .form-control,.membership-page #membershipForm .form-select{font-size:16px}}
@media(max-width:575px){.membership-page .section-title h2{font-size:1.4rem}.membership-page .section-title p{font-size:.84rem}.membership-page .membership-shortcuts{padding-top:18px;gap:8px}.membership-shortcuts a{font-size:.74rem;min-height:46px;padding:9px 8px}.membership-page .membership-plans .price h2{font-size:1.5rem!important}.membership-page .membership-plans ul{display:block}.membership-page .membership-plans ul li{font-size:.81rem;line-height:1.6;margin-bottom:7px!important}.membership-page .membership-benefits .row{--bs-gutter-x:12px}.membership-page .membership-benefits .card-body{padding:16px!important}.membership-page .membership-benefits h5{font-size:.87rem;line-height:1.5}.membership-page .membership-benefits p{font-size:.78rem;line-height:1.7}.membership-page #syarat li{font-size:.83rem}.membership-page #membershipForm #contact_section>.row>.col-md-4{width:100%}.membership-page #membershipForm #contact_section>.row>.col-md-4:first-child{width:100%}.membership-page #membershipForm #contact_section input[readonly]{font-size:.9rem}.membership-page .registration-intro p{font-size:.8rem!important}}
@media(max-width:359px){.navbar-pelekat .navbar-brand{min-width:0;margin-right:8px;max-width:calc(100% - 58px)}.navbar-pelekat .navbar-brand img{width:35px;height:35px;margin-right:8px}.navbar-pelekat .navbar-brand .brand-text{min-width:0}.navbar-pelekat .navbar-brand .brand-name{font-size:1rem}.navbar-pelekat .navbar-brand .brand-tagline{font-size:.48rem;white-space:normal}.navbar-pelekat .navbar-toggler{padding:6px;width:44px;height:40px}.membership-page .membership-benefits .col-md-4{width:100%}.membership-page .membership-benefits .card-body{display:grid;grid-template-columns:36px minmax(0,1fr);gap:0 12px}.membership-page .membership-benefits .icon{width:36px;height:36px;grid-row:1/3}.membership-page .membership-benefits p{grid-column:2}.membership-page .membership-benefits h5{margin-bottom:8px!important}}