/* Role pages use the same restrained coastal identity as the staffing homepage. */
.hero-local-links { display: flex; flex-wrap: wrap; gap: .4rem 1.75rem; }
.advocacy-preview, .staff-spaces, .app-preview { border-top: 1px solid var(--line); }
.staff-space-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.staff-space-grid > a { display: flex; flex-direction: column; padding: 1.5rem; border: 1px solid var(--line); border-radius: 8px; background: #fffdf8; transition: background-color .15s; }
.staff-space-grid > a:hover { background: var(--soft); }
.staff-space-grid > a > span { color: var(--coral); font-size: .7rem; font-weight: 700; }
.staff-space-grid strong { color: var(--ink); font-size: 1.1rem; line-height: 1.45; margin-top: .6rem; }
.staff-space-grid p { color: var(--muted); font-size: .875rem; margin: .6rem 0 0; }
.staff-space-grid .office-space { background: var(--soft); }
.app-preview { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); align-items: center; gap: 3rem; }
.app-preview > div > p:not(.eyebrow):not(.small-print) { color: var(--muted); max-width: 40rem; }
.app-preview-panel { padding: 2rem; background: var(--soft); border-radius: 10px; border: 1px solid var(--line); }
.app-preview-panel h3 { margin-top: 1rem; font-family: "Source Serif 4",Georgia,serif; font-size: 2rem; }
.staff-switcher { width: calc(100% - 2.5rem); max-width: 1240px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: .5rem; padding: 1.25rem 0; border-bottom: 1px solid var(--line); }
.staff-switcher a { padding: .65rem .9rem; min-height: 44px; border: 1px solid var(--line); border-radius: 6px; font-size: .8rem; color: var(--muted); }
.staff-switcher a[aria-current=page] { color: #fffdf7; background: var(--teal); border-color: var(--teal); }
.staff-hero { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,.7fr); gap: 3rem; align-items: start; }
.staff-hero h1 { font-size: clamp(2.4rem,4.8vw,4.1rem); line-height: 1.12; max-width: 22ch; margin: 1.2rem 0; }
.staff-hero .hero-lede { max-width: 41rem; color: var(--muted); font-size: 1.05rem; }
.staff-hero .hero-actions { margin: 1.5rem 0 .8rem; }
.staff-local { color: var(--teal); font-size: .85rem; font-weight: 600; }
.staff-glance { padding: 1.75rem; background: var(--soft); border: 1px solid var(--line); border-radius: 10px; }
.staff-glance h2 { font-size: 1.25rem; }
.staff-floor { font-size: 2.6rem; font-weight: 700; color: var(--teal-dark); line-height: 1.2; margin: 1rem 0; }
.staff-glance ul { padding-left: 1.25rem; color: var(--muted); font-size: .875rem; line-height: 1.7; }
.staff-glance p { color: var(--muted); font-size: .875rem; }
.staff-value-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; }
.staff-value-grid article { border-top: 2px solid var(--line); padding-top: 1.2rem; }
.staff-value-grid h3 { font-size: 1.15rem; margin-top: .7rem; }
.staff-value-grid p { color: var(--muted); font-size: .925rem; }
.staff-two-column { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 3rem; border-top: 1px solid var(--line); }
.staff-two-column h2 { font-size: clamp(1.7rem,3vw,2.35rem); }
.staff-two-column p, .staff-two-column li { color: var(--muted); font-size: .925rem; line-height: 1.7; }
.staff-two-column ol { padding-left: 1.25rem; }
.staff-two-column li { margin-bottom: .8rem; padding-left: .25rem; }
.staff-resource-links { display: grid; gap: .65rem; }
.staff-resource-links a { padding: 1rem; background: #fffdf8; border: 1px solid var(--line); border-radius: 6px; min-height: 48px; font-weight: 600; font-size: .9rem; }
.staff-resource-links a:hover { background: var(--soft); }
.staff-join { text-align: center; max-width: 42rem; margin-inline: auto; }
.staff-join .hero-actions { justify-content: center; margin-top: 1.5rem; }
.install-mark { width: 76px; height: 76px; object-fit: contain; }
.install-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.5rem 0; }
.install-platforms { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.install-platforms article { background: #fffdf8; border: 1px solid var(--line); border-radius: 8px; padding: 1.5rem; }
.install-platforms h3 { font-size: 1.1rem; }
.install-platforms ol { padding-left: 1.25rem; }
.install-platforms li { color: var(--muted); font-size: .9rem; line-height: 1.7; margin-bottom: .75rem; }
.install-platforms article:target { outline: 2px solid var(--teal); outline-offset: 4px; }
.install-status { color: var(--teal); font-size: .9rem; line-height: 1.6; }
.install-platform-nav { display: flex; flex-wrap: wrap; gap: .75rem; }
.install-platform-nav a { min-height: 44px; display: inline-flex; align-items: center; padding: .55rem .8rem; background: var(--soft); border-radius: 6px; font-size: .85rem; font-weight: 600; }
@media (max-width: 900px) { .staff-space-grid, .staff-value-grid, .install-platforms { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 760px) { .staff-hero, .staff-two-column, .app-preview { grid-template-columns: minmax(0,1fr); gap: 1.75rem; } .staff-glance { padding: 1.5rem; } }
@media (max-width: 520px) { .staff-space-grid, .staff-value-grid, .install-platforms { grid-template-columns: minmax(0,1fr); } .staff-switcher { width: calc(100% - 2rem); } .staff-switcher a { padding: .65rem .75rem; } .staff-hero .hero-actions, .install-actions { flex-direction: column; } .staff-hero .hero-actions .button, .install-actions .button { width: 100%; } }
/* Practical local support, with quiet typography and roomy controls. */
.support-hero { max-width: 1240px; padding-block: 3.5rem; }
.support-hero h1 { font-size: clamp(2.35rem,5vw,4.2rem); line-height: 1.14; margin: 1rem 0 1.5rem; }
.support-hero .hero-lede { max-width: 44rem; color: var(--muted); font-size: 1.05rem; }
.support-hero .hero-actions { margin: 1.5rem 0; }
.support-hero .small-print { max-width: 45rem; }
.support-jumps { max-width: 1240px; width: calc(100% - 2.5rem); margin: auto; display: flex; flex-wrap: wrap; gap: .75rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--line); }
.support-jumps a { min-height: 44px; padding: .65rem 1rem; border: 1px solid var(--line); border-radius: 6px; font-size: .875rem; }
.support-checklist { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 3rem; }
.support-checklist p { color: var(--muted); }
.support-checks { display: grid; gap: .75rem; }
.support-checks label { display: flex; align-items: flex-start; gap: .85rem; border: 1px solid var(--line); background: #fffdf8; padding: 1.25rem; border-radius: 8px; cursor: pointer; }
.support-checks input { flex-shrink: 0; width: 20px; height: 20px; margin-top: .15rem; accent-color: var(--teal); }
.support-checks strong { display: block; font-size: 1rem; }
.support-checks small { display: block; margin-top: .4rem; color: var(--muted); font-size: .875rem; line-height: 1.6; }
.support-checks label:has(input:checked) { border-color: var(--teal); background: #edf4eb; }
.checklist-progress { font-weight: 600; margin-block: 1.5rem; }
.support-links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.support-links > a { padding: 1.75rem; border: 1px solid var(--line); border-radius: 8px; background: #fffdf8; }
.support-links h3 { font-size: 1.2rem; margin-top: .7rem; }
.support-links p { color: var(--muted); font-size: .925rem; }
.support-links strong { font-size: .875rem; color: var(--teal-dark); }
.home-support { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 3rem; align-items: center; border-top: 1px solid var(--line); }
.home-support p { color: var(--muted); }
.home-support ul { padding-left: 1.2rem; line-height: 1.8; color: var(--muted); }
.home-support-panel { padding: 1.75rem; border: 1px solid var(--line); border-radius: 8px; background: var(--soft); }
.home-support-panel h3 { font-size: 1.25rem; }
.local-home .staff-spaces .staff-space-grid { display: flex; flex-wrap: wrap; gap: .65rem; }
.local-home .staff-spaces .staff-space-grid > a { padding: .85rem 1.15rem; flex: 1 1 160px; min-height: 84px; }
.local-home .staff-spaces .staff-space-grid p { display: none; }
.local-home .staff-spaces .staff-space-grid strong { font-size: .9rem; margin-top: .3rem; }
.local-home .staff-spaces .local-section-heading { margin-bottom: 1.1rem; }
.local-home .staff-spaces { padding-block: 2rem; }
.staff-prep-link { display: block; margin-block: 1rem; min-height: 44px; padding: .75rem 1rem; background: var(--soft); border: 1px solid var(--line); border-radius: 6px; font-size: .9rem; font-weight: 600; }
.home-pay-notes { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.3rem; }
.home-pay-notes span { padding: .6rem .85rem; background: var(--soft); border-radius: 6px; font-size: .85rem; font-weight: 600; }
.local-region-line { padding-top: .75rem; color: var(--teal-dark); font-size: .8rem; }
@media (max-width: 760px) { .support-checklist, .home-support { grid-template-columns: minmax(0,1fr); gap: 1.5rem; } }
@media (max-width: 520px) { .support-links { grid-template-columns: minmax(0,1fr); } .support-jumps { width: calc(100% - 2rem); } .support-hero .hero-actions { flex-direction: column; } .support-checks label { padding: 1rem; } }
@media print { .support-page .site-header, .support-page .site-footer, .support-page .support-jumps, .support-page main > section:not(#before-shift), .support-page #printChecklist, .support-page .skip-link { display: none; } .support-page { background: white; } .support-page #before-shift { width: 100%; display: block; padding: 0; } .support-page .support-checks label { break-inside: avoid; } .support-page .checklist-progress { display: none; } }
