/* Flat content icons: consistent rounded linework and one quiet color surface.
   Navigation arrows and third-party brand marks retain their original roles. */
:root { --detail-ink:#173c46; --detail-rose:#e9bdd5; --detail-mint:#b9e1cf; --detail-sky:#c1dfef; --detail-gold:#f0ddb2; }
.icon { stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.audience-icon { width:48px; height:48px; flex:0 0 48px; border:0; border-radius:15px; background:var(--detail-rose); color:#173c46; box-shadow:none; --icon-fill:#ffffff60; --icon-plate:#f5d9e9; }
.audience-card:nth-child(2) .audience-icon { background:var(--detail-mint); --icon-plate:#d5eee2; }
.audience-icon .icon { width:28px; height:28px; stroke-width:1.9; }
body[data-theme="dark"] .audience-icon { border:0; background:var(--detail-rose); color:#173c46; }
body[data-theme="dark"] .audience-card:nth-child(2) .audience-icon { background:var(--detail-mint); }
.resource-tile .folio-symbol { width:48px; height:48px; box-sizing:border-box; padding:8px; border:0; border-radius:14px; background:#ffffff29; stroke-width:1.9; --icon-fill:#ffffff52; --icon-plate:#e7d4e1; }
.tile-community .folio-symbol { --icon-plate:#d5e8e6; }
.tile-human .folio-symbol { color:#173c46; background:#bfe0d2; --icon-fill:#ffffff50; --icon-plate:#bfe0d2; }
.mobile-menu .menu-item-icon { box-sizing:border-box; border:0; border-radius:10px; background:#d7e9e2; color:#244953; box-shadow:none; --icon-fill:#ffffff60; }
.mobile-menu nav button:nth-child(2) .menu-item-icon { background:#f0dce7; }
.mobile-menu nav button:nth-child(3) .menu-item-icon { background:#dceaf3; }
.mobile-menu nav .menu-item-icon .icon { width:21px; height:21px; stroke-width:1.9; }
.faq-contact-copy-icon { border:0; border-radius:11px; box-shadow:none; }
.faq-contact-copy-icon svg { stroke-width:1.9; }
/* The chapter keeps a faint brand wash; its diagrams are quiet, solid surfaces. */
#employers { background:#eaf0ec; }
#employers .employer-aura { opacity:.22; }
#employers .employer-aura i { inset:-40%; animation-name:detail-aura-drift; }
@keyframes detail-aura-drift { from { transform:translate3d(-6%,-4%,0) scale(1.04); } to { transform:translate3d(6%,5%,0) scale(1.1); } }
#employers .insight-tabs { background:#ffffff70; box-shadow:none; }
#employers .insight-selection { box-shadow:none; }
#employers .insight-tab { gap:12px; }
#employers .insight-tab .icon { width:49px; height:49px; box-sizing:border-box; padding:10px; border:0; border-radius:14px; color:#668086; background:#e3e9e8; stroke-width:1.9; --icon-fill:#ffffff60; --icon-plate:#e8edf0; box-shadow:none; transition:color .35s,background .35s,transform .35s; }
#employers .insight-tab[aria-selected="true"] .icon { color:#173c46; background:color-mix(in srgb,var(--insight-accent),white 22%); box-shadow:none; transform:none; --icon-plate:var(--insight-accent); }
#employers .insight-tab:is(:hover,:focus-visible) .icon { transform:translateY(-1px); }
#employers .insight-panel { box-shadow:none; }
#employers .insight-stage { isolation:isolate; border:0; background:#f2f4f1; box-shadow:none; }
#employers .insight-stage::before { content:none; }
#employers .insight-visual { z-index:1; }
#employers .needs-orbit::before { content:none; }
#employers .needs-core { gap:8px; }
#employers .needs-core>.employer-mark { width:32px; height:32px; color:#2d6261; }
#employers .need-current { margin-top:6px; gap:5px; }
#employers .need-current .icon { width:23px; height:23px; stroke-width:1.9; --icon-fill:#ffffff60; --icon-plate:#fffdfa; }
#employers .need-label { background:transparent; border-color:transparent; box-shadow:none; }
#employers .need-label>.icon { box-sizing:border-box; flex:0 0 36px; width:36px; height:36px; padding:7px; border:0; border-radius:10px; background:var(--category-fill); color:#254953; stroke-width:1.9; --icon-fill:#ffffff60; --icon-plate:var(--category-fill); transition:background .35s,transform .35s; }
#employers .need-family { --category-fill:#eed3e2; }
#employers .need-wellbeing { --category-fill:#cee9dc; }
#employers .need-money { --category-fill:#d2e6f0; }
#employers .need-everyday { --category-fill:#f1e2c2; }
#employers .need-label:is(:hover,[aria-pressed="true"]) { background:#fffdf9; border-color:transparent; box-shadow:none; }
#employers .need-label[aria-pressed="true"]>.icon { transform:none; }
#employers .need-label:hover>.icon { transform:translateY(-1px); }
#employers .needs-visual .need-arc { filter:none!important; }
/* Simple colored illustrations remain distinct without glossy frames. */
#employers .journey-art { border:0; border-radius:18px; box-shadow:none; }
#employers .journey-art::after { content:none; }
#employers .search-art { background:#cce7df; color:#276f66; }
#employers .options-art { background:#ebdce6; }
#employers .options-art .options-heading { color:#244953; }
#employers .options-art .option-row { background:#fffdf9; border:0; border-radius:8px; box-shadow:none; animation-name:detail-option-select; }
@keyframes detail-option-select { 0%,36%,100% { background:#f4e9ef; transform:translateX(0); box-shadow:none; } 10%,26% { background:#fffdf9; transform:translateX(2px); box-shadow:none; } }
#employers .options-art .option-row>.icon { color:#4b6b70; stroke-width:1.85; --icon-fill:#eebed660; --icon-plate:#fffdf9; }
#employers .options-heading .employer-mark { color:#486966; }
#employers .options-heading>i { background:#60767466; }
#employers .return-art { background:#d4e7df; color:#367b70; }
#employers .return-drawing { width:100%; height:100%; stroke-width:2.6; }
#employers .return-drawing .return-arrow { stroke:currentColor; }
#employers .return-drawing .return-check { stroke:currentColor; stroke-width:3; stroke-dasharray:100; animation:detail-return-check 4s ease-in-out infinite; }
@keyframes detail-return-check { 0%,10% { stroke-dashoffset:100; opacity:.25; } 35%,100% { stroke-dashoffset:0; opacity:1; } }
#employers .person-art img { border-radius:18px; }
#employers .typing-bubble { align-items:center; padding:4px 9px; border:0; border-radius:12px 12px 12px 4px; box-shadow:none; background:#f0ddb2; }
#employers .typing-bubble>.icon { flex:none; width:21px; height:21px; color:#264953; stroke-width:1.9; --icon-fill:#ffffff60; }
#employers .journey-step>strong { display:flex; align-items:center; gap:7px; }
/* Anchor elements still provide measured geometry for the connector paths. */
#employers .wire-port { opacity:0; }
#employers .wire-track { stroke:#91ada3; opacity:.55; }
#employers .wire-flow { stroke:#528e7d; }
#employers .focus-visual .fragment-symbol { display:grid; place-items:center; width:40px; height:40px; border:0; border-radius:11px; background:transparent; box-shadow:none; }
#employers .focus-visual .fragment-symbol .icon { width:29px; height:29px; stroke-width:1.9; }
#employers .focus-visual .fragment-orbit,#employers .focus-visual .fragment-activity { display:none; }
#employers .focus-visual .resource-fragment { border:0; box-shadow:none; }
#employers .focus-visual .fragment-one { background:#ead5e2; color:#7d3f67; }
#employers .focus-visual .fragment-two { background:#cde6da; color:#356c59; }
#employers .focus-visual .fragment-three { background:#f0e0b9; color:#80612d; }
#employers .focus-visual .focus-junction { border:0; background:#2e625e; box-shadow:none; }
#employers .focus-visual .focus-junction .employer-mark { color:#dfefe5; }
#employers .focus-visual .opportunity-glyph { border:0; border-radius:9px; background:#f1e3eb; color:#913568; }
#employers .focus-visual .opportunity-overlap .opportunity-glyph { background:#e0ede5; color:#246b5c; }
#employers .focus-visual .opportunity-focus .opportunity-glyph { background:#f4ecda; color:#946220; }
#employers .focus-visual .opportunity-glyph svg { stroke-width:1.7; }
#employers .focus-visual .resource-ledger { border:0; box-shadow:none; }
@media (max-width:1150px) and (min-width:1001px) {
 #employers .need-label>.icon { width:30px; height:30px; flex-basis:30px; padding:5px; border-radius:9px; }
 #employers .need-current .icon { display:none; }
 #employers .needs-core { gap:6px; font-size:18px; }
 #employers .needs-core>.employer-mark { width:24px; height:24px; }
 #employers .need-current span { font-size:9px; }
}
@media (max-width:760px) {
 .resource-tile .folio-symbol { width:38px; height:38px; padding:6px; border-radius:11px; }
 #employers .journey-art,#employers .person-art img { border-radius:15px; }
 #employers .focus-visual .fragment-symbol { width:35px; height:35px; border-radius:10px; }
 #employers .focus-visual .fragment-symbol .icon { width:25px; height:25px; }
 #employers .typing-bubble>.icon { width:17px; height:17px; }
}
@media (max-width:600px) {
 #employers .insight-tab .icon { width:42px; height:42px; padding:8px; border-radius:12px; }
 #employers .insight-tab { gap:7px; }
 #employers .need-label>.icon { width:31px; height:31px; flex-basis:31px; padding:5px; border-radius:9px; }
 #employers .need-label { gap:7px; padding:9px; }
 #employers .need-current span { font-size:10px; }
 .audience-icon { width:44px; height:44px; flex-basis:44px; border-radius:13px; }
 .audience-icon .icon { width:25px; height:25px; }
}
@media (max-width:360px) {
 #employers .need-label { padding:8px 6px; gap:5px; font-size:11px; }
 #employers .need-label>.icon { width:27px; height:27px; flex-basis:27px; padding:4px; }
 #employers .focus-visual .fragment-symbol { width:30px; height:30px; }
 #employers .focus-visual .fragment-symbol .icon { width:23px; height:23px; }
}
@media (prefers-reduced-motion:reduce) {
 #employers *,#employers *::before,#employers *::after { animation:none!important; transition:none!important; }
}
