/* Customer design system. Existing workflow and staff styles remain in app.css/flows.css. */
:root{
  --navy:#182b44;
  --teal:#1959ba;
  --teal-dark:#12499e;
  --cream:#f5f7fa;
  --paper:#fff;
  --line:#d7e0e9;
  --muted:#4c6076;
  --danger:#b42318;
  --shadow:none;
}

.customer-surface{font-size:18px;line-height:1.65;background:var(--cream)}
.customer-surface p{word-break:keep-all;overflow-wrap:break-word}
.customer-surface [hidden]{display:none!important}
.customer-surface .shell{max-width:680px;padding-left:20px;padding-right:20px}
.customer-surface .site-header{background:#fff;border-bottom:1px solid var(--line)}
.customer-surface .header-inner{min-height:94px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:20px;padding-top:16px;padding-bottom:16px}
.customer-surface .brand{display:flex;align-items:center;gap:12px;color:var(--navy);font-size:23px;font-weight:800;line-height:1.15;white-space:nowrap;letter-spacing:-.045em}
.customer-surface .brand-logo{width:44px;height:44px}
.customer-surface .brand small{font-size:16px;font-weight:600;color:#52657d;letter-spacing:-.02em;margin-top:4px;white-space:nowrap}
.customer-surface .site-header nav{display:flex;flex-wrap:nowrap;align-items:center;width:auto;gap:20px;font-size:16px;font-weight:750}
.customer-surface .site-header nav a{white-space:nowrap;color:var(--navy)}
.customer-surface .site-header nav a:hover{color:var(--teal-dark)}
.customer-surface .test-banner{background:#eaf2ff;color:#23476f;border-bottom:1px solid #d1e0f6;padding:10px 0;font-size:16px;line-height:1.5}
.customer-surface .footer{font-size:16px;line-height:1.5;border-top:1px solid var(--line);padding-top:26px;padding-bottom:35px;color:#52657d}
.customer-surface .footer-inner{display:block}
.customer-surface .footer-inner nav{gap:12px 22px;margin-top:14px}
.customer-surface .footer-inner strong{color:var(--navy)}
.customer-surface .footer p{margin-top:20px}
.customer-surface .text-button{font-size:16px;color:var(--teal-dark);font-weight:700}
.customer-surface .main{padding-top:32px}
.customer-surface .public-main{min-height:62vh;background:#fff}
.customer-surface :is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #2d6ed3;outline-offset:3px}

/* Public reading flow: one column and one visible main action. */
.consumer-flow{max-width:640px;margin:0 auto;padding-top:58px;padding-bottom:90px}
.consumer-home{padding-top:74px}
.consumer-hero{padding-bottom:54px;border-bottom:1px solid var(--line)}
.consumer-hero h1,.consumer-page-head h1{font-size:clamp(32px,4vw,44px);line-height:1.26;letter-spacing:-.055em;word-break:keep-all;margin:0 0 24px;color:var(--navy);font-weight:800}
.consumer-hero p,.consumer-page-head p{font-size:19px;line-height:1.72;color:#33465e;margin:0 0 30px}
.consumer-hero p{max-width:570px}
.consumer-page-head{padding:4px 0 32px;border-bottom:1px solid var(--line)}
.consumer-page-head p{margin-bottom:0}
.consumer-primary,.consumer-secondary{display:flex;align-items:center;justify-content:center;min-height:60px;width:100%;padding:13px 22px;border-radius:7px;font-size:20px;font-weight:800;line-height:1.35;text-align:center;text-decoration:none;transition:background-color .16s ease,border-color .16s ease}
.consumer-primary{background:var(--teal);border:2px solid var(--teal);color:#fff}
.consumer-primary:hover{background:var(--teal-dark);border-color:var(--teal-dark);color:#fff;text-decoration:none}
.consumer-secondary{background:#fff;border:2px solid var(--teal);color:var(--teal-dark)}
.consumer-secondary:hover{background:#eff5ff;text-decoration:none}
.consumer-primary:disabled{opacity:.65;cursor:wait}
.consumer-hero .consumer-primary{max-width:310px}
.consumer-care-photo{margin:36px 0 0}
.consumer-care-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;border-radius:10px;background:#eef1f4}
.consumer-care-photo figcaption{margin-top:10px;font-size:16px;line-height:1.5;color:#52657d}
.consumer-section{padding:47px 0;border-bottom:1px solid var(--line)}
.consumer-section h2,.consumer-social h2{font-size:26px;line-height:1.32;letter-spacing:-.035em;word-break:keep-all;margin:0 0 18px;font-weight:800}
.consumer-section p{font-size:19px;line-height:1.73;color:#33465e;margin:0 0 18px}
.consumer-section p:last-child{margin-bottom:0}
.consumer-steps{list-style:none;padding:0;margin:0}
.consumer-steps li{display:grid;grid-template-columns:42px minmax(0,1fr);gap:17px;padding:21px 0;border-top:1px solid var(--line)}
.consumer-steps li:first-child{border-top:0}
.consumer-steps li>span{font-size:24px;line-height:1.25;font-weight:800;color:var(--teal);font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.consumer-steps h2,.consumer-steps h3{font-size:22px;line-height:1.38;letter-spacing:-.025em;word-break:keep-all;margin:0 0 6px;font-weight:750}
.consumer-steps p{font-size:18px;line-height:1.65;color:#43566d;margin:0}
.consumer-guide-steps{margin-top:18px}
.consumer-related{display:flex;flex-wrap:wrap;gap:14px 24px;padding:26px 0 0;font-size:18px;font-weight:750}
.consumer-related a,.consumer-inline-link a,.consumer-text-link,.consumer-back a{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.consumer-next-paths{margin-top:58px;padding-top:34px;border-top:1px solid var(--line)}
.consumer-next-paths h2{font-size:24px;line-height:1.4;letter-spacing:-.03em;word-break:keep-all;margin:0 0 13px;color:var(--navy)}
.consumer-next-path{padding:23px 0;border-bottom:1px solid var(--line)}
.consumer-next-path:last-child{border-bottom:0}
.consumer-next-path h3{font-size:21px;line-height:1.45;letter-spacing:-.025em;word-break:keep-all;margin:0 0 8px;color:var(--navy)}
.consumer-next-path p{font-size:18px;line-height:1.65;color:#43566d;margin:0 0 11px}
.consumer-next-path a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:18px;font-weight:750;line-height:1.45;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.consumer-next-path .consumer-external-note{font-size:16px;font-weight:600;color:#52657d;text-decoration:none;margin-left:4px}
.consumer-back{font-size:18px;font-weight:700;margin-bottom:30px}
.consumer-boundary{margin:27px 0 0;padding:18px 0 0;border-top:1px solid var(--line);font-size:16px;line-height:1.65;color:#52657d}
.consumer-inline-link{font-size:18px;margin:20px 0 0}
.consumer-faq details{border-bottom:1px solid var(--line)}
.consumer-faq summary{list-style:none;cursor:pointer;font-size:20px;font-weight:750;line-height:1.5;padding:23px 34px 23px 0;position:relative;word-break:keep-all}
.consumer-faq summary::-webkit-details-marker{display:none}
.consumer-faq summary:after{content:'+';position:absolute;right:0;top:20px;color:var(--teal);font-size:26px;line-height:1}
.consumer-faq details[open] summary:after{content:'−'}
.consumer-faq p{font-size:18px;line-height:1.7;color:#33465e;margin:0 0 25px}

/* Forms use one quiet white surface, clear field borders and local errors. */
.auth-flow{padding-top:14px}
.auth-flow .consumer-page-head{border-bottom:0;padding-bottom:10px}
.consumer-form{background:#fff;border:1px solid var(--line);border-radius:9px;padding:30px 30px 32px;margin-top:20px}
.consumer-form .field{margin-bottom:24px}
.consumer-form .field>label{display:block;font-size:18px;font-weight:750;line-height:1.45;margin-bottom:9px;color:var(--navy)}
.consumer-form .field input:not([type=checkbox]){width:100%;min-height:60px;padding:13px 15px;border:1.5px solid #9eafc2;border-radius:6px;background:#fff;color:var(--navy);font-size:20px}
.consumer-form .field input:not([type=checkbox]):hover{border-color:#6886a9}
.consumer-form .field input[aria-invalid=true]{border-color:var(--danger)}
.consumer-form .field input:user-invalid{border-color:var(--danger)}
.consumer-form .field small{display:block;font-size:16px;line-height:1.5;margin-top:8px;color:#52657d}
.consumer-form .checkbox{font-size:18px!important;align-items:flex-start;line-height:1.5}
.consumer-form .checkbox input{width:24px;height:24px;margin-top:2px;accent-color:var(--teal)}
.consumer-form .error,.consumer-form .form-error{font-size:16px;line-height:1.5}
.consumer-form .error{margin:7px 0 0}
.consumer-form .form-error{border-left:4px solid var(--danger);border-radius:3px;padding:12px 14px}
.consumer-social{margin-top:40px;padding-top:30px;border-top:1px solid var(--line)}
.consumer-social .social-stack{display:grid;gap:12px}
.consumer-social .social-option{display:flex;align-items:center;justify-content:center;width:100%;min-height:60px;padding:13px 18px;border:1.5px solid #8299b6;border-radius:7px;background:#fff;color:var(--navy);font-size:20px;font-weight:750;text-align:center}
.consumer-social .social-option.enabled:hover{border-color:var(--teal);background:#f2f6fd}
.consumer-social .social-unavailable{font-size:16px;color:#52657d;margin:2px 0}
.consumer-state{background:#fff;border:1px solid var(--line);border-radius:9px;padding:30px;margin-top:22px}
.consumer-state h2{font-size:24px;line-height:1.4;word-break:keep-all;margin:0 0 12px}
.consumer-state p{font-size:18px;line-height:1.7;color:#33465e;margin:0 0 23px}
.consumer-state .consumer-secondary,.consumer-state .consumer-text-link{margin-top:15px}
.consumer-state .consumer-text-link{display:inline-block;font-size:18px}
.consumer-disclosure{margin-top:25px;padding-top:18px;border-top:1px solid var(--line)}
.consumer-disclosure summary{cursor:pointer;font-size:16px;font-weight:700;color:var(--teal-dark)}
.consumer-disclosure p{font-size:16px;line-height:1.65;color:#52657d;margin:12px 0 0}

/* The authenticated customer workflow keeps its existing functionality. */
.customer-surface .auth-wrap,.customer-surface .create-layout,.customer-surface .detail-grid{display:block;max-width:640px;margin-left:auto;margin-right:auto}
.customer-surface .create-layout>.panel,.customer-surface .detail-grid>.panel{margin-bottom:18px}
.customer-surface .create-layout .guidance-panel{display:none}
.customer-surface .page-head{display:block}
.customer-surface .page-head h1{font-size:34px}
.customer-surface .eyebrow{display:none}
.customer-surface .page-head .button{margin-top:18px}
.customer-surface .button,.customer-surface .button-secondary{min-height:60px;font-size:20px;white-space:normal;text-align:center;border-radius:7px}
.customer-surface .panel,.customer-surface .case-card,.customer-surface .empty{box-shadow:none;border-radius:9px}
.customer-surface .panel h2{font-size:24px}
.customer-surface .field>label{font-size:18px}
.customer-surface .field small,.customer-surface .help,.customer-surface .muted{font-size:16px}
.customer-surface .error,.customer-surface .form-error,.customer-surface .required,.customer-surface .optional,.customer-surface .facts dt,.customer-surface .pagination,.customer-surface .filter .reset-link,.customer-surface .public-checklist small{font-size:16px}
.customer-surface .checkbox{font-size:18px!important}
.customer-surface .field input:not([type=checkbox]),.customer-surface .field select,.customer-surface .field textarea{min-height:60px;font-size:18px;border-color:#9eafc2}
.customer-surface .preview-note,.customer-surface .notice{font-size:16px}
.customer-surface .case-card-main strong{font-size:18px}
.customer-surface .case-card-main small,.customer-surface .case-card-meta{font-size:16px}
.customer-surface .case-card-side .pill,.customer-surface .document-list a,.customer-surface .document-list small{font-size:16px}
.customer-surface .count,.customer-surface .facts dt,.customer-surface .soft-empty p{font-size:16px}
.customer-surface .soft-empty strong,.customer-surface .public-checklist strong{font-size:18px}
.customer-surface .document-list li,.customer-surface .public-checklist li{align-items:flex-start}
.customer-surface .next-action h2{font-size:23px}
.customer-surface .next-action p:last-child{font-size:18px}
.customer-surface .step-header h3{font-size:21px}
.customer-surface .step-header p{font-size:18px}
.customer-surface .status-card span{font-size:16px}
.customer-surface .status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.customer-surface .status-card{min-height:88px}
.customer-surface .case-card{display:block}
.customer-surface .case-card-side{align-items:flex-start;margin-top:8px}
.customer-surface .filter{display:block}
.customer-surface .filter .field{margin-bottom:14px}
.customer-surface .filter .status-field{width:auto}
.customer-surface .filter .button-secondary{width:100%}
.customer-surface .two-fields{display:block}

@media(max-width:680px){
  .customer-surface .header-inner{display:block;min-height:0;padding-top:16px;padding-bottom:13px}
  .customer-surface .site-header nav{margin-top:15px;padding-top:11px;border-top:1px solid var(--line);gap:22px}
  .consumer-flow{padding-top:40px;padding-bottom:65px}
  .consumer-home{padding-top:52px}
}
@media(max-width:390px){
  .customer-surface .shell{padding-left:16px;padding-right:16px}
  .customer-surface .brand{font-size:21px;gap:10px}
  .customer-surface .brand-logo{width:36px;height:36px}
  .customer-surface .brand small{font-size:16px}
  .customer-surface .site-header nav{font-size:16px;gap:20px}
  .consumer-flow{padding-top:33px}
  .consumer-home{padding-top:45px}
  .consumer-hero h1,.consumer-page-head h1{font-size:32px}
  .consumer-form,.consumer-state{padding:23px 20px}
  .consumer-hero .consumer-primary{max-width:none}
}
@media(prefers-reduced-motion:reduce){.consumer-primary,.consumer-secondary{transition:none}}