/* ═══════════════════════════════════════════════════════════════════════
   AI Mindset Applied Studio - V3 design layer
   Loaded LAST on every page (end of body), after shared.css and page styles.

   Two jobs:
   1. THE GRAMMAR SWAP - remove the twelve AI-template tells site-wide and
      replace each with the house move (see v3-lab/DESIGN-RULES.md):
      flat navy instead of glow+mesh · hover sharpens instead of levitating ·
      sentence-case kickers instead of uppercase eyebrows · round = pressable ·
      no decorative icons · no loops · one light source · craft kept (B0).
   2. THE SHEET LIBRARY - the ownable components (.v3-*): the guide's voice
      band, the work sheet with title block, station rows, the promise pin,
      ink notes, ruled answer lists. Used by Welcome and adoptable anywhere.

   !important appears only where page-level styles would otherwise win;
   each use is a deliberate override of a removed tell.
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  --v3-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --v3-due: #C13B3B;
  --v3-kept: #2E6B4F;
  --v3-sheet: #FFFDF9;
  --v3-warm: #FAF8F4;
  /* soften the shadow system into one modelled light (B0), don't delete it */
  --shadow-sm: 0 1px 2px rgba(14,24,38,.05), 0 10px 24px -16px rgba(14,24,38,.18);
  --shadow-md: 0 2px 6px rgba(14,24,38,.06), 0 20px 44px -24px rgba(14,24,38,.28);
  --shadow-lg: 0 24px 60px -28px rgba(14,24,38,.4);
  --shadow-accent: 0 8px 24px -8px rgba(248,135,9,.5);
}

/* ── 1 · atmosphere: the navy carries itself ──────────────────────────── */
.aim-hero-navy { background: var(--navy) !important; }
.aim-hero-navy::before { display: none !important; }
.aim-tool-card.featured { background: var(--navy) !important; }
/* .cp-reinvent-band and .dc2-intro are now flat navy in their own files -
   the blanket background-image:none that lived here stripped .dc2-intro's
   only background and shipped white-on-white (blocker B1). Fix at source,
   never by deny-list. */

/* ── 2 · motion: nothing loops; hover sharpens, never levitates ───────── */
.aim-nav-pill-dot, .aim-nav-companion .dot,
.cp-nav-badge-dot, .rr-nav-badge .dot, .rt-nav-badge .dot { animation: none !important; }

.aim-tool-card, .welcome-path, .wb-item, .action-card, .cl-case, .lf-case, .eb-study {
  transition: border-color 0.16s, box-shadow 0.25s var(--v3-ease) !important;
}
.aim-tool-card:hover, .welcome-path:hover, .wb-item:hover, .action-card:hover {
  transform: none !important;
  border-color: var(--orange) !important;
  box-shadow: var(--shadow-md) !important;
}
.aim-tool-card::before, .welcome-path::before { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ── 3 · labels: sentence case + the orange square ────────────────────── */
.aim-eyebrow, .aim-hero-eyebrow, .wb-resume-eyebrow, .wb-item .k,
.aim-tool-card .subtitle, .action-card .level,
.rr-hiw-label, .rr-snap-eye, .rr-sc-eye, .rr-tracker-eye, .rr-drawer-eye, .rr-close-eye,
.rt-map-col-eye, .de-trail-lbl, .dc2-eye,
.cl-case .stat-lbl, .lf-case .stat-lbl, .eb-num .lbl {
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
}
.aim-eyebrow::before, .aim-hero-eyebrow::before {
  width: 10px !important; height: 10px !important;
  background: var(--orange) !important;
}

/* ── 4 · round = pressable; facts are flat tags ───────────────────────── */
.preview-chip, .aim-chip, .welcome-path-chips span {
  border-radius: 2px !important;
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--text-muted) !important;
}
.aim-tool-card.featured .preview-chip {
  border-color: rgba(255,255,255,0.28) !important;
  color: rgba(255,255,255,0.8) !important;
}
.aim-library-tag { border-radius: 2px !important; }

