/* v47.1 — site architecture: What we do dropdown, homepage challenge strip,
   visible breadcrumbs, cross-link blocks, footer capabilities column.
   Scoped to new class names only; no existing rule is overridden except
   where noted (nav__links vertical stretch, footer grid at >=720px). */

/* ---------- Desktop dropdown (>=1300px, where the desktop nav shows) ---------- */
.nav__inner { position: relative; }
.nav__links[data-astro-cid-dmqpwcec] { align-self: stretch; align-items: center; }
.dd { display: flex; align-items: center; align-self: stretch; gap: .15rem; }
.dd__btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; padding: 0; border: 0; border-radius: 6px;
  background: none; color: var(--silver); cursor: pointer;
  transition: color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.dd__btn:hover, .dd__btn[aria-expanded="true"] { color: var(--white); }
.dd__btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.dd__btn svg { transition: transform var(--dur-fast) var(--ease-out); }
.dd__btn:focus-visible { outline: 2px solid var(--brand-cyan-lt); outline-offset: 2px; }

.dd__panel {
  display: none;
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  width: min(1040px, calc(100vw - 4rem));
  grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.25rem;
  padding: 1.75rem 2rem 1.6rem;
  background: rgba(14, 16, 40, .97);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, .1); border-radius: 12px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
  z-index: 110;
}
.dd[data-open] .dd__panel { display: grid; }
@media (hover: hover) and (min-width: 1300px) {
  .dd:hover .dd__panel { display: grid; }
  .dd:hover .dd__btn svg { transform: rotate(180deg); }
}
.dd__head { margin: 0 0 .8rem; color: var(--silver); }
.dd__col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.dd__col li a {
  display: block; padding: .38rem 0; color: var(--light); font-size: .95rem; line-height: 1.35;
  transition: color var(--dur-fast) var(--ease-out);
}
.dd__col li a:hover, .dd__col li a:focus-visible { color: var(--white); text-decoration: underline; text-underline-offset: 3px; }
.dd__all {
  display: inline-block; margin-top: .9rem; padding-top: .7rem;
  border-top: 1px solid rgba(255, 255, 255, .1);
  color: var(--brand-cyan-lt); font-size: .9rem;
}
.dd__all:hover { color: var(--white); }
.dd__col + .dd__col { border-inline-start: 1px solid rgba(255, 255, 255, .08); padding-inline-start: 2.25rem; }

/* ---------- Mobile menu: "What we do" as an accordion ---------- */
.mdd { border-bottom: 1px solid rgba(255, 255, 255, .08); }
.mdd > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; border-bottom: 0 !important; }
.mdd > summary::-webkit-details-marker { display: none; }
.mdd > summary::after {
  content: ""; width: 9px; height: 9px; margin-inline-end: 4px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-3px); transition: transform var(--dur-fast) var(--ease-out);
}
.mdd[open] > summary::after { transform: rotate(-135deg) translateY(-2px); }
.mdd__body { padding: 0 0 1rem; display: flex; flex-direction: column; }
.mdd__overview { color: var(--brand-cyan-lt); padding: .35rem 0 .6rem; font-size: 1rem; }
.mdd__head { margin: .9rem 0 .35rem; color: var(--silver); }
.mdd__body ul { list-style: none; margin: 0; padding: 0; }
.mdd__body li a { display: block; padding: .45rem 0; color: var(--light); font-size: 1rem; }

/* ---------- Homepage: "Or start from the problem" (under the Six ways list; the band is light since v41) ---------- */
.wwd .probs { margin-top: clamp(2.75rem, 5vw, 4rem); }
.wwd .probs__label { margin: 0 0 1.1rem; }
.wwd .probs__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 0 2.5rem; }
@media (min-width: 720px) { .wwd .probs__list { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .wwd .probs__list { grid-template-columns: 1fr 1fr 1fr; } }
.wwd .probs__list a {
  display: flex; gap: .9rem; align-items: baseline; height: 100%;
  padding: .85rem 0; border-bottom: 1px solid rgba(15, 16, 32, .08);
  color: #0f1020; font-weight: 500; font-size: var(--step-0); line-height: 1.4;
}
.wwd .probs__list a:hover { color: var(--brand-indigo); }
.wwd .probs__list a:hover .probs__t { text-decoration: underline; text-underline-offset: 4px; }
.wwd .probs__n { color: var(--brand-indigo); flex: none; font-weight: 400; }
.wwd .probs__all { display: inline-block; margin-top: 1.4rem; }

/* ---------- Visible breadcrumbs (replace the kicker / back link, same type) ---------- */
.crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; }
.crumbs li + li::before { content: "/"; margin-inline: .6em; opacity: .55; }
.crumbs a { color: inherit; text-decoration: none; }
.crumbs a:hover { color: var(--white); text-decoration: underline; text-underline-offset: 3px; }
.ins-hero .crumbs { margin-bottom: 1.1rem; }

/* ---------- People: field notes under the author's card ---------- */
.person__notes { margin: .9rem 0 0; }
.person__notes .mono-label { display: block; margin-bottom: .35rem; }
.person__notes ul { list-style: none; margin: 0; padding: 0; }
.person__notes li a { display: inline-block; padding: .2rem 0; line-height: 1.45; }

/* ---------- Footer: Capabilities column ---------- */
@media (min-width: 720px) {
  .footer .footer__grid[data-astro-cid-sz7xmlte] { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1100px) {
  .footer .footer__grid[data-astro-cid-sz7xmlte] { grid-template-columns: 1.3fr 1fr 1fr 1fr; }
}
