* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background:
        radial-gradient(circle at top, #17263d 0, #08101c 45%);
    color: #e6edf7;
    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

.public-header {
    border-bottom: 1px solid #263750;
    background: rgba(7, 14, 25, .9);
    backdrop-filter: blur(10px);
}

.public-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1180px;
    margin: auto;
    padding: 18px 24px;
}

.public-brand-small {
    display: block;
    color: #8e9caf;
    font-size: 10px;
    letter-spacing: 3px;
}

.public-brand {
    color: #80e94c;
    letter-spacing: 1px;
}

.public-header-label {
    color: #aab6c7;
    font-size: 13px;
}

.public-main {
    min-height: calc(100vh - 72px);
}

.public-container {
    max-width: 1180px;
    margin: auto;
    padding: 50px 24px 80px;
}

.public-hero {
    max-width: 760px;
    margin-bottom: 32px;
}

.eyebrow {
    color: #80e94c;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.public-hero h1,
.public-success-card h1 {
    margin: 10px 0 14px;
    font-size: clamp(32px, 5vw, 50px);
    line-height: 1.05;
}

.public-hero p,
.public-success-card > p {
    color: #9ba8ba;
    font-size: 17px;
    line-height: 1.65;
}

.public-alert {
    margin-bottom: 22px;
    padding: 18px 20px;
    border-radius: 12px;
}

.public-alert-danger {
    border: 1px solid rgba(248, 113, 113, .4);
    background: rgba(248, 113, 113, .1);
    color: #fecaca;
}

.public-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.public-card {
    padding: 26px;
    border: 1px solid #263750;
    border-radius: 16px;
    background: rgba(11, 21, 37, .92);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .18);
}

.public-card-heading {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 24px;
}

.public-card-heading > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 50%;
    background: #80e94c;
    color: #09121f;
    font-weight: 900;
}

.public-card-heading h2 {
    margin: 2px 0 5px;
    font-size: 21px;
}

.public-card-heading p {
    margin: 0;
    color: #8e9caf;
    font-size: 13px;
}

.public-grid {
    display: grid;
    gap: 17px;
}

.public-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.public-grid-full {
    grid-column: 1 / -1;
}

.field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.field label {
    color: #c7d1df;
    font-size: 13px;
    font-weight: 650;
}

input,
select,
textarea {
    width: 100%;
    border: 1px solid #34475f;
    border-radius: 9px;
    outline: none;
    background: #08111e;
    color: #e8eef7;
    font: inherit;
}

input,
select {
    min-height: 46px;
    padding: 10px 12px;
}

textarea {
    padding: 12px;
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus {
    border-color: #80e94c;
    box-shadow: 0 0 0 3px rgba(128, 233, 76, .1);
}

input[type="file"] {
    padding: 10px;
}

.public-plan-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.public-plan,
.public-payment-method {
    cursor: pointer;
}

.public-plan > input,
.public-payment-method > input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.public-plan-content,
.public-payment-method > div {
    height: 100%;
    padding: 18px;
    border: 1px solid #314258;
    border-radius: 12px;
    background: #091321;
    transition: .18s ease;
}

.public-plan:hover .public-plan-content,
.public-payment-method:hover > div {
    border-color: #536b88;
    transform: translateY(-1px);
}

.public-plan > input:checked + .public-plan-content,
.public-payment-method > input:checked + div {
    border-color: #80e94c;
    box-shadow: 0 0 0 2px rgba(128, 233, 76, .13);
}

.public-plan-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
}

.public-plan-top span {
    color: #80e94c;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.public-plan-top h3 {
    margin: 5px 0 0;
}

.public-plan-top strong {
    font-size: 20px;
    white-space: nowrap;
}

.public-plan-content p {
    min-height: 40px;
    color: #8e9caf;
    font-size: 13px;
    line-height: 1.5;
}

.public-plan-content small {
    color: #c1ccda;
}

.public-payment-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.public-form [hidden] {
    display: none !important;
}

.free-event-contribution{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;padding:20px;border:1px solid rgba(132,204,22,.45);border-radius:14px;background:linear-gradient(135deg,rgba(132,204,22,.12),rgba(34,197,94,.05))}.free-event-contribution[hidden]{display:none!important}.free-event-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#84cc16;color:#07111f;font-size:23px}.free-event-contribution h3{margin:0 0 8px}.free-event-contribution p{margin:0;color:#c1ccda;line-height:1.6}.public-donation-button{margin-top:16px;padding:11px 16px;border:0;border-radius:9px;background:#84cc16;color:#07111f;font-weight:800;cursor:pointer}.public-donation-button:hover{background:#a3e635}.donation-information{margin-top:13px!important;padding:12px;border-left:3px solid #84cc16;background:rgba(7,17,31,.35)}.donation-information[hidden]{display:none!important}@media(max-width:640px){.free-event-contribution{grid-template-columns:1fr}.free-event-icon{margin:auto}.public-donation-button{width:100%}}
.free-event-success{margin-top:22px;padding:20px;border:1px solid rgba(132,204,22,.4);border-radius:14px;background:rgba(132,204,22,.08);text-align:left}.free-event-success h2{margin-top:0}.free-event-success .public-donation-button{display:inline-flex;text-decoration:none}

.public-payment-method strong,
.public-payment-method span {
    display: block;
}

.public-payment-method span {
    margin-top: 6px;
    color: #8e9caf;
    font-size: 12px;
    line-height: 1.45;
}

.public-consents {
    display: grid;
    gap: 13px;
}

.public-consents label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #c7d1df;
    font-size: 14px;
}

.public-consents input {
    width: 17px;
    min-height: 17px;
    margin-top: 2px;
}

.public-notes {
    margin-top: 22px;
}

.public-submit-area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 23px;
    border: 1px solid #314258;
    border-radius: 14px;
    background: #0b1525;
}

.public-submit-area p {
    margin: 0;
    color: #8e9caf;
    font-size: 13px;
}

.public-submit {
    padding: 14px 22px;
    border: 0;
    border-radius: 9px;
    background: #80e94c;
    color: #09121f;
    font-weight: 850;
    cursor: pointer;
}

.public-success-container {
    max-width: 800px;
}

.public-success-card {
    padding: 42px;
    border: 1px solid #314258;
    border-radius: 18px;
    background: #0b1525;
    text-align: center;
}

.public-success-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 70px;
    margin: 0 auto 22px;
    border-radius: 50%;
    background: #80e94c;
    color: #09121f;
    font-size: 38px;
    font-weight: 900;
}

.public-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 28px 0;
    text-align: left;
}

.public-summary > div {
    padding: 15px;
    border-radius: 10px;
    background: #08111e;
}

.public-summary span,
.public-summary strong {
    display: block;
}

.public-summary span {
    margin-bottom: 5px;
    color: #8e9caf;
    font-size: 11px;
}

.public-success-note {
    color: #8e9caf !important;
    font-size: 13px !important;
}

@media (max-width: 750px) {
    .public-header-label {
        display: none;
    }

    .public-container {
        padding: 34px 15px 60px;
    }

    .public-card {
        padding: 20px 16px;
    }

    .public-grid-2,
    .public-plan-grid,
    .public-payment-grid,
    .public-summary {
        grid-template-columns: 1fr;
    }

    .public-grid-full {
        grid-column: auto;
    }

    .public-submit-area {
        align-items: stretch;
        flex-direction: column;
    }

    .public-submit {
        width: 100%;
    }
}


.field-help {
    color: #8190a4;
    font-size: 11px;
    line-height: 1.45;
}