/* ── 5 · containers: no decorative icons, no ribbon, calmer radii ─────── */
.aim-tool-icon, .welcome-path-icon { display: none !important; }
.aim-tool-card.program::after { display: none !important; }
:root { --radius-xl: 8px; }

/* ── 6 · AI presence: shown, not announced ────────────────────────────── */
/* The tailored lines are now flat at source in change_process.html and
   reinvent-your-role.html - the old deny-list reset here left their white
   names on a white drawer (exactly the failure mode the rules ban). */

/* the companion is "a doorway, not a beacon" at source now (navigator.js).
   The override that used to force it here is deleted: an !important reset
   naming a component is a bug report, not a fix - and this one produced
   navy-on-navy the moment the label changed. */

/* ── 7 · the confidentiality line earns full weight (report Fix 2) ────── */
.aim-export-sensitive, .cp-sensitive-line {
  font-size: 0.92rem !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  opacity: 1 !important;
}

/* ═══ THE SHEET LIBRARY - the ownable components ══════════════════════ */

/* the guide's voice: navy band, one thought at a time */
.v3-voice {
  background: var(--navy);
  color: #fff; border-radius: 16px; padding: 26px 30px 24px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.09), 0 22px 44px -26px rgba(18,32,52,0.5);
}
.v3-voice .v3-mo { font-size: 0.8rem; font-weight: 700; color: rgba(255,255,255,0.84); margin-bottom: 10px; }
.v3-voice p, .v3-voice h1, .v3-voice h2 { color: #fff; }
.v3-voice .v3-q { color: rgba(255,255,255,0.84); font-weight: 300; }
/* Was a highlighter gradient - an effect built for light grounds, which on
   navy reads as a muddy brown smear (§5.6). On the guide's own ground the
   orange is ink, so the mark is a rule under the words. */
.v3-voice a { color: var(--orange-400, #FFA23A); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; text-decoration-color: rgba(248,135,9,0.55); }
.v3-voice a:focus-visible { outline: 2px solid var(--orange-400, #FFA23A); outline-offset: 3px; }
.v3-voice a:hover { color: #FFC27A; }

/* the work sheet: title block + paper */
.v3-sheet {
  background: var(--v3-sheet); color: var(--text);
  border: 1px solid var(--border); border-radius: 8px;
  padding: 26px 30px 24px; box-shadow: var(--shadow-md); position: relative;
}
.v3-sheet-head { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; flex-wrap: wrap; border-bottom: 2px solid var(--text); padding-bottom: 11px; margin-bottom: 6px; }
.v3-sheet-head h2, .v3-sheet-head h3 { font-size: 1.1rem; font-weight: 900; letter-spacing: -0.01em; margin: 0; }
.v3-sheet-meta { font-size: 0.8rem; font-weight: 600; color: var(--text-muted); }

/* station rows: the drawn process */
.v3-stn { display: grid; grid-template-columns: 30px 190px 1fr; gap: 0 16px; padding: 11px 0; border-bottom: 1px solid var(--border); align-items: baseline; }
.v3-stn:last-child { border-bottom: none; }
.v3-stn .n { font-size: 0.8rem; font-weight: 800; color: var(--text-subtle); }
.v3-stn .t { font-weight: 800; font-size: 0.93rem; }
.v3-stn .d { font-size: 0.85rem; color: var(--text-muted); font-style: italic; }
.v3-stn.rev { background: rgba(248,135,9,0.08); border: 2px solid var(--orange); padding: 9px 12px; margin: 2px -13px; border-radius: 8px; }
.v3-stn.rev .n, .v3-stn.rev .t { color: var(--orange-600, #B05E08); }
.v3-stn.rev .t::after { content: "  · the AI goes here"; font-weight: 700; font-size: 0.8rem; letter-spacing: 0.02em; }
.v3-stn.human { background: repeating-linear-gradient(-45deg, transparent 0 7px, rgba(20,36,58,0.03) 7px 8px); }
.v3-stn.human .d::after { content: "  Stays yours."; font-style: normal; font-weight: 700; color: var(--text); }

/* the promise pin */
.v3-pin {
  display: inline-block; background: var(--v3-due); color: #fff;
  font-size: 0.8rem; font-weight: 800; letter-spacing: 0.02em;
  padding: 6px 12px; border-radius: 4px;
  box-shadow: var(--shadow-sm);
}
.v3-pin.kept { background: var(--v3-kept); }

/* the ink note: the consultant's hand */
.v3-ink { display: flex; gap: 12px; align-items: flex-start; margin-top: 18px; }
.v3-ink p { font-size: 0.94rem; font-style: italic; font-weight: 500; color: var(--orange-600, #B05E08); max-width: 52ch; margin: 0; }

/* ruled answer list - never a chip row; always ends with a write-in */
.v3-answers { border-top: 1px solid var(--border); display: flex; flex-direction: column; max-width: 520px; }
.v3-answers > button, .v3-answers > a {
  text-align: left; font-size: 0.95rem; font-weight: 600; color: var(--text);
  background: none; border: none; border-bottom: 1px solid var(--border);
  padding: 12px 4px; display: flex; align-items: center; gap: 12px;
  cursor: pointer; text-decoration: none;
  transition: color 0.15s, padding-left 0.2s var(--v3-ease);
}
.v3-answers > button::before, .v3-answers > a::before {
  content: ""; width: 8px; height: 8px; flex-shrink: 0; background: var(--navy-200, #95ACC6);
  transition: background 0.15s;
}
.v3-answers > button:hover, .v3-answers > a:hover { color: var(--orange-600, #B05E08); padding-left: 12px; }
.v3-answers > button:hover::before, .v3-answers > a:hover::before { background: var(--orange); }
.v3-own { display: flex; align-items: center; gap: 12px; padding: 9px 4px; border-bottom: 1px solid var(--border); }
.v3-own::before { content: ""; width: 8px; height: 8px; flex-shrink: 0; background: var(--navy-200, #95ACC6); }
.v3-own input { flex: 1; background: transparent; border: none; outline: none; color: var(--text); font-family: inherit; font-size: 0.95rem; font-style: italic; font-weight: 400; min-width: 120px; }
.v3-own input::placeholder { color: var(--text-subtle); }

/* signed echo - never a bubble */
.v3-you { font-size: 0.9rem; font-style: italic; color: var(--text-muted); }
.v3-you::before { content: " - "; color: var(--orange-600, #B05E08); font-style: normal; font-weight: 700; }

/* the contextual page brief (injected by aim-v3.js on reference pages) */
.v3-brief {
  max-width: 1100px; margin: 18px auto 0; padding: 12px 2px 14px;
  border-bottom: 1px solid var(--border);
  font-size: 0.93rem; color: var(--text);
}
.v3-brief::before { content: ""; display: inline-block; width: 10px; height: 10px; background: var(--orange); margin-right: 10px; }
.v3-brief b { font-weight: 700; }
.v3-brief-wrap { padding: 0 28px; }

/* the personal door card on leader pages (report Fix 1) */
.v3-personal-door {
  max-width: 1100px; margin: 26px auto 0; display: flex; justify-content: space-between;
  align-items: center; gap: 18px; flex-wrap: wrap;
  background: var(--v3-sheet); border: 1px solid var(--border);
  border-radius: 8px; padding: 18px 22px; box-shadow: var(--shadow-sm);
}
.v3-personal-door .t { font-weight: 800; font-size: 1.02rem; color: var(--text); }
.v3-personal-door .t::before { content: ""; display: inline-block; width: 10px; height: 10px; background: var(--orange); margin-right: 10px; }
.v3-personal-door .d { font-size: 0.88rem; color: var(--text-muted); margin-top: 2px; }
.v3-personal-door a { font-weight: 700; font-size: 0.92rem; color: var(--orange-600, #B05E08); text-decoration: none; white-space: nowrap; }
.v3-personal-door a:hover { color: var(--orange); }

@media (max-width: 680px) {
  .v3-stn { grid-template-columns: 24px 1fr; }
  .v3-stn .d { grid-column: 2; }
  .v3-sheet { padding: 20px 18px; }
  .v3-voice { padding: 20px 20px 18px; }
}


/* ── 8 · nothing is a capsule: one shape language, 4-8px, product-wide ── */
.aim-mywork-link, .aim-ctx-chip, .aim-nav-pill { border-radius: 6px !important; }

/* ── 9 · page-local rails and uppercase labels V2 pages carry in their own
   CSS (found after the first hunt; the sweep continues) ── */
.rt-how-it-works { border: 1px solid rgba(248,135,9,0.3) !important; border-radius: 8px !important; }
.rt-hiw-label, .rt-fromrole-eye, .rt-thread-num, .rt-step-label,
.rr-step-label, .rr-step-pill, .cp-step-label, .cp-step-pill,
.de-progress-label, .dc2-progress-label {
  text-transform: none !important;
  letter-spacing: 0 !important;
}


/* ═══ THE CONOR LAYER (20 Aug feedback) ═══════════════════════════════ */

/* 1+2 · type up: "beautiful but unwelcoming" - one global lift plus floors
   for the micro-label classes; button labels never below ~0.95rem */
html { font-size: 18px; }
/* The text-size control moves this, and everything is sized in rem off it, so
   the page reflows rather than scaling. 18 is the FLOOR - "smaller" only ever
   returns here. These live in this file rather than shared.css because this is
   the file that sets the real default, and it loads last. */
html[data-textsize="large"] { font-size: 20.5px; }
html[data-textsize="xl"]    { font-size: 23px; }
.aim-btn-primary, .aim-btn-ghost, .aim-btn-ghost-dark { font-size: 0.95rem !important; }
.pb-btn, .cp-sugg, .dc2-chip, .de-chip, .rr-quickpick { font-size: 0.9rem !important; }
.pb-item .tool, .pb-day-cell .cap, .wb-item .k, .rt-fromrole-eye, .rt-thread-num,
.rr-drawer-eye, .cp-nav-badge, .rr-nav-badge, .rt-nav-badge { font-size: 0.8rem !important; }
.pb-item .when { font-size: 0.85rem !important; }

/* 3 · contrast: important lines are not grey whispers */
:root { --text-muted: #46586C; --text-subtle: #5B6B7D; }

/* 6 · headings are one colour; kickers are plain bold text, unornamented */
.aim-hero-title .accent, .aim-section-title .accent, .welcome-path-title .accent,
h1 .accent, h2 .accent, h3 .accent { color: inherit !important; }
.aim-eyebrow::before, .aim-hero-eyebrow::before { display: none !important; }
.v3-brief::before, .v3-personal-door .t::before { display: none !important; }
.v3-brief b { margin-right: 0; }

/* 7 · step labels are text, not boxed pills ("step one doesn't need its
   own box - maybe the claudiest thing of all") */
.rt-step-label, .rr-step-label, .cp-step-label, .rr-step-pill, .cp-step-pill {
  border: none !important; background: transparent !important;
  padding: 0 !important; box-shadow: none !important;
  font-size: 0.85rem !important;
}


/* 10 · the context chip never truncates-and-wraps (persona-report defect);
   capsule flattened (it used 100px radius, dodging the 999px sweep) */
.aim-ctx-chip { max-width: 260px; border-radius: 6px !important; flex-wrap: nowrap !important; white-space: nowrap; }
.aim-ctx-chip > span:first-child, .aim-ctx-chip .ctx-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 150px; }
@media (max-width: 900px) { .aim-ctx-chip { max-width: 150px; } .aim-ctx-chip > span:first-child { max-width: 90px; } }


/* ── field-test round: press states, small-screen chip, ink fixes ────────── */
/* "Tap-and-go" should feel like it (CP11e): every chip and quiet button gets
   a real press state, not just the one primary. */
.cp-sugg:active, .dc2-chip:active, .rr-quickpick:active, .pb-btn:active,
.aim-export-btn:active, .wg-browse:active, .cp-examples-btn:active,
.aim-nav-sugg:active, .rr-brief-check:active, .cp-cal button:active,
.aim-org-btn:active, .aim-org-infer-btn:active {
  transform: scale(0.97);
}
@media (prefers-reduced-motion: reduce) {
  .cp-sugg:active, .dc2-chip:active, .rr-quickpick:active, .pb-btn:active,
  .aim-export-btn:active, .wg-browse:active, .cp-examples-btn:active,
  .aim-nav-sugg:active, .rr-brief-check:active, .cp-cal button:active,
  .aim-org-btn:active, .aim-org-infer-btn:active { transform: none; }
}
/* On a phone the company name wins over the guessed industry - "M… ·
   Healthcare" clipped the one piece of identity the fitting earns (CP11f). */
@media (max-width: 480px) {
  .aim-ctx-chip .ctx-sub { display: none; }
}
/* These five were the last places orange was used as small TEXT on a light
   ground. The rule since 25 Aug is that orange on light is a fill, a mark or
   a rule - never words - so they are navy, and this override is what was
   keeping them orange despite their own stylesheets already saying navy.
   Deleting the rule rather than repainting it: the source rules are correct
   now, and an !important that names components is a bug report, not a fix. */

/* Small screens: the Profile item is icon-only like its neighbours (the
   company name lives in its tooltip and drawer now), and the floating
   companion stacks above the data badge instead of colliding with it. */
@media (max-width: 480px) {
  .aim-ctx-chip { padding: 6px 10px; }
}
@media (max-width: 560px) {
  .aim-nav-companion { bottom: 72px !important; }
}

/* ── Focus, reinforced ────────────────────────────────────────────────
   The house focus ring lives in shared.css, but several components inject
   their <style> at runtime and therefore win on source order, dropping back
   to the browser's default ring. This is a base rule, not a component
   deny-list reset: it names no component, it only restates the ring with
   enough specificity to survive a late stylesheet. */
body :focus-visible {
  outline: 3px solid var(--navy);
  outline-offset: 2px;
}
.aim-topbar :focus-visible,
.aim-hero-navy :focus-visible,
.aim-footer :focus-visible,
.wg-stage :focus-visible,
.aim-nav-panel :focus-visible,
.aim-export-bar :focus-visible,
.v3-voice :focus-visible {
  outline: 3px solid var(--orange-400);
  outline-offset: 2px;
}
/* ── The Map (4 Sep call; built 7 Sep - replaces "Your route") - built by
   navigator.js enhanceTopNav(). The third of the top bar's three constants
   (My Work · Profile · Map) opens a full-width sheet under the header: the
   whole Studio on one page. A map shows where things are and where you
   have been - pins, never suggestions; the suggestion lives on Welcome as
   Next up. Click to open, Escape / scrim / Close to close. The sheet is
   the light ground (white is the work; navy stays the room around it). */
.aim-topbar-right .aim-route-btn {
  font: inherit; font-size: 0.85rem; font-weight: 500; line-height: 1.2; white-space: nowrap;
  color: rgba(255,255,255,0.85); background: none; cursor: pointer;
  padding: 8px 14px; border-radius: var(--radius-lg, 8px);
  border: 1px solid rgba(255,255,255,0.25);
  transition: color 0.2s, background 0.2s, border-color 0.2s;
}
.aim-topbar-right .aim-route-btn:hover { background: rgba(255,255,255,0.06); border-color: #fff; color: #fff; }
.aim-topbar-right .aim-route-btn.open { background: rgba(255,255,255,0.14); border-color: #fff; color: #fff; }
.aim-topbar-right .aim-route-btn:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }
.aim-route-scrim { position: fixed; left: 0; right: 0; bottom: 0; top: 0; background: rgba(14,24,38,0.42); z-index: 98; }
.aim-route {
  position: fixed; left: 0; right: 0; top: 0; z-index: 99;
  max-height: 100vh; overflow: auto; overscroll-behavior: contain;
  background: var(--off-white, #F7F8FA); color: var(--text); border-bottom: 1px solid var(--border);
  box-shadow: 0 24px 48px -12px rgba(14,24,38,0.28);
  padding: 26px 28px 16px;
}
.aim-route[hidden], .aim-route-scrim[hidden] { display: none; }
.aim-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.aim-route-cols { display: grid; grid-template-columns: 1fr 1.5fr; gap: 44px; max-width: 1400px; align-items: start; }
/* 0.85rem, not 0.75: the phone pass measured these under the 14px floor */
.aim-route-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 0.85rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); margin: 0 0 12px; }
.aim-route-eyebrow a { color: inherit; text-decoration: none; }
.aim-route-eyebrow a:hover { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }

/* ── Wayfinding color (Conor, 7 Sep email: the sheet read as "a sea of
   gray"). The proposal deck's own grammar: white boxes, a colored top
   edge, a matching dot - one color per area, so the eye sorts the sheet
   before reading a word. Every hue is already in the system: the brand
   orange for your own work; navy, the kept-green (#2E6B4F), the slate
   navy-300 and the legacy orange-600 rust for the four leader tracks.
   Color marks PLACE here, never text - inks stay navy/muted. ── */
.aim-map-box {
  background: #fff; border: 1px solid var(--border); border-top: 3px solid var(--navy);
  border-radius: 10px; padding: 16px 18px 14px;
}
.aim-map-box.mk-you { border-top-color: var(--orange); }
.aim-route-eyebrow .dot, .aim-route-hub .dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--navy);
  display: inline-block; flex-shrink: 0;
}
.mk-you .aim-route-eyebrow .dot { background: var(--orange); }
.aim-route-track.mk-strategy { border-top-color: var(--navy); }
.aim-route-track.mk-strategy .dot { background: var(--navy); }
.aim-route-track.mk-enablement { border-top-color: var(--navy-300, #6882A4); }
.aim-route-track.mk-enablement .dot { background: var(--navy-300, #6882A4); }
.aim-route-track.mk-talent { border-top-color: #2E6B4F; }
.aim-route-track.mk-talent .dot { background: #2E6B4F; }
.aim-route-track.mk-org_structure { border-top-color: var(--orange-600, #B05E08); }
.aim-route-track.mk-org_structure .dot { background: var(--orange-600, #B05E08); }

/* your own rows sit inside the white box, so they take the sheet's ground */
.aim-map-rows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.aim-map-row {
  display: block; background: var(--off-white, #F7F8FA); border: 1px solid var(--border); border-radius: 10px;
  padding: 11px 16px; text-decoration: none; color: var(--text);
  transition: border-color .15s;
}
.aim-map-row:hover { border-color: var(--navy-200, #95ACC6); }
.aim-map-row b { display: block; font-size: 0.92rem; font-weight: 800; line-height: 1.3; }
.aim-map-row > span:not(.aim-map-pins) { display: block; font-size: 0.82rem; color: var(--text-muted); line-height: 1.45; margin-top: 1px; }
.aim-map-row[aria-current="page"] { box-shadow: inset 3px 0 0 var(--orange); }
.aim-map-pins { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 7px; }

/* the pins - state shown, never suggested. On this light ground the
   orange is a FILL carrying a navy label, never text. */
.aim-map-pin { font-size: 0.8rem; font-weight: 700; border-radius: 999px; padding: 1.5px 10px; white-space: nowrap; }
.aim-map-pin.here { background: var(--orange-fill, #F88709); color: var(--on-orange, #1E2E42); }
.aim-map-pin.open { background: var(--navy-050, #E8EDF3); color: var(--navy-600, #243852); }
.aim-map-pin.done { display: inline-flex; align-items: center; gap: 6px; padding: 0; color: var(--text-muted); }
.aim-map-pin.done i { width: 15px; height: 15px; background: var(--orange-fill, #F88709); color: var(--on-orange, #1E2E42); display: inline-flex; align-items: center; justify-content: center; border-radius: 2px; }
.aim-map-pin.done i svg { width: 10px; height: 10px; }
/* a pin inside a row title sits beside the name */
.aim-map-row b .aim-map-pin, .aim-route-list b .aim-map-pin { margin-left: 10px; }
.aim-route-eyebrow .aim-map-pin, .aim-map-plaque .aim-map-pin { letter-spacing: 0; text-transform: none; }

/* the leader wing */
.aim-map-plaque {
  background: #fff; border: 1px solid var(--border); border-radius: 10px;
  padding: 11px 16px; font-size: 0.9rem; color: var(--text-muted); margin: 0 0 16px;
}
.aim-map-plaque a {
  color: var(--ink-link, #1E2E42); font-weight: 700; text-decoration: underline;
  text-decoration-color: var(--link-rule, rgba(30,46,66,0.35)); text-underline-offset: 3px;
}
.aim-map-tracks { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; }
.aim-route-track {
  margin: 0; background: #fff; border: 1px solid var(--border); border-top: 3px solid var(--navy);
  border-radius: 8px; padding: 11px 14px 9px;
}
.aim-route-hub { display: flex; align-items: center; gap: 8px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); padding: 0 0 6px; text-decoration: none; }
.aim-route-hub:hover { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.aim-route-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.aim-route-list a { display: block; padding: 5px 8px; margin: 0 -8px; border-radius: 8px; text-decoration: none; color: var(--text); }
.aim-route-list a:hover { background: var(--navy-050, #E8EDF3); }
.aim-route-list a b { display: block; font-size: 0.9rem; font-weight: 700; line-height: 1.3; }
.aim-route-list a span { display: block; font-size: 0.8rem; color: var(--text-muted); line-height: 1.4; margin-top: 1px; }
.aim-route-list a[aria-current="page"] { box-shadow: inset 3px 0 0 var(--orange); background: var(--navy-050, #E8EDF3); }

/* the library shelf */
.aim-map-shelf {
  border-top: 1px solid var(--border); margin-top: 22px; padding-top: 14px;
  display: flex; align-items: baseline; gap: 10px 22px; flex-wrap: wrap; max-width: 1400px;
}
.aim-map-shelf .aim-route-eyebrow { margin: 0; }
.aim-map-shelf a {
  font-size: 0.85rem; color: var(--text); text-decoration: underline;
  text-decoration-color: var(--link-rule, rgba(30,46,66,0.35)); text-underline-offset: 3px;
}
.aim-map-shelf a[aria-current="page"] { font-weight: 700; }
.aim-map-shelf a.aim-route-more { font-weight: 700; }

/* foot */
.aim-route-link {
  color: var(--ink-link, #1E2E42); font: inherit; font-weight: 700; background: none; border: 0; padding: 0; cursor: pointer;
  text-decoration: underline; text-decoration-color: var(--link-rule, rgba(30,46,66,0.35)); text-underline-offset: 3px;
}
.aim-route-foot { display: flex; justify-content: space-between; align-items: center; gap: 20px; border-top: 1px solid var(--border); margin-top: 14px; padding-top: 12px; font-size: 0.85rem; color: var(--text-muted); max-width: 1400px; }
.aim-route-ask-wrap { display: inline-flex; align-items: center; gap: 8px; }
.aim-route-nvm { width: 18px; height: 18px; border-radius: 50%; background: var(--navy); position: relative; display: inline-block; }
.aim-route-nvm::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--orange); }
.aim-route-close { font: inherit; font-size: 0.82rem; color: var(--text-muted); background: none; border: 1px solid var(--border); border-radius: 8px; padding: 5px 14px; cursor: pointer; }
.aim-route-close:hover { color: var(--text); border-color: var(--navy-200, #95ACC6); }
.aim-route a:focus-visible, .aim-route button:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }
@media (max-width: 1100px) {
  .aim-route-cols { grid-template-columns: 1fr 1.3fr; gap: 32px; }
  .aim-map-tracks { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  /* everything stays visible - the map stacks, nothing folds away. The
     extra bottom padding keeps the foot links clear of the floating
     Ask-the-Navigator pill (9 Sep phone pass: the pill covered them). */
  .aim-route { padding: 18px 14px 72px; }
  .aim-route-cols { display: flex; flex-direction: column; gap: 24px; }
  .aim-route-foot { flex-direction: column; align-items: flex-start; gap: 10px; }
}