/* Claus Post mobile journey. Task-first patterns inspired by GOV.UK Design System. */
.customer-body { --wine:#205c45; --ink:#183d32; --muted:#51645a; --line:#dce4dc; --paper:#fff; --canvas:#faf9f5; --green:#205c45; background:#faf9f5; color:#183d32; font-size:16px; line-height:1.5; }
.customer-body .customer-header { height:80px; margin:0; padding:0 max(20px,calc((100% - 720px)/2)); background:#fff; border-bottom:1px solid #e8e7df; gap:16px; }
.customer-body .customer-brand { display:flex; gap:10px; align-items:center; text-decoration:none; letter-spacing:0; flex-shrink:0; }
.customer-brand img { width:48px; height:48px; object-fit:contain; }
.customer-body .customer-wordmark { font:700 21px/1.2 var(--sans); color:#174735; margin:0; letter-spacing:-.5px; }
.customer-wordmark small { display:block; font:400 11px/1.4 var(--sans); color:#617169; letter-spacing:0; margin-top:4px; }
.customer-body .customer-main { max-width:680px; padding:28px 20px 20px; min-height:0; }
.customer-body h1,.customer-body .portal-intro h1,.customer-body .portal-intro.compact h1 { font:700 30px/1.18 var(--sans); letter-spacing:-.7px; margin:0 0 12px; }
.customer-body h2,.customer-body .customer-card>h2 { font:650 21px/1.3 var(--sans); margin:0 0 14px; }
.customer-body h3 { font-size:16px; margin:0 0 6px; }
.customer-body .portal-intro { text-align:left; margin:0 0 20px; }
.customer-body .portal-intro>p:not(.eyebrow) { font-size:12px; line-height:1.5; margin:0; overflow-wrap:anywhere; color:#617169; }
.customer-body .customer-card { padding:24px; border:1px solid #e3e7df; border-radius:16px; background:#fff; margin:0 0 20px; }
.customer-body .customer-card>p { font-size:15px; line-height:1.5; margin:0 0 18px; color:#51645a; }
.customer-body .entry-card { text-align:left; max-width:none; }
.entry-card .eyebrow { font-size:10px; letter-spacing:1.5px; color:#8d503d; }
.entry-steps { list-style:none; margin:24px 0; padding:0; display:grid; gap:20px; }
.entry-steps li { display:flex; gap:12px; align-items:flex-start; }
.entry-steps li>span { background:#edf3ed; border-radius:50%; width:30px; height:30px; display:grid; place-items:center; flex-shrink:0; color:#265e49; font-size:13px; font-weight:650; }
.entry-steps strong { font-size:16px; display:block; }
.entry-steps small { display:block; font-size:14px; line-height:1.45; color:#617169; margin-top:3px; }
.customer-body .button { min-height:48px; padding:13px 18px; font-size:16px; line-height:1.3; border-radius:10px; text-align:center; white-space:normal; }
.customer-body .button.primary { background:#205c45; border-color:#205c45; }
.customer-body .entry-card .button,.customer-body .wizard-actions .button,.review-submit>.button { width:100%; }
.customer-body .entry-card>small { margin-top:12px; font-size:12px; }
.customer-body .customer-footer { max-width:640px; margin:16px auto 0; padding:16px 20px calc(20px + env(safe-area-inset-bottom)); border-color:#e8e7df; }
.customer-body .customer-footer small { font-size:11px; line-height:1.5; color:#66766d; }
.customer-body .customer-progress { margin:0 0 20px; padding:0; justify-content:space-between; gap:8px; }
.customer-body .customer-progress li { font-size:11px; gap:5px; }
.customer-body .customer-progress li span { width:24px; height:24px; font-size:11px; flex-shrink:0; }
.customer-body .order-summary-grid { gap:18px; margin:16px 0; }
.customer-body .order-summary-grid p { margin:0; font-size:15px; line-height:1.45; }
.customer-body .order-summary-grid ul { margin:0; padding-left:18px; font-size:15px; }
.customer-body .stack { gap:14px; }
.customer-body .stack label,.customer-body .checkbox-field { font-size:14px; line-height:1.5; }
.customer-body .quiet-details { margin-top:18px; padding-top:14px; }
.customer-body .quiet-details summary,.saved-order-details>summary { font-size:14px; min-height:44px; cursor:pointer; }
.customer-body .quiet-details p { font-size:14px; line-height:1.5; }
.customer-body .correction-actions { display:grid; gap:10px; }
.customer-body .correction-actions .button { text-align:left; font-size:14px; }
.saved-order-details { margin-bottom:16px; }
.saved-order-details .customer-card { margin-top:8px; }
.question-navigation { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; font-size:13px; color:#617169; }
.customer-body .question-navigation .back-link { margin:0; min-height:40px; display:flex; align-items:center; font-size:14px; }
.question-progress { display:block; width:100%; height:4px; border:0; border-radius:8px; background:#e4e9e2; appearance:none; margin:0 0 24px; }
.question-progress::-webkit-progress-bar { background:#e4e9e2; border-radius:8px; }
.question-progress::-webkit-progress-value { background:#307452; border-radius:8px; }
.question-progress::-moz-progress-bar { background:#307452; border-radius:8px; }
.customer-body .wizard-card { margin:0; max-width:none; }
.customer-body .wizard-card h1 { font-size:26px; line-height:1.25; }
.customer-body .wizard-card h1 label { font:inherit; }
.customer-body .question-package { font-size:12px; margin-bottom:18px; color:#617169; }
.customer-body .personalisation-form .optional { font-size:12px; background:#eef2ed; padding:3px 9px; border-radius:20px; width:fit-content; margin:0; }
.customer-body .personalisation-form .field-help { font-size:14px; line-height:1.5; margin:4px 0 8px; color:#617169; }
.customer-body input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.customer-body select,.customer-body textarea { font-size:16px; border-radius:9px; border:1px solid #a7b6a9; padding:12px; width:100%; max-width:100%; box-sizing:border-box; }
.customer-body textarea { min-height:110px; }
.customer-body .wizard-actions { margin-top:8px; display:grid; gap:4px; }
.skip-question { min-height:44px; background:transparent; border:0; color:#365a47; font:500 14px var(--sans); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.save-explainer { color:#617169; font-size:12px; margin-top:4px; }
.save-explainer summary { cursor:pointer; padding:8px 0; }
.save-explainer p { margin:8px 0; }
.customer-body .answer-review>div { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 16px; padding:14px 0; }
.customer-body .answer-review dt { font-size:13px; color:#617169; grid-column:1; font-weight:500; }
.customer-body .answer-review dd { margin:0; font-size:15px; line-height:1.5; }
.answer-value { grid-column:1; }
.answer-edit { grid-column:2; grid-row:1 / span 2; align-self:start; }
.customer-body .answer-review a { display:block; margin:0; padding:8px 0 8px 6px; font-size:13px; text-decoration:underline; }
.skipped-answers { margin:14px 0 20px; font-size:14px; }
.skipped-answers summary { min-height:44px; padding-top:10px; cursor:pointer; }
.customer-body .privacy-note { font-size:12px; line-height:1.5; padding:12px; margin-top:12px; }
.customer-body .review-submit .muted { font-size:13px; line-height:1.5; }
.customer-body :focus-visible { outline:3px solid #b27b35; outline-offset:3px; }
@media(max-width:600px) {
 .customer-body .customer-header { height:74px; padding:0 20px; }
 .customer-body .customer-header>.small-cap { display:none; }
 .customer-body .customer-main { padding:20px 16px 16px; }
 .customer-body .customer-card { padding:20px; border-radius:14px; }
 .customer-body .order-summary-grid { grid-template-columns:1fr; }
 .customer-body .customer-footer { margin-top:12px; }
 .customer-body .entry-card h1 { font-size:29px; }
}

/* Compact, touch-friendly customer choices. */
.question-field {border:0; padding:0; margin:0; min-width:0;}
.question-field legend {padding:0; width:100%;}
.question-field div:has(> label > input[type=radio]) {margin:8px 0;}
.question-field label:has(input[type=radio]) {display:flex; align-items:center; gap:12px; min-height:52px; padding:12px 16px; border:1px solid #a6b8ae; border-radius:10px; cursor:pointer;}
.question-field label:has(input[type=radio]:checked) {background:#edf5ef; border-color:#216449;}
.question-field input[type=radio] {width:22px; height:22px; flex-shrink:0;}
.extra-topics {display:grid; gap:10px; margin:24px 0;}
.extra-topics a {display:flex; flex-direction:column; padding:14px; border:1px solid #cbd8d0; border-radius:10px; text-decoration:none;}
.extra-topics a span {font-size:14px; margin-top:4px;}

/* Customer identity is independent of the station workspace. */
.customer-body .button.secondary{background:#fff;border-color:#a7b6a9;color:#205c45}
.customer-body .support-page .panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;margin-block:20px}
.customer-body .support-page .panel p+p{margin-top:12px}
.customer-body .support-page summary{min-height:44px;cursor:pointer}
.customer-body .support-page a:not(.button){text-decoration:underline;text-underline-offset:3px}
.customer-body .support-page form p{margin-bottom:16px}
.customer-body .support-page label{display:block;margin-bottom:6px}
.customer-body .customer-card .section-top h2{font-family:var(--sans);font-weight:650;color:var(--ink)}
.customer-body input[type=checkbox],.customer-body input[type=radio]{accent-color:#205c45}
.customer-body .customer-progress .done span{background:#205c45;border-color:#205c45;color:#fff}
.customer-body .login-card{max-width:480px;margin-inline:auto}
.customer-body .login-card form+form{margin-top:20px}
/* One private link for the letter, factual progress and help. */
.letter-room-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;border-block:1px solid var(--line);padding:6px 0;margin:0 0 24px}
.letter-room-nav a{display:inline-flex;align-items:center;min-height:48px;padding:8px 16px;color:#205c45;font-weight:650;text-underline-offset:4px}
.letter-room-nav a:hover{background:#edf3ed}
.room-anchor,.room-progress,.room-faqs{scroll-margin-top:20px}
.room-progress .section-top{align-items:baseline;gap:16px;flex-wrap:wrap}.room-progress .section-top a{min-height:44px;display:inline-flex;align-items:center;text-underline-offset:3px}
.customer-body .room-progress .journey-current{font-size:17px;color:#183d32;line-height:1.6;margin-block:12px 16px}
.journey-details>summary,.journey-history>summary,.room-faqs summary{cursor:pointer;min-height:48px;padding:14px 0;font-weight:650;color:#205c45}
.journey-stages{list-style:none;padding:0;margin:8px 0 18px}.journey-stages li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}.journey-stages span{color:#51645a;font-size:14px}.journey-stages .recorded strong{color:#205c45}
.room-faqs details{border-bottom:1px solid var(--line)}.room-faqs details p{max-width:68ch;line-height:1.7;margin:0 0 18px;color:#51645a}.room-help{margin-top:24px}.room-help p{margin:10px 0 16px}.room-help h3{font-family:var(--sans);font-size:19px}
@media(max-width:600px){.letter-room-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.letter-room-nav a{padding:8px 10px}.journey-stages li{display:block}.journey-stages span{display:block;margin-top:4px}}

.question-help{border-top:1px solid var(--line);padding-top:12px;margin-top:8px}.question-help summary{min-height:44px;cursor:pointer;font-size:14px}.question-help p{font-size:14px;margin:0 0 16px;color:var(--muted)}

.customer-body .privacy-note{background:#edf3ed;color:#365447;border-color:#dce4dc}

.family-letter-list{list-style:none;padding:0;margin:20px 0 0}.family-letter-list li{padding:12px 0;border-bottom:1px solid var(--line)}.family-letter-list a{display:inline-flex;align-items:center;min-height:48px;text-underline-offset:3px}.family-letter-list span{display:block;color:#51645a;font-size:14px}

.customer-body .customer-card>.button+p{margin-top:16px}
.customer-body .letter-package{font-size:14px;line-height:1.5;color:#51645a;margin:8px 0 0}