/* THE SECOND CHAMBERS HOME · THE FINDINGS · master/css/master-findings.css · 13 Oct 2026
   Rania: "The findings are the examples of what it pulls." Ten findings, each in the seven steps of 1l, the index at the left staying while
   they scroll. In the home's own dress (master-airy.css): white and the cool pale, Inter, the 12px corner, ink; no colour but ink and the
   grey. Scoped to body.airy. */
body.airy {
  .fd-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); column-gap: clamp(32px, 5vw, 80px); align-items: start; }
  .fd-sticky { position: sticky; top: 120px; }
  .fd-index { margin: 26px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--ay-line); }
  .fd-index li { border-bottom: 1px solid var(--ay-line); }
  .fd-index a { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 9px 4px; text-decoration: none; color: var(--ay-grey); transition: color .25s, background .25s; }
  .fd-index a i { font: 500 12px/1 var(--font); font-style: normal; letter-spacing: .08em; }
  .fd-index a b { font: 500 16px/1.3 var(--font); letter-spacing: -.01em; color: inherit; }
  .fd-index a span { font-size: 13px; font-variant-numeric: tabular-nums; }
  .fd-index a:hover, .fd-index li.on a { color: var(--ink); }
  .fd-index li.on a { background: linear-gradient(90deg, var(--ay-tint), transparent); margin-inline: -10px; padding-inline: 14px; }

  .fd-list { display: flex; flex-direction: column; gap: clamp(26px, 3vw, 44px); min-width: 0; }
  .fd { background: #fff; border: 1px solid var(--ay-line); border-radius: 16px; box-shadow: var(--ay-shadow); overflow: hidden; }
  .ay-paper .fd { box-shadow: none; }
  .fd-head { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 16px; align-items: start; padding: 26px 28px 22px; border-bottom: 1px solid var(--ay-line); }
  .fd-n { font: 500 13px/1.7 var(--font); letter-spacing: .08em; color: var(--ay-grey); }
  .fd-title h3 { margin: 0; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.12; letter-spacing: -.02em; color: var(--ink); }
  .fd-title p { margin: 8px 0 0; max-width: 52ch; font-size: 15px; line-height: 1.55; color: var(--ink-2); }
  .fd-count { text-align: right; padding-left: 12px; }
  .fd-count b { display: block; font: 300 clamp(40px, 4vw, 62px)/1 var(--font); letter-spacing: -.04em; color: var(--ink); font-variant-numeric: tabular-nums; }
  .fd-count span { display: block; margin-top: 8px; max-width: 22ch; margin-left: auto; font-size: 13px; line-height: 1.4; color: var(--ay-grey); }

  .fd-body { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); }
  .fd-steps { padding: 6px 28px 10px; border-right: 1px solid var(--ay-line); }
  .fd-step { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--ay-line); }
  .fd-step:last-child { border-bottom: 0; }
  .fd-step i { font: 500 12px/1.9 var(--font); font-style: normal; letter-spacing: .08em; color: var(--ay-grey); }
  .fd-step h4 { margin: 0 0 6px; font: 500 12px/1.6 var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ay-grey); }
  .fd-step p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink-2); }
  .fd-step p + p { margin-top: 6px; }
  .fd-absent { color: var(--ay-grey); font-style: italic; }
  .fd-say { font-size: 19px !important; line-height: 1.4 !important; letter-spacing: -.01em; color: var(--ink) !important; }
  .fd-sum { font: 500 22px/1 var(--font); letter-spacing: -.02em; color: var(--ink); font-variant-numeric: tabular-nums; }
  .fd-q { margin: 0; padding: 14px 18px; background: var(--ay-tint); border-radius: 10px; }
  .fd-q p { margin: 0; font-family: var(--serif, Georgia, serif); font-size: 18px; line-height: 1.5; color: var(--ink); }
  .fd-q footer { margin-top: 10px; font-size: 13px; line-height: 1.5; color: var(--ink-2); }
  .fd-q footer span { display: block; color: var(--ay-grey); }
  .fd-theirs { display: flex; flex-direction: column; gap: 10px; }
  .fd-their { display: grid !important; grid-template-columns: 92px minmax(0, 1fr); gap: 4px 12px; padding: 10px 14px; background: var(--ay-tint); border-radius: 10px; }
  .fd-their-d { font-size: 12px; letter-spacing: .04em; color: var(--ay-grey); font-variant-numeric: tabular-nums; padding-top: 3px; }
  .fd-their b { grid-column: 2; font-weight: 500; color: var(--ink); }
  .fd-their-t { grid-column: 2; }
  .fd-their { font-size: 14px !important; }
  .fd-fine { font-size: 13px !important; color: var(--ay-grey) !important; }
  .fd-pair { display: grid !important; grid-template-columns: auto minmax(0, 1fr); gap: 2px 14px; align-items: baseline; }
  .fd-pair b { font: 300 26px/1 var(--font); letter-spacing: -.03em; color: var(--ink); font-variant-numeric: tabular-nums; }
  .fd-pair span { font-size: 14px; color: var(--ink-2); }
  .fd-share { height: 10px; margin: 2px 0 8px; background: var(--ay-tint-2); border-radius: 999px; overflow: hidden; }
  .fd-share i { display: block; height: 100%; width: var(--p); background: var(--ink); border-radius: 999px; }
  .fd-share-k { font-size: 14px !important; color: var(--ink-2) !important; }
  .fd-share-k b { color: var(--ink); }

  .fd-side { display: flex; flex-direction: column; gap: 16px; padding: 22px 24px 24px; background: var(--ay-tint); }
  .ay-paper .fd-side { background: #fff; }
  .fd-graph { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 9px; }
  .fd-graph li { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .fd-bar-k { font-size: 13px; line-height: 1.3; color: var(--ink-2); }
  .fd-bar-track { display: block; height: 10px; background: rgba(11, 11, 14, .08); border-radius: 999px; overflow: hidden; }
  .fd-bar-track i { display: block; height: 100%; width: var(--w); min-width: 3px; background: var(--ink); border-radius: 999px; }
  .fd-bar-v { font-size: 13px; line-height: 1; color: var(--ink); font-variant-numeric: tabular-nums; }
  .fd-graph li { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "k v" "bar bar"; align-items: end; }
  .fd-graph .fd-bar-k { grid-area: k; } .fd-graph .fd-bar-v { grid-area: v; } .fd-graph .fd-bar-track { grid-area: bar; }
  .fd-out { margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--ay-line); font-size: 14px; line-height: 1.55; color: var(--ink-2); }
  .fd-out i { display: block; margin-bottom: 4px; font: 500 11px/1.5 var(--font); font-style: normal; letter-spacing: .08em; text-transform: uppercase; color: var(--ay-grey); }
  .fd-side .ay-more { align-self: flex-start; }

  @media (max-width: 1100px) { .fd-body { grid-template-columns: minmax(0, 1fr); } .fd-steps { border-right: 0; border-bottom: 1px solid var(--ay-line); } }
  @media (max-width: 1024px) {
    .fd-two { grid-template-columns: minmax(0, 1fr); row-gap: 30px; }
    .fd-sticky { position: static; }
    .fd-index { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
  }
  @media (max-width: 640px) {
    .fd-head { grid-template-columns: 30px minmax(0, 1fr); padding: 20px 18px 16px; }
    .fd-count { grid-column: 2; text-align: left; padding-left: 0; }
    .fd-count span { margin-left: 0; }
    .fd-steps { padding: 4px 18px 8px; }
    .fd-side { padding: 18px; }
    .fd-index { grid-template-columns: minmax(0, 1fr); }
    .fd-their { grid-template-columns: minmax(0, 1fr); }
    .fd-their b, .fd-their-t { grid-column: 1; }
  }
}

/* THE FINDINGS AS A DECK (14 Oct 2026): one card at a time; the turn at its foot */
.fd-deck > .fd:not(.fd-on) { display: none; }
.fd-deck > .fd.fd-enter { animation: fd-in .45s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes fd-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.fd-turn { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; padding: 18px clamp(18px, 2.4vw, 28px); border-top: 1px solid var(--ay-line); background: #FAFAFB; font-size: 14px; }
.fd-turn a { color: #0B0B0E; text-decoration: none; font-weight: 500; }
.fd-turn a:hover, .fd-turn a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.fd-turn small { font: 500 11px/1 ui-monospace, "SF Mono", Menlo, monospace; color: #6B6E78; letter-spacing: .04em; margin: 0 4px; }
.fd-turn-prev { justify-self: start; color: #4A4D57 !important; }
.fd-turn-next { justify-self: end; text-align: right; white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; padding: 10px 14px; border-radius: 999px; background: #0B0B0E; color: #fff !important; }
.fd-turn-next small { color: #B9BCC6; }
.fd-turn-count { font: 500 12px/1 ui-monospace, "SF Mono", Menlo, monospace; color: #6B6E78; }
.fd-index li a[aria-current="true"] { color: #0B0B0E; }
@media (max-width: 700px) { .fd-turn { grid-template-columns: 1fr; justify-items: stretch; text-align: center; } .fd-turn-prev, .fd-turn-next { justify-self: center; } .fd-turn-count { order: -1; } }
@media (prefers-reduced-motion: reduce) { .fd-deck > .fd.fd-enter { animation: none; } }

/* THE FINDINGS' CHIPS (14 Oct 2026): the index as a row of chips, stuck under the header, from 1024 down; the list above stands aside */
.fd-chips { display: none; }
@media (max-width: 1024px) {
  .fd-chips { display: flex; gap: 8px; position: sticky; top: 68px; z-index: 5; margin: 0 -16px 18px; padding: 10px 16px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
    background: rgba(244, 244, 247, .92); -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--ay-line); }
  .fd-chips::-webkit-scrollbar { display: none; }
  .fd-chips a { flex: 0 0 auto; padding: 8px 14px; border-radius: 999px; border: 1px solid #D6D7DE; background: #fff; color: #3A3D47; font: 500 14px/1 Inter, system-ui, sans-serif; text-decoration: none; white-space: nowrap; }
  .fd-chips a i { font: 500 11px/1 ui-monospace, "SF Mono", Menlo, monospace; font-style: normal; color: #8A8D97; margin-right: 4px; }
  .fd-chips a.on { background: #0B0B0E; border-color: #0B0B0E; color: #fff; }
  .fd-chips a.on i { color: #B9BCC6; }
  .fd-findings:has(.fd-chips) .fd-index { display: none; }
}