/* Client-only presentation. The original portal owns all forms and actions. */
body.hog-portal-branded {
    --hog-emerald: #1c3a33; --hog-deep: #142e28; --hog-bone: #f8f6f0;
    --hog-gold: #c7aa70; --hog-line: #dedfd6; --hog-ink: #1a1a1a;
    background: var(--hog-bone); color: var(--hog-ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.55;
}
.hog-portal-branded *, .hog-portal-branded *::before, .hog-portal-branded *::after { box-sizing: border-box; }
.hog-portal-branded .hog-portal-skip { position: fixed; left: 16px; top: -100px; z-index: 100000; padding: 12px 18px; background: #fff; color: #1c3a33; border: 2px solid #9a742f; }
.hog-portal-branded .hog-portal-skip:focus { top: 12px; }
.hog-portal-branded :is(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid #9a742f; outline-offset: 3px; }
.hog-portal-branded .hog-app-topbar {
    min-height: 112px; padding: 18px max(24px, calc((100vw - 1144px) / 2));
    gap: 24px; background: var(--hog-emerald); border-bottom: 2px solid var(--hog-gold);
}
.hog-portal-branded .hog-app-name { position: relative; flex-shrink: 0; width: 240px; padding-top: 88px; background: url("haus-of-grit-logo.png") no-repeat center top / 240px 90px; }
/* The original brand text remains available to screen readers. */
.hog-portal-branded .hog-app-name strong { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.hog-portal-branded .hog-app-name span { display: none; }
.hog-portal-branded .hog-app-actions { gap: 10px; flex-wrap: wrap; justify-content: flex-end; font-family: inherit; font-size: 13px; }
.hog-portal-branded .hog-app-client-name { max-width: 240px; overflow-wrap: anywhere; margin-right: 12px; color: #e0e6dc; opacity: 1; }
.hog-portal-branded .hog-app-actions a { min-height: 42px; padding: 10px 14px; border: 1px solid #6c8171; border-radius: 6px; font-weight: 600; }
.hog-portal-branded .hog-app-actions a:hover { background: #314e41; border-color: var(--hog-gold); }
.hog-portal-branded .hog-app-main { padding: 8px 0 48px; }
.hog-portal-branded .hog-portal {
    --hog-heading-font: Georgia, "Times New Roman", serif;
    --hog-body-font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --hog-body-size: 16px; --hog-white: #fffefa; --hog-emerald-border: #dedfd6;
    --hog-emerald-soft: #edf0e8;
    max-width: 1200px; padding: 0 28px; margin: 32px auto;
    font-size: 16px; line-height: 1.55; overflow-wrap: anywhere;
}
.hog-portal-branded .hog-portal > .hog-brand { display: none; }
.hog-portal-branded .hog-portal :is(h2,h3,h4) { font-family: var(--hog-heading-font); font-variant: normal; text-transform: none; letter-spacing: -.025em; }
.hog-portal-branded .hog-portal h2 { font-size: clamp(30px, 3vw, 42px); line-height: 1.18; font-weight: 400; }
.hog-portal-branded .hog-portal h3 { font-size: 24px; line-height: 1.25; font-weight: 400; }
.hog-portal-branded .hog-portal :is(p, li, .hog-detail-meta) { font-size: 15px; line-height: 1.6; }
.hog-portal-branded .hog-portal :is(.hog-portal-eyebrow,.hog-login-eyebrow,.hog-brand-line,.hog-request-card-label,.hog-billing-type,.hog-account-label,.hog-account-detail-row span,.hog-account-card-summary span,.hog-billing-card-summary span,.hog-billing-summary span,.hog-billing-meta span) { text-transform: none; letter-spacing: .01em; font-size: 12px; font-weight: 600; }
.hog-portal-branded .hog-portal-header { margin-bottom: 28px; padding: 32px 36px; background: var(--hog-emerald); color: var(--hog-bone); border: 1px solid var(--hog-emerald); border-left: 3px solid var(--hog-gold); border-radius: 10px; }
.hog-portal-branded .hog-portal-header h2 { margin: 6px 0 12px; color: var(--hog-bone); }
.hog-portal-branded .hog-portal-header .hog-portal-eyebrow { color: #dfc695; }
.hog-portal-branded .hog-portal-header .hog-portal-subtitle { color: #e0e6dc; opacity: 1; font-size: 16px; }
.hog-portal-branded .hog-portal-header .hog-brand-line { margin-top: 16px !important; color: #cbd4c7; font-size: 12px !important; font-weight: 400; text-transform: none; letter-spacing: 0; }
.hog-portal-branded .hog-portal-grid { gap: 20px; margin-top: 24px; }
.hog-portal-branded :is(.hog-portal-card,.hog-approval-detail,.hog-vault-group,.hog-account-panel,.hog-billing-record) { border-radius: 10px; border-color: var(--hog-line); box-shadow: 0 3px 14px #142e2805; }
.hog-portal-branded .hog-portal-card { padding: 24px; border-top: 2px solid var(--hog-gold); }
.hog-portal-branded .hog-portal-card h3 { margin-bottom: 12px; color: var(--hog-emerald); }
.hog-portal-branded .hog-portal-card p { color: #535e56; }
.hog-portal-branded .hog-approval-list a { font-weight: 600; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.hog-portal-branded .hog-approval-list li { padding: 13px 0; }
.hog-portal-branded :is(.hog-badge,.hog-read-indicator) { background: #edf0e8; color: #254535; border-radius: 5px; font-size: 12px; }
.hog-portal-branded :is(.hog-action-button,.hog-proof-button,.hog-back-link,.hog-card-action,.hog-request-primary-action,.hog-login-button) { min-height: 44px; padding: 12px 16px; border-radius: 6px; font-family: inherit; font-size: 14px; line-height: 1.35; font-weight: 600; text-align: center; }
.hog-portal-branded .hog-back-link { margin-bottom: 20px; background: transparent; border-color: #c0c8bb; }
.hog-portal-branded .hog-back-link:hover { background: #edf0e8; color: var(--hog-emerald); }
.hog-portal-branded .hog-request-page { max-width: 1000px; }
.hog-portal-branded .hog-request-form-card { padding: 0; border-top: 2px solid var(--hog-gold); }
.hog-portal-branded .hog-request-form-header { padding: 28px; background: #edf0e8; }
.hog-portal-branded .hog-request-form-header h2 { font-size: 34px; color: var(--hog-emerald); }
.hog-portal-branded :is(.hog-field label,.hog-account-field,.hog-signature-field > span) { font-size: 14px; font-weight: 600; }
.hog-portal-branded .hog-portal :is(input[type="text"],input[type="email"],input[type="date"],input[type="tel"],input[type="password"],select,textarea) { font-size: 16px; font-weight: 400; border-color: #a4b0a2; border-radius: 6px; line-height: 1.5; max-width: 100%; }
.hog-portal-branded .hog-portal :is(input,select,textarea) { accent-color: var(--hog-emerald); }
.hog-portal-branded :is(.hog-request-meta,.hog-request-update-card,.hog-upload-box,.hog-proof-meta,.hog-request-scope-box,.hog-ack) { border-radius: 6px; }
.hog-portal-branded .hog-portal .hog-ack { font-size: 14px; line-height: 1.6; }
.hog-portal-branded .hog-request-form .hog-ack { font-size: 14px; }
.hog-portal-branded .hog-request-form .hog-request-submit { font-size: 15px !important; }
.hog-portal-branded .hog-request-meta { font-size: 14px; }
.hog-portal-branded .hog-account-field input { min-height: 46px; }
.hog-portal-branded .hog-billing-summary strong { font-size: 25px; font-weight: 500; font-variant-numeric: tabular-nums; }
.hog-portal-branded .hog-billing-record h3 { font-size: 22px; }
.hog-portal-branded .hog-billing-card-summary { gap: 6px; }
.hog-portal-branded .hog-account-side h3 { font-size: 22px; }
.hog-portal-branded .hog-vault-document-card h4 { font-size: 21px; font-weight: 400; }
.hog-portal-branded .hog-app-footer { background: var(--hog-bone); color: #687065; border-color: var(--hog-line); font-family: inherit; font-size: 12px; }
/* Signed-out welcome screen uses the same gold-on-emerald brand treatment. */
.hog-portal-branded .hog-portal-login { max-width: 720px; min-height: 0; padding-top: 20px; padding-bottom: 20px; }
.hog-portal-branded .hog-login-card { overflow: hidden; width: 100%; padding: 0 0 28px; border: 1px solid var(--hog-line); border-radius: 12px; box-shadow: 0 16px 40px #142e280a; }
.hog-portal-branded .hog-login-card .hog-brand { margin: 0 0 28px; padding: 28px; background: var(--hog-emerald); border-bottom: 2px solid var(--hog-gold); }
.hog-portal-branded .hog-login-card .hog-brand img { width: min(100%, 280px); height: auto; border-radius: 0; }
.hog-portal-branded .hog-login-card :is(h2,.hog-login-copy,.hog-login-security-note,.hog-login-eyebrow) { margin-left: 28px; margin-right: 28px; }
.hog-portal-branded .hog-login-card h2 { font-size: 34px; }
.hog-portal-branded .hog-login-card .hog-login-security-note { font-size: 12px; color: #5e685e; }
.hog-portal-branded .hog-login-button { width: calc(100% - 56px); max-width: 320px; margin-top: 24px; }
@media (min-width: 801px) and (max-width: 1100px) { .hog-portal-branded .hog-portal-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 800px) {
    .hog-portal-branded .hog-app-topbar { padding: 14px 20px; gap: 12px; flex-wrap: wrap; }
    .hog-portal-branded .hog-app-name { width: 190px; padding-top: 72px; background-size: 190px 71.25px; }
    .hog-portal-branded .hog-app-client-name { display: none; }
    .hog-portal-branded .hog-app-actions { gap: 7px; }
    .hog-portal-branded .hog-app-actions a { padding: 10px 12px; }
    .hog-portal-branded .hog-portal { padding: 0 20px; margin: 24px auto; }
    .hog-portal-branded .hog-portal-header { padding: 24px; }
    .hog-portal-branded .hog-portal-grid { grid-template-columns: 1fr; }
    .hog-portal-branded .hog-billing-card-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 520px) {
    .hog-portal-branded.logged-in .hog-app-actions { width: 100%; justify-content: flex-start; padding-top: 8px; border-top: 1px solid #4b6254; }
    .hog-portal-branded .hog-app-name { width: 180px; padding-top: 68px; background-size: 180px 67.5px; }
    .hog-portal-branded .hog-portal { padding: 0 16px; }
    .hog-portal-branded .hog-portal-header { padding: 24px 20px; }
    .hog-portal-branded .hog-portal h2 { font-size: 30px; }
    .hog-portal-branded .hog-portal-card { padding: 22px 20px; }
    .hog-portal-branded .hog-approval-detail.hog-request-form-card { padding: 0; }
    .hog-portal-branded .hog-request-form-header, .hog-portal-branded .hog-request-form { padding: 22px 20px; }
    .hog-portal-branded .hog-approval-detail { padding: 22px 20px; }
    .hog-portal-branded .hog-request-meta > div { grid-template-columns: 1fr; gap: 2px; padding: 8px 0; }
    .hog-portal-branded .hog-billing-record-top { flex-wrap: wrap; }
    .hog-portal-branded .hog-portal-login { margin-top: 12px; padding-top: 12px; }
    .hog-portal-branded .hog-login-card :is(h2,.hog-login-copy,.hog-login-security-note,.hog-login-eyebrow) { margin-left: 22px; margin-right: 22px; }
}
@media (prefers-reduced-motion: reduce) { .hog-portal-branded * { transition: none !important; } }