/* ===========================================================
   AIOS Workforce V2 — Premium Redesign Design System
   Deep navy / royal blue / gold accents / white content surfaces.
   One stylesheet, one source of truth. No !important patch layers.
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700;9..144,800&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  /* Premium palette */
  --navy-deep:    #071226;
  --navy:         #0B1D3A;
  --navy-soft:    #12294F;
  --royal:        #1E4FD6;
  --royal-dark:   #1638A0;
  --royal-bright: #3D6BFF;
  --gold:         #D4AF37;
  --gold-soft:    #F1D98B;
  --gold-bg:      #FBF3DC;
  --white:        #FFFFFF;
  --surface:      #F5F7FB;
  --surface-line: #E1E6F0;
  --ink:          #0B1D3A;
  --ink-soft:     #3C4A63;
  --text-muted:   #5B6577;
  --brick:        #B23A2F;
  --brick-bg:     #FBEAE8;
  --success:      #1E7A5F;
  --success-bg:   #E6F3EE;
  --radius:       10px;
  --radius-lg:    18px;
  --shadow-sm:    0 1px 3px rgba(7,18,38,.08), 0 1px 2px rgba(7,18,38,.06);
  --shadow-md:    0 8px 24px rgba(7,18,38,.10);
  --shadow-lg:    0 20px 50px rgba(7,18,38,.16);
  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'IBM Plex Sans', -apple-system, Segoe UI, sans-serif;
  --font-mono:    'IBM Plex Mono', 'Courier New', monospace;
  --header-h:     76px;

  /* Legacy token aliases — kept so any un-migrated inline styles referencing
     the old variable names still resolve to the new palette instead of failing silent. */
  --paper: var(--surface);
  --paper-raised: var(--white);
  --line: var(--surface-line);
  --teal: var(--royal);
  --teal-dark: var(--royal-dark);
  --teal-bg: #EAF0FF;
  --text: var(--ink);
  --on-ink: #F5F7FB;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--surface);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.15;
  margin:0 0 .5em;
  color:var(--ink);
}
h1{font-size:clamp(2rem,4vw,2.9rem); font-weight:800; letter-spacing:-.01em;}
h2{font-size:clamp(1.4rem,2.4vw,1.9rem);}
h3{font-size:1.2rem;}
p{margin:0 0 1em; color:var(--text-muted);}
a{color:var(--royal); text-decoration:none;}
a:hover{text-decoration:underline;}
ul{padding-left:1.2em;}
:focus-visible{outline:3px solid var(--gold); outline-offset:2px;}
img{max-width:100%; display:block;}

.container{max-width:1180px; margin:0 auto; padding:0 24px;}
.section{padding:48px 0;}
.section--tight{padding:28px 0;}
.eyebrow{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--royal-dark); margin-bottom:.6em; display:block;
}

.wf-skip-link{
  position:absolute; left:12px; top:-48px; z-index:200;
  background:var(--navy); color:#fff; padding:.7em 1em; border-radius:8px;
  font-size:.85rem; font-weight:600; transition:top .15s ease;
}
.wf-skip-link:focus{top:12px;}

/* ================= Buttons ================= */
.btn{
  display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--font-body); font-weight:600; font-size:.92rem;
  padding:.72em 1.3em; border-radius:8px; border:1.5px solid transparent;
  cursor:pointer; text-decoration:none; transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.btn:hover{text-decoration:none; transform:translateY(-1px);}
