/* Home page band for the assessment app (audit.withswitchboard.com). Sits inside the
   scaled #stage like its neighbours. Card language: 1.5px ink outline, offset shadow,
   pastel fills. Copy comes from the app itself (see sb-audit/docs/marketing-site-handoff.md). */
.aud { padding: 20px var(--pad, 24px) 110px; }
.aud__card { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.05fr .95fr; align-items: stretch; background: #fdfcf8; border: 1.5px solid #000; border-radius: 22px; box-shadow: 12px 12px 0 -2px rgba(0,0,0,.06); overflow: hidden; }
.aud__copy { padding: 52px 56px 52px 56px; display: flex; flex-direction: column; gap: 18px; }
.aud__copy .eyebrow { margin: 0; }
.aud__title { margin: 0; font: 500 clamp(30px, 3.2vw, 42px)/1.12 "Neue Montreal", system-ui, sans-serif; letter-spacing: -.02em; color: #000; text-wrap: balance; }
.aud__lead { margin: 0; font: 400 18px/1.5 "Neue Montreal", system-ui, sans-serif; color: var(--muted, #656567); max-width: 46ch; }
.aud__list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 12px; }
.aud__list li { position: relative; padding-left: 26px; font: 400 15.5px/1.5 "Neue Montreal", system-ui, sans-serif; color: var(--muted, #656567); max-width: 52ch; }
.aud__list li::before { content: ""; position: absolute; left: 0; top: 5px; width: 13px; height: 13px; border: 1.5px solid #000; border-radius: 50%; background: var(--blue-light, #c6dbff); }
.aud__list b { font-weight: 500; color: #000; }
.aud__actions { margin-top: 10px; }
.aud__art { background: #eef3fd; border-left: 1.5px solid #000; display: flex; align-items: center; justify-content: center; padding: 36px 32px; }
.aud__art svg { display: block; width: 100%; max-width: 460px; height: auto; overflow: visible; }
.aud__fig { transform-box: fill-box; transform-origin: center bottom; }
@media (prefers-reduced-motion: no-preference) {
  .aud__fig { animation: aud-bob 4.6s ease-in-out infinite; animation-delay: calc(var(--k, 0) * -1.3s); }
  .aud__next { animation: aud-next 4.6s ease-in-out infinite; }
}
@keyframes aud-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes aud-next { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@media (max-width: 900px) {
  .aud { padding: 10px var(--pad, 24px) 80px; }
  .aud__card { grid-template-columns: 1fr; }
  .aud__copy { padding: 34px 26px 30px; }
  .aud__art { border-left: 0; border-top: 1.5px solid #000; padding: 26px 22px; }
}

/* Slim nudge used on the Jumpstart and Studio pages, between Scopes and How it works. */
.aud-nudge { padding: 0 var(--pad, 24px) 84px; }
.aud-nudge__card { max-width: 860px; margin: 0 auto; display: flex; align-items: center; gap: 22px; padding: 16px 22px 16px 18px; background: #fdfcf8; border: 1.5px solid #000; border-radius: 16px; box-shadow: 10px 10px 0 -2px rgba(0,0,0,.06); color: #000; text-decoration: none; transition: transform .25s var(--ease, ease), box-shadow .25s var(--ease, ease); }
.aud-nudge__card:hover { transform: translate(-2px, -2px); box-shadow: 12px 12px 0 -2px rgba(0,0,0,.08); }
.aud-nudge__art { flex: 0 0 96px; }
.aud-nudge__art svg { display: block; width: 96px; height: 56px; overflow: visible; }
.aud-nudge__text { flex: 1; font: 400 15.5px/1.5 "Neue Montreal", system-ui, sans-serif; color: var(--muted, #656567); }
.aud-nudge__text b { font-weight: 500; color: #000; }
.aud-nudge__go { flex: 0 0 auto; font: 500 15px/1.3 "Neue Montreal", system-ui, sans-serif; color: var(--blue, #397ae7); white-space: nowrap; }
.aud-nudge__card:hover .aud-nudge__go { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 760px) {
  .aud-nudge { padding-bottom: 64px; }
  .aud-nudge__card { flex-wrap: wrap; gap: 12px 16px; }
  .aud-nudge__text { flex-basis: calc(100% - 112px); }
  .aud-nudge__go { flex-basis: 100%; padding-left: 112px; }
}
