/* Public forms (login, forgot/reset password, request account) in the public design. Replaces Bootstrap on those pages. */
.auth-wrap { max-width: 1312px; margin: 0 auto; padding: 24px 48px 80px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 460px); gap: 60px; align-items: start; }
@media (max-width: 900px) { .auth-wrap { grid-template-columns: 1fr; padding: 16px 20px 60px; } .auth-art { display: none; } .site-header { height: 76px; padding-left: 20px; padding-right: 20px; } .site-header nav a:not(.login) { display: none; } }
.auth-art { position: relative; min-height: 520px; border-radius: 140px 7px 7px 7px; overflow: hidden; background: #112e25; }
.auth-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .75; }
.auth-art .giant-question { top: -30px; right: 30px; font-size: 420px; }
.auth-art .photo-note { left: 35px; bottom: 44px; }
.auth-card { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 34px 32px 28px; box-shadow: 0 12px 30px rgba(36,54,39,.06); }
.auth-card h1, .auth-card h2 { font-size: 40px; color: var(--green); margin-bottom: 6px; line-height: 1; }
.auth-card .lede { color: var(--muted-foreground); font-size: 15px; margin: 0 0 22px; }
.auth-card label, .form-label { display: block; font-size: 13px; font-weight: 700; color: var(--ink); margin: 14px 0 6px; }
.form-control, .auth-card input[type=text], .auth-card input[type=email], .auth-card input[type=password], .auth-card input[type=tel], .auth-card select, .auth-card textarea { width: 100%; box-sizing: border-box; font: inherit; font-size: 16px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 6px; background: var(--paper); color: var(--ink); }
.form-control:focus, .auth-card input:focus, .auth-card select:focus, .auth-card textarea:focus { outline: 3px solid #ffd253; outline-offset: 1px; border-color: var(--green); }
.input-group { display: flex; } .input-group-text { display: flex; align-items: center; padding: 0 12px; border: 1px solid var(--border); border-right: 0; border-radius: 6px 0 0 6px; background: var(--muted); color: var(--muted-foreground); } .input-group .form-control { border-radius: 0 6px 6px 0; }
.form-check { display: flex; align-items: flex-start; gap: 10px; margin: 12px 0; font-size: 14px; } .form-check-input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--green); } .form-check-label { margin: 0; font-weight: 500; } .form-check small, .text-muted { color: var(--muted-foreground); font-size: 12.5px; }
.btn, .button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font: inherit; font-weight: 700; font-size: 15px; padding: 14px 20px; border-radius: 6px; border: 1px solid transparent; cursor: pointer; text-decoration: none; }
.btn-primary { background: var(--gold); color: var(--ink); } .btn-primary:hover { background: #f2ad00; }
.btn-outline-secondary, .btn-secondary { background: transparent; color: var(--green); border-color: var(--border); }
.btn-lg { width: 100%; } .d-grid .btn { width: 100%; } .d-block { display: block; }
.alert { padding: 12px 14px; border-radius: 8px; margin: 0 0 16px; font-size: 14px; border-left: 4px solid; }
.alert-danger { background: #fbe9e7; border-color: #b2211f; color: #7a1a18; } .alert-success { background: #e6f3ea; border-color: #205b39; color: #1c4a30; } .alert-info, .alert-warning { background: #f7f1dc; border-color: #bd7100; color: #5a3a00; }
.alert .btn-close { display: none; }
.auth-links { margin-top: 18px; text-align: center; font-size: 14px; display: grid; gap: 8px; } .auth-links a { color: var(--green); font-weight: 600; }
.text-center { text-align: center; } .mb-2 { margin-bottom: 8px; } .mb-3 { margin-bottom: 14px; } .mb-4 { margin-bottom: 20px; } .mt-4 { margin-top: 20px; } .me-1, .me-2 { margin-right: 6px; }
.row { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; } .row > .col-md-6, .row > .col-6 { min-width: 0; } @media (max-width: 600px) { .row { grid-template-columns: 1fr; } }
.password-strength, .form-text { font-size: 12.5px; color: var(--muted-foreground); margin-top: 4px; }
.guide-shot { margin: 0; border: 1px solid #ccd2bc; border-radius: 9px; overflow: hidden; box-shadow: 0 12px 22px #2436270b; background: var(--paper); }
.guide-shot img { display: block; width: 100%; height: auto; }
.mt-2 { margin-top: 8px; }
.denied-reasons { margin: 0 0 22px; padding-left: 20px; color: var(--ink); font-size: 15px; line-height: 1.6; }

/* Request an account: short answers sit side by side, choices become chips, and each
   group is separated by a rule instead of a stack of full-width fields. */
@media (min-width: 901px) {
  .auth-wrap.wide { grid-template-columns: minmax(0, .8fr) minmax(380px, 620px); gap: 48px; }
}
.field-group { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--border); border-width: 1px 0 0; }
.field-group > legend { padding: 0; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--green); }
.field-group > .form-label:first-child, .field-group > label:first-child { margin-top: 0; }
.field-group small { display: block; margin-top: 8px; }
.chip-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.chip { position: relative; display: inline-flex; }
.chip input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.chip span { display: inline-flex; align-items: center; gap: 8px; padding: 9px 15px; border: 1px solid var(--border); border-radius: 999px; background: var(--paper); font-size: 14px; font-weight: 600; color: var(--ink); transition: background .12s, border-color .12s, color .12s; }
.chip:hover span { border-color: var(--green); }
.chip input:checked + span { background: var(--green); border-color: var(--green); color: var(--paper); }
.chip input:focus-visible + span { outline: 3px solid #ffd253; outline-offset: 2px; }
.opt { font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--muted-foreground); font-size: 12px; }