.btn:active{transform:translateY(0);}
.btn-primary{background:var(--royal); color:#fff;}
.btn-primary:hover{background:var(--royal-dark);}
.btn-gold{background:var(--gold); color:var(--navy);}
.btn-gold:hover{background:var(--gold-soft);}
.btn-ghost{background:transparent; border-color:var(--surface-line); color:var(--ink);}
.btn-ghost:hover{border-color:var(--royal); color:var(--royal);}
.btn-danger{background:transparent; border-color:var(--brick); color:var(--brick);}
.btn-danger:hover{background:var(--brick-bg);}
.btn-sm{padding:.45em .9em; font-size:.82rem;}
.btn[disabled]{opacity:.5; cursor:not-allowed; transform:none;}
.btn.wfv2-loading{opacity:.7; cursor:wait;}

/* ================= Permanent header ================= */
#workforce-header{
  position:sticky; top:0; z-index:80;
  background:var(--navy);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 4px 20px rgba(7,18,38,.25);
}
.wf-header-inner{
  max-width:1280px; margin:0 auto; padding:0 24px;
  height:var(--header-h);
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.wf-brand{
  display:flex; align-items:center; gap:.7em;
  font-family:var(--font-display); font-weight:700; font-size:1.12rem;
  color:#fff; text-decoration:none; flex-shrink:0;
}
.wf-brand:hover{text-decoration:none;}
.wf-brand__mark{
  width:38px; height:38px; border-radius:9px; flex-shrink:0;
  background:linear-gradient(155deg,var(--gold),var(--royal-bright));
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-weight:700; font-size:.85rem; color:var(--navy);
}
.wf-brand__text small{
  display:block; font-family:var(--font-mono); font-weight:400;
  font-size:.62rem; letter-spacing:.08em; color:#9FB0D9; text-transform:uppercase;
}

.wf-nav{display:flex; align-items:center; gap:2px;}
.wf-nav-item{position:relative;}
.wf-nav-link, .wf-nav-trigger{
  display:inline-flex; align-items:center; gap:.3em;
  color:#D9E1F5; font-size:.87rem; font-weight:500; font-family:var(--font-body);
  padding:.6em .75em; border-radius:6px; white-space:nowrap;
  background:none; border:none; cursor:pointer;
}
.wf-nav-link:hover, .wf-nav-link.active, .wf-nav-trigger:hover{
  color:#fff; background:rgba(255,255,255,.08); text-decoration:none;
}
.wf-nav-trigger::after{content:'▾'; font-size:.65em; margin-left:.15em;}
.wf-nav-menu{
  display:none; position:absolute; top:100%; left:0; margin-top:6px;
  min-width:250px; background:#fff; border:1px solid var(--surface-line);
  border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:8px; z-index:90;
}
.wf-nav-item:hover .wf-nav-menu,
.wf-nav-item:focus-within .wf-nav-menu{display:block;}
.wf-nav-menu a{
  display:block; color:var(--ink); font-size:.86rem; font-weight:500;
  padding:.6em .7em; border-radius:6px;
}
.wf-nav-menu a:hover{background:var(--surface); color:var(--royal); text-decoration:none;}
.wf-nav-menu a small{display:block; color:var(--text-muted); font-weight:400; font-size:.76rem;}

.wf-header-toggle{
  display:none; background:none; border:1px solid rgba(255,255,255,.25);
  color:#fff; border-radius:6px; width:42px; height:42px; font-size:1.15rem; cursor:pointer;
}

@media(max-width:980px){
  .wf-header-toggle{display:block;}
  .wf-nav{
    position:fixed; inset:var(--header-h) 0 0 auto; height:calc(100% - var(--header-h));
    width:280px; background:var(--navy); flex-direction:column; align-items:stretch;
    padding:16px; transform:translateX(100%); transition:transform .2s ease;
    overflow-y:auto; border-left:1px solid rgba(255,255,255,.08); gap:2px;
  }
  .wf-nav.open{transform:translateX(0); display:flex;}
  .wf-nav-link, .wf-nav-trigger{width:100%; justify-content:space-between; padding:.85em .8em;}
  .wf-nav-menu{
    position:static; display:none; box-shadow:none; background:rgba(255,255,255,.05);
    border-color:rgba(255,255,255,.1); margin:0 0 4px;
  }
  .wf-nav-item.open .wf-nav-menu{display:block;}
  .wf-nav-item.open .wf-nav-menu a{color:#D9E1F5;}
  .wf-nav-item.open .wf-nav-menu a:hover{background:rgba(255,255,255,.08); color:#fff;}
}

/* ================= Permanent six-step pathway ================= */
#workforce-pathway{
  background:linear-gradient(135deg,var(--navy-deep),var(--navy-soft));
  border-bottom:1px solid rgba(255,255,255,.08);
}
.wf-pathway-inner{max-width:1280px; margin:0 auto; padding:16px 24px 14px;}
.wf-pathway-label{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  margin-bottom:10px; flex-wrap:wrap;
}
.wf-pathway-label .eyebrow{margin:0; color:var(--gold-soft);}
.wf-pathway-label strong{color:#fff; font-family:var(--font-display); font-size:1.05rem;}
.wf-pathway-track{height:6px; border-radius:999px; background:rgba(255,255,255,.14); overflow:hidden; margin-bottom:14px;}
.wf-pathway-track span{display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--gold),var(--gold-soft));}

.wf-pathway-steps{
  display:grid; grid-template-columns:repeat(6,1fr); gap:8px;
  list-style:none; margin:0; padding:0;
}
.wf-pathway-step{
  display:flex; flex-direction:column; align-items:flex-start; gap:4px;
  padding:9px 10px; border-radius:8px; border:1px solid transparent;
  color:#9FB0D9; text-decoration:none; min-width:0;
}
.wf-pathway-step:hover{background:rgba(255,255,255,.06); text-decoration:none;}
.wf-pathway-step__num{
  display:inline-flex; align-items:center; justify-content:center;
  width:22px; height:22px; border-radius:50%; font-family:var(--font-mono);
  font-size:.7rem; font-weight:700; background:rgba(255,255,255,.12); color:#D9E1F5; flex-shrink:0;
}
.wf-pathway-step__label{font-size:.78rem; font-weight:600; line-height:1.25; color:#D9E1F5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:100%;}
.wf-pathway-step.is-done .wf-pathway-step__num{background:var(--success); color:#fff;}
.wf-pathway-step.is-done .wf-pathway-step__label{color:#B9E4D3;}
.wf-pathway-step.is-current{background:rgba(212,175,55,.14); border-color:rgba(212,175,55,.45);}
.wf-pathway-step.is-current .wf-pathway-step__num{background:var(--gold); color:var(--navy);}
.wf-pathway-step.is-current .wf-pathway-step__label{color:#fff;}

@media(max-width:900px){
  .wf-pathway-steps{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:620px){
  .wf-pathway-steps{grid-template-columns:repeat(2,1fr);}
  .wf-pathway-step__label{white-space:normal;}
}

/* ================= Permanent banner region ================= */
#workforce-banner{
  width:100%;
  background:var(--navy-deep);
  overflow:hidden;
}
.wf-banner-img{
  display:block;
  width:100%;
  height:auto;
  max-height:min(46vw, 480px);
  object-fit:contain;
  object-position:center;
  margin:0 auto;
}
@media(max-width:720px){
  .wf-banner-img{max-height:none;}
}

/* Letterbox variant — for banner assets that are NOT wide-landscape (e.g. the portrait
   admin Enterprise Administration asset). Gives the region a definite height so
   object-fit:contain can guarantee zero cropping regardless of the asset's aspect ratio,
   with identical geometry across all breakpoints. */
.wf-banner-frame{
  width:100%;
  height:clamp(260px, 32vw, 480px);
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--navy-deep);
}
.wf-banner-frame img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

/* ================= Main content ================= */
#workforce-content{background:var(--surface);}
.route-flag{
  font-family:var(--font-mono); font-size:.68rem; color:var(--text-muted);
  background:var(--surface-line); display:inline-block; padding:.15em .5em; border-radius:3px; margin-bottom:.6em;
}

/* Cards / grids */
.grid{display:grid; gap:20px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
@media(max-width:900px){.grid-3{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.grid-3,.grid-2{grid-template-columns:1fr;}}

.card{
  background:var(--white); border:1px solid var(--surface-line); border-radius:var(--radius);
  padding:22px; box-shadow:var(--shadow-sm);
}
.card h3{margin-bottom:.3em;}

/* Ledger stamp */
.stamp{
  display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--font-mono); font-size:.7rem; color:var(--royal-dark);
  background:var(--teal-bg); border:1px dashed var(--royal); border-radius:4px; padding:.3em .6em; line-height:1.3;
}
.stamp.stamp-stale{color:var(--brick); background:var(--brick-bg); border-color:var(--brick);}
.stamp.stamp-none{color:var(--text-muted); background:var(--surface-line); border-color:var(--surface-line); border-style:solid;}

/* Directory / resource cards */
.resource-card{
  background:var(--white); border:1px solid var(--surface-line); border-radius:var(--radius);
  padding:20px; display:flex; flex-direction:column; gap:10px; box-shadow:var(--shadow-sm);
}
.resource-card .tag-row{display:flex; gap:6px; flex-wrap:wrap;}
.tag{
  font-family:var(--font-mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.04em;
  background:var(--gold-bg); color:#7A5A1E; border-radius:3px; padding:.2em .55em;
}
.resource-card .meta{font-size:.85rem; color:var(--text-muted); margin:0;}
.resource-card .actions{display:flex; gap:8px; margin-top:auto; flex-wrap:wrap;}

/* Toolbar / forms */
.toolbar{
  display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end;
  background:var(--white); border:1px solid var(--surface-line); border-radius:var(--radius);
  padding:16px; margin-bottom:22px;
}
.field{display:flex; flex-direction:column; gap:.35em; flex:1 1 180px;}
.field label{font-size:.78rem; font-weight:600; color:var(--ink-soft);}
.field input,.field select,.field textarea{
  font-family:var(--font-body); font-size:.92rem;
  padding:.6em .7em; border:1.5px solid var(--surface-line); border-radius:6px;
  background:#fff; color:var(--text);
}
.field textarea{resize:vertical; min-height:80px;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--royal); outline:none;}
.field .hint{font-size:.74rem; color:var(--text-muted);}
.checkline{display:flex; align-items:flex-start; gap:.6em; font-size:.88rem; color:var(--text-muted);}
.checkline input{margin-top:.25em;}

form.stack{display:grid; gap:16px;}
fieldset{border:1px solid var(--surface-line); border-radius:var(--radius); padding:18px; margin:0; background:var(--white);}
legend{font-family:var(--font-mono); font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; padding:0 .4em; color:var(--royal-dark);}
.hint{font-size:.82rem; color:var(--text-muted);}

/* Empty state */
.empty-state{
  text-align:center; padding:48px 20px; border:1.5px dashed var(--surface-line);
  border-radius:var(--radius); background:var(--white); color:var(--text-muted);
}
.empty-state .glyph{font-size:2rem; margin-bottom:.4em;}

/* Disclaimer banner */
.disclaimer{
  display:flex; gap:12px; align-items:flex-start;
  background:var(--gold-bg); border:1px solid var(--gold);
  border-radius:var(--radius); padding:14px 16px; margin-bottom:22px;
  font-size:.86rem; color:#5A481F;
}
.disclaimer strong{color:#5A481F;}
.disclaimer.brick{background:var(--brick-bg); border-color:var(--brick); color:#6E2A22;}

.flex-between{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;}
.divider{border:none; border-top:1px solid var(--surface-line); margin:24px 0;}

/* KPI row (opportunity intelligence) */
.oi-kpis{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:24px;}
@media(max-width:800px){.oi-kpis{grid-template-columns:repeat(2,1fr);}}
.oi-kpi{background:var(--white); border:1px solid var(--surface-line); border-radius:var(--radius); padding:16px;}
.oi-kpi b{font-family:var(--font-display); font-size:1.8rem; display:block; color:var(--navy);}
.oi-kpi span{font-size:.75rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:.05em;}
.oi-card{border-left:4px solid var(--royal); margin-bottom:16px;}
.oi-card.priority-100{border-left-color:var(--brick);}
.oi-card.priority-70{border-left-color:var(--gold);}
.oi-match{border-top:1px solid var(--surface-line); padding-top:10px; margin-top:10px;}
.oi-actions{margin-top:8px;}

.badge{font-family:var(--font-mono); font-size:.68rem; padding:.2em .5em; border-radius:3px; text-transform:uppercase;}
.badge-open{background:var(--teal-bg); color:var(--royal-dark);}
.badge-pending{background:var(--gold-bg); color:#7A5A1E;}
.badge-closed{background:var(--surface-line); color:var(--text-muted);}

/* Unified Opportunity Journey */
.journey-grid{display:grid; grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr); gap:20px;}
@media(max-width:850px){.journey-grid{grid-template-columns:1fr;}}
.domain-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px;}
@media(max-width:560px){.domain-grid{grid-template-columns:1fr;}}
.domain-card{border:1px solid var(--surface-line); border-radius:var(--radius); padding:14px; background:var(--white);}
.timeline-item{border-left:3px solid var(--royal); padding:0 0 20px 18px; position:relative;}
.timeline-item::before{content:""; width:11px; height:11px; border-radius:50%; background:var(--royal); position:absolute; left:-7px; top:5px;}

/* Resume builder */
.builder-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start;}
@media(max-width:900px){.builder-grid{grid-template-columns:1fr;}}
#resume-preview{
  background:var(--white); border:1px solid var(--surface-line); border-radius:var(--radius);
  padding:32px; box-shadow:var(--shadow-sm); position:sticky; top:calc(var(--header-h) + 12px);
}
.rp-section{margin-top:18px;}
.rp-section h2{font-size:1rem; text-transform:uppercase; letter-spacing:.05em; color:var(--royal-dark); border-bottom:1px solid var(--surface-line); padding-bottom:4px;}
.rp-entry{margin-bottom:10px;}
.rp-entry h3{font-size:.98rem; margin-bottom:.15em;}
.rp-meta{font-size:.82rem; color:var(--text-muted);}
.rp-contact{font-size:.9rem; color:var(--text-muted); margin-bottom:6px;}
@media print{
  .no-print{display:none !important;}
  #workforce-header,#workforce-pathway,#workforce-banner,#workforce-footer{display:none !important;}
  .builder-grid{display:block;}
}

/* Continue Learning lesson library — unified across all steps */
.wf-lesson-library{
  margin:44px 0 8px; padding:32px; border-radius:var(--radius-lg);
  background:var(--white); border:1px solid var(--surface-line); box-shadow:var(--shadow-sm);
}
.wf-lesson-head{max-width:900px; margin:0 0 26px;}
.wf-lesson-kicker{margin:0 0 8px; color:var(--royal-dark); font-size:.8rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;}
.wf-lesson-head h2{margin:0 0 10px;}
.wf-lesson-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px;}
@media(max-width:820px){.wf-lesson-grid{grid-template-columns:1fr;}}
.wf-lesson{
  border:1px solid var(--surface-line); border-radius:14px; overflow:hidden;
  background:linear-gradient(160deg,var(--navy),var(--navy-deep)); color:#EAF0FF;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.wf-lesson:hover{border-color:rgba(212,175,55,.4); box-shadow:var(--shadow-md);}
.wf-lesson[open]{border-color:rgba(212,175,55,.5);}
.wf-lesson summary{
  display:grid; grid-template-columns:42px 1fr auto 20px; align-items:center; gap:12px;
  min-height:88px; padding:16px 18px; cursor:pointer; list-style:none; outline:none;
}
.wf-lesson summary::-webkit-details-marker{display:none;}
.wf-lesson-number{
  display:grid; place-items:center; width:38px; height:38px; border-radius:10px;
  background:linear-gradient(145deg,var(--gold-soft),var(--gold)); color:var(--navy);
  font-weight:800; font-size:.95rem;
}
.wf-lesson-title{font-size:1.02rem; font-weight:700; line-height:1.25;}
.wf-lesson-time{
  padding:5px 8px; border:1px solid rgba(212,175,55,.3); border-radius:999px;
  background:rgba(212,175,55,.08); color:var(--gold-soft); font-size:.72rem; font-weight:700; white-space:nowrap;
}
.wf-lesson summary::after{content:"+"; font-size:1.4rem; text-align:center;}
.wf-lesson[open] summary::after{content:"−";}
.wf-lesson-body{padding:0 18px 20px 82px; color:#C2CEE0; font-size:.95rem;}
.wf-lesson-body h4{margin:12px 0 6px; color:#EAF0FF; font-size:.98rem;}
.wf-lesson-body ul{margin:6px 0 12px 20px;}
.wf-lesson-reflection{
  margin-top:14px; padding:12px 14px; border-left:3px solid var(--gold);
  background:rgba(212,175,55,.08); border-radius:8px; font-weight:600; color:#F5EBCB;
}
@media(max-width:620px){
  .wf-lesson-library{padding:20px;}
  .wf-lesson summary{grid-template-columns:36px 1fr 18px; min-height:76px;}
  .wf-lesson-time{display:none;}
  .wf-lesson-body{padding-left:18px;}
}

/* Success / confirmation panels */
.wf-success{border-top:3px solid var(--success); margin-bottom:24px;}

/* Toast */
#toast{
  position:fixed; bottom:20px; left:50%; transform:translateX(-50%) translateY(20px);
  background:var(--navy); color:#fff; padding:.8em 1.2em; border-radius:8px;
  font-size:.86rem; opacity:0; pointer-events:none; transition:all .25s ease; z-index:999;
  box-shadow:var(--shadow-lg); max-width:90vw;
}
#toast.show{opacity:1; transform:translateX(-50%) translateY(0);}
.wfv2-feedback{position:fixed; bottom:20px; right:20px; z-index:999; display:flex; flex-direction:column; gap:8px; max-width:320px;}
.wfv2-toast{background:var(--navy); color:#fff; padding:.9em 1.1em; border-radius:8px; box-shadow:var(--shadow-lg); font-size:.85rem;}
.wfv2-toast strong{display:block; margin-bottom:.2em;}
.wfv2-toast p{margin:0; color:#C2CEE0;}
.wfv2-toast--error{border-left:4px solid var(--brick);}

/* ================= Permanent footer ================= */
#workforce-footer{background:var(--navy-deep); color:#B9C2CE; margin-top:56px; padding:44px 0 26px; font-size:.85rem;}
#workforce-footer a{color:#E4E9EF;}
.wf-foot-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:32px;}
#workforce-footer h4{color:#fff; font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; margin-bottom:.7em;}
#workforce-footer ul{list-style:none; padding:0; margin:0; display:grid; gap:.45em;}
.wf-foot-bottom{margin-top:28px; padding-top:20px; border-top:1px solid rgba(255,255,255,.1); font-family:var(--font-mono); font-size:.72rem; color:#7E8896; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;}
@media(max-width:820px){.wf-foot-grid{grid-template-columns:1fr 1fr; gap:24px;}}
@media(max-width:560px){.wf-foot-grid{grid-template-columns:1fr;}}

/* ================= Continue / Previous step navigation ================= */
.wf-step-nav{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  max-width:1180px; margin:40px auto 0; padding:20px 24px; border-top:1px solid var(--surface-line);
}
.wf-step-nav__prev{color:var(--ink-soft); font-weight:600; font-size:.9rem;}
.wf-step-nav__prev:hover{color:var(--royal);}


/* ================= Step 4 Training & Credential Directory — Learning Center, Progress Checklist, and Lesson Library
   (ported near-verbatim from production; already navy/gold, restyled to use the shared palette tokens) ================= */

[data-aios-step4-learning-center="true"]{
  width:min(1180px,calc(100% - 32px));
  margin:28px auto 42px;
  padding:28px;
  border:1px solid rgba(212,175,55,.28);
  border-radius:20px;
  background:#0d1a2c;
  color:#f4f7fb;
  box-sizing:border-box;
  box-shadow:0 18px 44px rgba(0,0,0,.20);
}
.aios-step4-heading{
  margin-bottom:22px;
  padding-bottom:16px;
  border-bottom:1px solid rgba(212,175,55,.30);
}
.aios-step4-kicker{
  margin:0 0 8px;
  color:#d4af37;
  font-size:.82rem;
  font-weight:850;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.aios-step4-heading h2{
  margin:0 0 10px;
  color:#f4f7fb;
  font-size:clamp(1.8rem,3vw,2.55rem);
  line-height:1.12;
}
.aios-step4-heading p{
  margin:0;
  max-width:850px;
  color:#bdc9d6;
  line-height:1.65;
}
.aios-step4-capability-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-bottom:26px;
}
.aios-step4-capability{
  display:flex;
  flex-direction:column;
  min-height:230px;
  padding:20px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:16px;
  background:linear-gradient(180deg,#0a1626,#091320);
  box-sizing:border-box;
}
.aios-step4-capability h3{
  margin:0 0 10px;
  color:#f4f7fb;
  font-size:1.14rem;
}
.aios-step4-capability p{
  margin:0 0 18px;
  color:#b8c5d3;
  line-height:1.58;
  flex:1;
}
.aios-step4-capability a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 14px;
  border-radius:10px;
  background:#d4af37;
  color:#07111f;
  text-decoration:none;
  text-align:center;
  font-weight:850;
}
.aios-step4-plan{
  padding:22px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:#091523;
}
.aios-step4-plan h3{
  margin:0 0 8px;
  color:#f4f7fb;
  font-size:1.35rem;
}
.aios-step4-plan > p{
  margin:0 0 18px;
  color:#b8c5d3;
  line-height:1.55;
}
.aios-step4-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-bottom:20px;
}
.aios-step4-option{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:14px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  background:#0c1a2b;
  color:#e9eef4;
}
.aios-step4-option input{
  margin-top:4px;
}
.aios-step4-option strong{
  display:block;
  margin-bottom:4px;
}
.aios-step4-option span{
  display:block;
  color:#aebdca;
  font-size:.9rem;
  line-height:1.45;
}
.aios-step4-notes{
  display:grid;
  gap:8px;
  margin-bottom:18px;
}
.aios-step4-notes label{
  color:#f4f7fb;
  font-weight:750;
}
.aios-step4-notes textarea{
  width:100%;
  min-height:100px;
  padding:12px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  background:#07111f;
  color:#f4f7fb;
  box-sizing:border-box;
  resize:vertical;
}
.aios-step4-submit{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:48px;
  padding:12px 18px;
  border:0;
  border-radius:11px;
  background:#d4af37;
  color:#07111f;
  font-weight:900;
  cursor:pointer;
}
.aios-step4-boundary{
  margin:14px 0 0;
  color:#91a2b3;
  font-size:.84rem;
  line-height:1.5;
}
@media(max-width:960px){
  .aios-step4-capability-grid{
    grid-template-columns:1fr;
  }
}
@media(max-width:720px){
  [data-aios-step4-learning-center="true"]{
    width:calc(100% - 24px);
    padding:20px;
  }
  .aios-step4-options{
    grid-template-columns:1fr;
  }
}



[data-aios-step4-lesson-progress="true"]{
  width:min(1180px,calc(100% - 32px));
  margin:0 auto 42px;
  padding:26px;
  border:1px solid rgba(212,175,55,.25);
  border-radius:20px;
  background:#0a1626;
  color:#f4f7fb;
  box-sizing:border-box;
}
.aios-step4-progress-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:20px;
  padding-bottom:15px;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.aios-step4-progress-head h2{
  margin:0 0 7px;
  font-size:clamp(1.6rem,2.5vw,2.2rem);
}
.aios-step4-progress-head p{
  margin:0;
  color:#b8c5d3;
  line-height:1.55;
}
.aios-step4-progress-count{
  flex:0 0 auto;
  min-width:130px;
  padding:12px 16px;
  border-radius:12px;
  background:#07111f;
  color:#d4af37;
  text-align:center;
  font-weight:900;
}
.aios-step4-lesson-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-bottom:22px;
}
.aios-step4-lesson{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:start;
  padding:16px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:14px;
  background:#0d1b2d;
}
.aios-step4-lesson input{
  margin-top:5px;
  width:18px;
  height:18px;
}
.aios-step4-lesson strong{
  display:block;
  margin-bottom:5px;
  color:#f4f7fb;
}
.aios-step4-lesson span{
  display:block;
  color:#aebdca;
  font-size:.92rem;
  line-height:1.5;
}
.aios-step4-readiness{
  display:grid;
  gap:14px;
  padding:18px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:#07111f;
}
.aios-step4-readiness label{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:#e9eef4;
  line-height:1.5;
}
.aios-step4-readiness input{
  margin-top:4px;
}
.aios-step4-readiness-message{
  margin:0;
  min-height:22px;
  color:#d4af37;
  font-weight:750;
}
.aios-step4-complete{
  min-height:48px;
  border:0;
  border-radius:11px;
  padding:12px 18px;
  background:#d4af37;
  color:#07111f;
  font-weight:900;
  cursor:pointer;
}
.aios-step4-complete:disabled{
  opacity:.45;
  cursor:not-allowed;
}
@media(max-width:760px){
  [data-aios-step4-lesson-progress="true"]{
    width:calc(100% - 24px);
    padding:20px;
  }
  .aios-step4-progress-head{
    align-items:flex-start;
    flex-direction:column;
  }
  .aios-step4-lesson-grid{
    grid-template-columns:1fr;
  }
}



[data-aios-step4-lesson-library="true"]{
  width:min(1180px,calc(100% - 32px));
  margin:0 auto 42px;
  padding:28px;
  border:1px solid rgba(212,175,55,.26);
  border-radius:20px;
  background:#0b1728;
  color:#f4f7fb;
  box-sizing:border-box;
}
.aios-step4-library-head{
  margin-bottom:22px;
  padding-bottom:16px;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.aios-step4-library-head p:first-child{
  margin:0 0 7px;
  color:#d4af37;
  font-size:.82rem;
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.aios-step4-library-head h2{
  margin:0 0 9px;
  font-size:clamp(1.7rem,2.7vw,2.35rem);
}
.aios-step4-library-head p:last-child{
  margin:0;
  max-width:880px;
  color:#b8c5d3;
  line-height:1.6;
}
.aios-step4-library-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px;
  margin-bottom:24px;
}
.aios-step4-library-lesson{
  border:1px solid rgba(255,255,255,.10);
  border-radius:15px;
  background:#091523;
  overflow:hidden;
}
.aios-step4-library-lesson summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-height:64px;
  padding:16px 18px;
  color:#f4f7fb;
  font-weight:850;
  cursor:pointer;
  list-style:none;
}
.aios-step4-library-lesson summary::-webkit-details-marker{
  display:none;
}
.aios-step4-library-lesson summary::after{
  content:"+";
  color:#d4af37;
  font-size:1.45rem;
  font-weight:700;
}
.aios-step4-library-lesson[open] summary::after{
  content:"−";
}
.aios-step4-library-content{
  padding:0 18px 18px;
  color:#b8c5d3;
  line-height:1.6;
}
.aios-step4-library-content h3{
  margin:16px 0 7px;
  color:#f4f7fb;
  font-size:1rem;
}
.aios-step4-library-content ul{
  margin:8px 0 14px 20px;
  padding:0;
}
.aios-step4-library-content li{
  margin:6px 0;
}
.aios-step4-reflection{
  display:grid;
  gap:8px;
  margin-top:15px;
}
.aios-step4-reflection label{
  color:#f4f7fb;
  font-weight:750;
}
.aios-step4-reflection textarea{
  width:100%;
  min-height:86px;
  padding:11px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  background:#07111f;
  color:#f4f7fb;
  box-sizing:border-box;
  resize:vertical;
}
.aios-step4-reflection-check{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-top:11px;
  color:#d9e1e9;
}
.aios-step4-reflection-check input{
  margin-top:4px;
}
.aios-step4-library-save{
  display:grid;
  gap:13px;
  padding:20px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:#07111f;
}
.aios-step4-library-summary{
  margin:0;
  color:#d4af37;
  font-weight:800;
}
.aios-step4-library-save button{
  min-height:48px;
  border:0;
  border-radius:11px;
  padding:12px 18px;
  background:#d4af37;
  color:#07111f;
  font-weight:900;
  cursor:pointer;
}
.aios-step4-library-boundary{
  margin:0;
  color:#91a2b3;
  font-size:.84rem;
  line-height:1.5;
}
@media(max-width:800px){
  [data-aios-step4-lesson-library="true"]{
    width:calc(100% - 24px);
    padding:20px;
  }
  .aios-step4-library-grid{
    grid-template-columns:1fr;
  }
}





.aios-premium-resource-section{
  width:min(1180px,calc(100% - 32px));
  margin:44px auto 28px;
  padding:32px;
  border:1px solid rgba(16,39,67,.18);
  border-radius:24px;
  background:linear-gradient(180deg,#e8edf0,#dce4e8);
  box-shadow:0 20px 48px rgba(7,17,31,.10);
  box-sizing:border-box;
}
.aios-premium-resource-head{max-width:900px;margin:0 0 25px}
.aios-premium-resource-kicker{
  margin:0 0 8px;color:#725404;font-size:.82rem;font-weight:950;
  letter-spacing:.14em;text-transform:uppercase;
}
.aios-premium-resource-head h2{
  margin:0 0 10px;color:#081c34;
  font-size:clamp(2.15rem,3.7vw,3.2rem);
  font-weight:950;line-height:1.04;letter-spacing:-.036em;
}
.aios-premium-resource-head p{
  max-width:820px;margin:0;color:#40556a;font-size:1.04rem;line-height:1.7;
}
.aios-premium-resource-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;align-items:stretch;
}
.aios-premium-resource-card{
  display:flex;flex-direction:column;min-width:0;min-height:250px;
  padding:24px;border:1px solid rgba(255,255,255,.11);border-radius:20px;
  background:linear-gradient(145deg,#10223a,#07111f);color:#f5f8fb;
  text-decoration:none;box-shadow:0 16px 36px rgba(7,17,31,.17);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.aios-premium-resource-card:hover{
  transform:translateY(-3px);border-color:rgba(212,175,55,.42);
  box-shadow:0 23px 48px rgba(7,17,31,.24);
}
.aios-premium-resource-card:focus-visible{
  outline:3px solid #d4af37;outline-offset:4px;
}
.aios-premium-resource-icon{
  display:grid;place-items:center;width:52px;height:52px;margin:0 0 22px;
  border-radius:16px;background:linear-gradient(145deg,#e7cd6d,#c8991b);
  color:#07111f;font-size:1.45rem;font-weight:950;
  box-shadow:0 9px 22px rgba(212,175,55,.24);
}
.aios-premium-resource-card h3{
  margin:0 0 11px;color:#f7f9fb;font-size:1.35rem;
  font-weight:950;line-height:1.22;letter-spacing:-.015em;
}
.aios-premium-resource-card p{
  margin:0 0 22px;color:#c5d1dc;line-height:1.67;
}
.aios-premium-resource-action{
  margin-top:auto;color:#e6cb68;font-weight:950;line-height:1.25;
}
.aios-premium-resource-action::after{content:"  →"}
@media(max-width:960px){
  .aios-premium-resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:650px){
  .aios-premium-resource-section{
    width:calc(100% - 24px);margin:34px auto 24px;padding:21px;border-radius:18px;
  }
  .aios-premium-resource-grid{grid-template-columns:1fr;gap:14px}
  .aios-premium-resource-card{min-height:220px;padding:20px}
  .aios-premium-resource-head h2{font-size:2rem}
}
@media(prefers-reduced-motion:reduce){
  .aios-premium-resource-card{transition:none}
  .aios-premium-resource-card:hover{transform:none}
}

/* ===========================================================
   Admin mirror — sidebar shell, KPI rows, data tables
   =========================================================== */
#workforce-admin-nav{
  background:linear-gradient(135deg,var(--navy-deep),var(--navy-soft));
  border-bottom:1px solid rgba(255,255,255,.08);
}
.wf-admin-nav-inner{max-width:1360px; margin:0 auto; padding:14px 24px;}
.wf-admin-nav-label{display:flex; align-items:baseline; gap:10px; margin-bottom:10px; flex-wrap:wrap;}
.wf-admin-nav-label .eyebrow{margin:0; color:var(--gold-soft);}
.wf-admin-nav-label strong{color:#fff; font-family:var(--font-display); font-size:1.05rem;}
.wf-admin-crumb{color:#9FB0D9; font-size:.82rem;}
.wf-admin-crumb a{color:#D9E1F5;}
.wf-admin-tabs{display:flex; gap:4px; flex-wrap:wrap;}
.wf-admin-tab{
  font-size:.8rem; font-weight:600; color:#B9C5E3; padding:.5em .8em; border-radius:6px;
  white-space:nowrap;
}
.wf-admin-tab:hover{background:rgba(255,255,255,.08); color:#fff; text-decoration:none;}
.wf-admin-tab.active{background:rgba(212,175,55,.16); color:var(--gold-soft); border:1px solid rgba(212,175,55,.4);}

.admin-shell{display:grid; grid-template-columns:240px 1fr; gap:28px; max-width:1360px; margin:0 auto;}
.admin-side{align-self:start; position:sticky; top:calc(var(--header-h) + 16px); background:var(--white); border:1px solid var(--surface-line); border-radius:var(--radius); padding:12px; box-shadow:var(--shadow-sm);}
.admin-side a{display:block; color:var(--ink-soft); font-size:.86rem; font-weight:600; padding:.65em .7em; border-radius:6px; margin-bottom:2px;}
.admin-side a:hover{background:var(--surface); color:var(--royal); text-decoration:none;}
.admin-side a.active{background:var(--teal-bg); color:var(--royal-dark);}
.admin-main{min-width:0;}
@media(max-width:980px){
  .admin-shell{grid-template-columns:1fr;}
  .admin-side{position:static; display:flex; overflow-x:auto; gap:4px; padding:8px;}
  .admin-side a{white-space:nowrap; margin-bottom:0;}
}

.kpi-row{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:24px;}
@media(max-width:900px){.kpi-row{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.kpi-row{grid-template-columns:1fr;}}
.kpi{background:var(--white); border:1px solid var(--surface-line); border-radius:var(--radius); padding:18px; box-shadow:var(--shadow-sm);}
.kpi b{font-family:var(--font-display); font-size:1.7rem; display:block; color:var(--navy);}
.kpi span{font-size:.75rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:.05em;}

table.data-table{width:100%; border-collapse:collapse; background:var(--white); font-size:.87rem;}
table.data-table th,table.data-table td{padding:.7em .75em; border-bottom:1px solid var(--surface-line); text-align:left; vertical-align:top;}
table.data-table th{font-family:var(--font-mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; color:var(--text-muted); background:var(--surface);}
table.data-table tr:hover td{background:var(--surface);}
.table-wrap{overflow-x:auto; border:1px solid var(--surface-line); border-radius:var(--radius); background:var(--white);}

.wf-admin-module-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:18px;}
.wf-integration-note{
  display:flex; gap:10px; align-items:flex-start; background:var(--teal-bg); border:1px solid rgba(30,79,214,.25);
  border-radius:var(--radius); padding:12px 14px; font-size:.82rem; color:var(--royal-dark); margin-bottom:18px;
}
.wf-admin-section{margin-bottom:36px;}
.wf-admin-section h2{border-bottom:1px solid var(--surface-line); padding-bottom:8px; margin-bottom:14px;}

/* ================= Homepage ================= */
.wf-hero{
  background:linear-gradient(135deg,var(--navy-deep) 0%,var(--navy) 60%,var(--royal-dark) 130%);
  color:#fff; padding:64px 0 56px;
}
.wf-hero h1{color:#fff; max-width:20ch; font-size:clamp(2.2rem,4.6vw,3.4rem);}
.wf-hero p.lead{color:#C7CEDA; font-size:1.12rem; max-width:60ch; margin-top:10px;}
.wf-hero-actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:1.8em;}
.wf-hero-stats{display:flex; gap:40px; margin-top:40px; flex-wrap:wrap;}
.wf-hero-stats b{display:block; font-family:var(--font-display); font-size:1.7rem; color:var(--gold-soft);}
.wf-hero-stats span{font-size:.72rem; color:#9DA8B7; text-transform:uppercase; letter-spacing:.08em;}

.wf-home-section{padding:52px 0;}
.wf-home-section--alt{background:var(--white);}
.wf-home-section-head{max-width:760px; margin:0 0 30px;}
.wf-service-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
@media(max-width:960px){.wf-service-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.wf-service-grid{grid-template-columns:1fr;}}
.wf-service-card{
  background:var(--white); border:1px solid var(--surface-line); border-radius:var(--radius-lg);
  padding:24px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:8px;
  transition:transform .15s ease, box-shadow .15s ease;
}
.wf-service-card:hover{transform:translateY(-3px); box-shadow:var(--shadow-md); text-decoration:none;}
.wf-service-card__icon{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center;
  background:linear-gradient(145deg,var(--gold-soft),var(--gold)); color:var(--navy); font-weight:800;
}
.wf-service-card h3{margin:6px 0 2px; font-size:1.08rem;}
.wf-service-card p{margin:0; font-size:.88rem;}

.wf-pathway-preview{display:grid; grid-template-columns:repeat(6,1fr); gap:12px;}
@media(max-width:900px){.wf-pathway-preview{grid-template-columns:repeat(3,1fr);}}
@media(max-width:560px){.wf-pathway-preview{grid-template-columns:repeat(2,1fr);}}
.wf-pathway-preview a{
  display:flex; flex-direction:column; gap:6px; padding:16px; border-radius:var(--radius);
  background:var(--navy); color:#fff; text-decoration:none; border:1px solid rgba(255,255,255,.08);
}
.wf-pathway-preview a:hover{border-color:var(--gold); text-decoration:none;}
.wf-pathway-preview .num{font-family:var(--font-mono); color:var(--gold-soft); font-size:.75rem; font-weight:800;}
.wf-pathway-preview .label{font-size:.92rem; font-weight:700;}

.wf-audience-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
@media(max-width:960px){.wf-audience-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.wf-audience-grid{grid-template-columns:1fr;}}
.wf-audience-card{background:var(--navy); color:#EAF0FF; border-radius:var(--radius-lg); padding:22px; border:1px solid rgba(255,255,255,.08);}
.wf-audience-card h3{color:#fff; font-size:1.02rem; margin-bottom:.4em;}
.wf-audience-card p{color:#B9C5E3; font-size:.86rem;}
.wf-audience-card a{color:var(--gold-soft); font-weight:700; font-size:.85rem;}

.wf-cta-band{
  background:linear-gradient(120deg,var(--royal-dark),var(--royal));
  color:#fff; border-radius:var(--radius-lg); padding:40px; text-align:center;
}
.wf-cta-band h2{color:#fff;}
.wf-cta-band p{color:#DCE5FF; max-width:56ch; margin:0 auto 20px;}

/* AIOS_WORKFORCE_REDESIGN_MOBILE_PARITY_PHASE2_START */
@media (max-width: 720px) {
  html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  #workforce-header,
  #workforce-banner,
  #workforce-content,
  #workforce-footer {
    display: block !important;
    width: 100%;
  }

  #workforce-banner {
    margin: 0;
    padding: 0;
    overflow: hidden;
  }

  #workforce-banner .wf-banner-img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
  }

  .wf-hero {
    display: block !important;
    margin: 0;
    padding: 28px 0;
  }

  .wf-hero .container,
  .wf-home-section .container,
  #workforce-content > .container {
    width: min(100% - 28px, 1200px);
    margin-inline: auto;
  }

  .wf-hero h1 {
    font-size: clamp(2rem, 9vw, 2.8rem);
    max-width: none;
  }

  .wf-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .wf-hero-actions .btn {
    width: 100%;
    justify-content: center;
  }

  .wf-hero-stats {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .wf-pathway-preview,
  .wf-service-grid,
  .wf-audience-grid,
  .grid.grid-3 {
    grid-template-columns: 1fr !important;
  }

  .wf-nav {
    max-height: calc(100vh - 80px);
    overflow-y: auto;
  }
}
/* AIOS_WORKFORCE_REDESIGN_MOBILE_PARITY_PHASE2_END */

/* AIOS_WORKFORCE_FRESH_MEMBER_COMPONENTS_PHASE4_START */
.wf-member-main{
  min-height:calc(100vh - var(--header-h));
  background:radial-gradient(circle at top right,rgba(33,86,183,.10),transparent 36%),var(--surface);
}
.wf-member-layout{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);
  gap:30px;
  align-items:start;
}
.wf-member-panel{
  background:var(--white);
  border:1px solid var(--surface-line);
  border-radius:18px;
  padding:clamp(22px,4vw,38px);
  box-shadow:var(--shadow-lg);
}
.wf-member-intro{padding:clamp(10px,3vw,28px) 0;}
.wf-member-intro h1{max-width:760px;}
.wf-member-benefits{display:grid;gap:12px;margin-top:24px;}
.wf-member-benefit{
  display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.72);
  border:1px solid var(--surface-line);border-radius:12px;padding:14px;
}
.wf-member-benefit strong{display:block;color:var(--ink);}
.wf-member-benefit span{color:var(--text-muted);font-size:.9rem;}
.wf-member-form{display:grid;gap:17px;}
.wf-member-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;}
.wf-member-field{display:grid;gap:7px;}
.wf-member-field label{color:var(--ink);font-weight:650;font-size:.9rem;}
.wf-member-field input,.wf-member-field textarea,.wf-member-field select{
  width:100%;border:1px solid var(--surface-line);border-radius:10px;background:#fff;
  color:var(--ink);font:inherit;padding:12px 13px;
}
.wf-member-field textarea{min-height:110px;resize:vertical;}
.wf-member-field input:focus,.wf-member-field textarea:focus,.wf-member-field select:focus{
  border-color:var(--royal);box-shadow:0 0 0 3px rgba(33,86,183,.12);outline:none;
}
.wf-member-status{
  border-radius:10px;padding:12px 14px;background:#EDF3FF;border:1px solid #BFD0F5;color:var(--royal-dark);
}
.wf-member-status[data-type="success"]{background:#E9F8F1;border-color:#ABDCC7;color:#17664E;}
.wf-member-status[data-type="error"]{background:#FFF0EE;border-color:#F0B8B0;color:#8C2D23;}
.wf-member-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;}
.wf-member-links{display:flex;flex-wrap:wrap;gap:14px;font-size:.9rem;}
.wf-member-profile-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;
}
.wf-member-avatar{
  width:58px;height:58px;border-radius:16px;display:grid;place-items:center;
  background:linear-gradient(155deg,var(--gold),var(--royal-bright));color:var(--navy);
  font-family:var(--font-display);font-weight:800;flex-shrink:0;
}
@media(max-width:860px){
  .wf-member-layout{grid-template-columns:1fr;}
  .wf-member-intro{padding-top:0;}
}
@media(max-width:620px){
  .wf-member-grid{grid-template-columns:1fr;}
  .wf-member-panel{border-radius:14px;padding:20px;}
  .wf-member-actions .btn{width:100%;justify-content:center;}
  .wf-member-profile-head{align-items:flex-start;flex-direction:column;}
}
/* AIOS_WORKFORCE_FRESH_MEMBER_COMPONENTS_PHASE4_END */

/* AIOS_WORKFORCE_MEMBER_ACCESS_BANNER_START */
.wf-member-banner{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 24%,rgba(243,184,51,.24),transparent 34%),
    linear-gradient(135deg,#08162f 0%,#102d68 52%,#174fa6 100%);
  border-bottom:1px solid rgba(255,255,255,.12);
}
.wf-member-banner::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,transparent 0 70%,rgba(255,255,255,.04)),
    repeating-linear-gradient(135deg,transparent 0 28px,rgba(255,255,255,.025) 28px 29px);
  pointer-events:none;
}
.wf-member-banner__inner{
  position:relative;
  z-index:1;
  min-height:230px;
  display:flex;
  align-items:center;
  gap:26px;
  padding-top:38px;
  padding-bottom:38px;
}
.wf-member-banner__mark{
  width:92px;
  height:92px;
  border-radius:24px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  background:linear-gradient(145deg,#f7d26c,#d89c18);
  color:#07142b;
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 18px 42px rgba(0,0,0,.30);
  font-family:var(--font-display);
  font-size:2rem;
  font-weight:900;
}
.wf-member-banner__content{
  max-width:860px;
}
.wf-member-banner__eyebrow{
  display:block;
  margin-bottom:9px;
  color:#f7d26c;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.wf-member-banner h1{
  margin:0;
  color:#fff;
  font-size:clamp(2rem,4vw,3.5rem);
  line-height:1.05;
}
.wf-member-banner p{
  max-width:760px;
  margin:14px 0 0;
  color:rgba(255,255,255,.84);
  font-size:clamp(1rem,1.4vw,1.15rem);
}
@media(max-width:720px){
  .wf-member-banner__inner{
    min-height:auto;
    align-items:flex-start;
    gap:16px;
    padding-top:24px;
    padding-bottom:26px;
  }
  .wf-member-banner__mark{
    width:58px;
    height:58px;
    border-radius:16px;
    font-size:1.2rem;
  }
  .wf-member-banner h1{
    font-size:clamp(1.7rem,8vw,2.35rem);
  }
  .wf-member-banner p{
    font-size:.96rem;
  }
}
/* AIOS_WORKFORCE_MEMBER_ACCESS_BANNER_END */