/* FINLY's light editorial chapters. Shared shell, hero and motion live separately. */
body.finly-clarity .clarity-chapter {
  position: relative;
  padding-block: clamp(76px, 9.3vw, 144px);
  color: var(--fin-navy);
  background: var(--fin-surface);
}

body.finly-clarity .clarity-chapter-top {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-block-end: clamp(44px, 5.6vw, 80px);
  color: var(--fin-text-muted);
  font-size: 14px;
  line-height: 1.5;
}

body.finly-clarity .clarity-index {
  flex-shrink: 0;
  color: var(--fin-blue);
  font-size: 14px;
  font-weight: 650;
}

body.finly-clarity .clarity-rule {
  flex: 1;
  min-inline-size: 20px;
  block-size: 1px;
  background: var(--fin-grad);
}

body.finly-clarity .clarity-chapter h2 {
  margin: 0;
  color: var(--fin-blue);
  font-family: var(--fin-font-display);
  font-size: clamp(44px, 5.25vw, 76px);
  font-weight: 600;
  line-height: 1.085;
  letter-spacing: -.055em;
  text-wrap: balance;
}

body.finly-clarity .clarity-chapter h2 em {
  color: var(--fin-teal-ink);
  font-style: normal;
  font-weight: inherit;
}

body.finly-clarity .clarity-lead {
  max-inline-size: 460px;
  margin: 25px 0 0;
  color: var(--fin-text-soft);
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.8;
  text-wrap: pretty;
}

body.finly-clarity .clarity-editorial-grid {
  display: grid;
  grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr);
  align-items: center;
  gap: clamp(38px, 7vw, 108px);
}

body.finly-clarity .clarity-editorial-copy {
  min-inline-size: 0;
}

body.finly-clarity .clarity-insights {
  display: grid;
  gap: 0;
  max-inline-size: 440px;
  margin-block-start: 34px;
}

body.finly-clarity .clarity-insights > div {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 15px;
  padding-block: 18px;
  border-block-start: 1px solid var(--fin-line);
}

body.finly-clarity .clarity-insights > div > span {
  padding-block-start: 3px;
  color: var(--fin-teal-ink);
  font-family: var(--fin-font-display);
  font-size: 14px;
  font-weight: 450;
  font-variant-numeric: tabular-nums;
}

body.finly-clarity .clarity-insights p {
  margin: 0;
  color: var(--fin-text-soft);
  font-size: 15px;
  line-height: 1.65;
}

body.finly-clarity .clarity-insights b {
  display: block;
  margin-block-end: 3px;
  color: var(--fin-navy);
  font-size: 17px;
  font-weight: 600;
}

/* One paper ledger provides a tangible view of the underlying mortgage. */
body.finly-clarity .clarity-ledger {
  position: relative;
  isolation: isolate;
  min-inline-size: 0;
  margin: 0;
  padding: clamp(22px, 3vw, 40px);
  border: 1px solid #dfe7ed;
  border-radius: 4px;
  background: var(--fin-surface);
  box-shadow: 0 32px 70px -26px rgba(9, 45, 100, .17), 0 2px 5px rgba(9, 45, 100, .025);
  text-align: start;
}

body.finly-clarity .clarity-ledger::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 12px -9px -12px 9px;
  border: 1px solid #e5ecf2;
  border-radius: 4px;
  background: #f8fbfd;
  transform: rotate(-1.6deg);
}

body.finly-clarity .clarity-ledger::after {
  content: "";
  position: absolute;
  inset-block-start: -1px;
  inset-inline-start: -1px;
  inline-size: 80px;
  block-size: 3px;
  background: var(--fin-grad);
}

body.finly-clarity .clarity-ledger-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

body.finly-clarity .clarity-ledger-head > div {
  min-inline-size: 0;
}

body.finly-clarity .clarity-ledger-head > div > span {
  display: block;
  color: var(--fin-text-soft);
  font-size: 15px;
}

body.finly-clarity .clarity-ledger-head strong {
  display: block;
  margin-block-start: 8px;
  color: var(--fin-navy);
  font-family: var(--fin-font-display);
  font-size: clamp(30px, 3.25vw, 44px);
  font-weight: 480;
  line-height: 1.1;
  letter-spacing: -.045em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  text-align: start;
}

body.finly-clarity .clarity-sample {
  flex-shrink: 0;
  padding-block: 3px;
  border-block-end: 1px solid var(--fin-line);
  color: var(--fin-text-muted);
  font-size: 14px;
}

body.finly-clarity .clarity-allocation {
  display: flex;
  gap: 4px;
  block-size: 10px;
  margin-block-start: 29px;
  overflow: hidden;
  border-radius: 2px;
}

body.finly-clarity .clarity-allocation i:nth-child(1) {
  flex: 25.7;
  background: var(--fin-teal);
}

body.finly-clarity .clarity-allocation i:nth-child(2) {
  flex: 37.5;
  background: var(--fin-blue);
}

body.finly-clarity .clarity-allocation i:nth-child(3) {
  flex: 36.8;
  background: var(--fin-blue-300);
}

body.finly-clarity .clarity-ledger-subtitle {
  margin: 10px 0 22px;
  color: var(--fin-text-muted);
  font-size: 14px;
}

body.finly-clarity .clarity-ledger .fin-track-list {
  display: grid;
  gap: 0;
  margin: 0;
}

body.finly-clarity .clarity-ledger .fin-track-list article {
  position: relative;
  display: block;
  overflow: hidden;
  padding: 20px 0 23px;
  border: 0;
  border-block-start: 1px solid var(--fin-line);
  border-radius: 0;
  background: transparent;
}

body.finly-clarity .clarity-track-title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  color: var(--fin-navy);
}

body.finly-clarity .clarity-track-title > b {
  font-size: 16px;
  font-weight: 650;
}

body.finly-clarity .clarity-track-title > small {
  margin-inline-start: auto;
  color: var(--fin-text-muted);
  font-size: 14px;
}

body.finly-clarity .clarity-dot {
  flex: 0 0 7px;
  inline-size: 7px;
  block-size: 7px;
  border-radius: 50%;
}

body.finly-clarity .clarity-dot-teal { background: var(--fin-teal); }
body.finly-clarity .clarity-dot-blue { background: var(--fin-blue); }
body.finly-clarity .clarity-dot-sky { background: var(--fin-blue-300); }

body.finly-clarity .clarity-track-values {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 16px;
  margin-block-start: 13px;
}

body.finly-clarity .clarity-track-values > div {
  min-inline-size: 0;
}

body.finly-clarity .clarity-track-values small {
  display: block;
  margin-block-end: 3px;
  color: var(--fin-text-muted);
  font-size: 14px;
}

body.finly-clarity .clarity-track-values b {
  display: block;
  color: var(--fin-navy);
  font-family: var(--fin-font-display);
  font-size: clamp(15px, 1.45vw, 19px);
  font-weight: 450;
  font-variant-numeric: tabular-nums;
  text-align: start;
  white-space: nowrap;
}

body.finly-clarity .clarity-ledger .fin-track-share {
  position: absolute;
  inset-block-end: 7px;
  inset-inline-start: 0;
  inline-size: var(--share);
  block-size: 2px;
  background: var(--fin-blue);
}

body.finly-clarity .clarity-ledger article:first-child .fin-track-share { background: var(--fin-teal); }
body.finly-clarity .clarity-ledger article:last-child .fin-track-share { background: var(--fin-blue-300); }

body.finly-clarity .clarity-observation {
  margin-block-start: 19px;
  padding: 20px;
  border: 0;
  border-inline-start: 2px solid var(--fin-teal);
  border-radius: 0;
  background: var(--fin-teal-50);
}

body.finly-clarity .clarity-observation > span {
  display: block;
  color: var(--fin-teal-ink);
  font-size: 14px;
  font-weight: 600;
}

body.finly-clarity .clarity-observation > strong {
  display: block;
  margin-block-start: 5px;
  color: var(--fin-navy);
  font-size: 18px;
  font-weight: 550;
  line-height: 1.5;
}

body.finly-clarity .clarity-observation p {
  margin: 6px 0 0;
  color: var(--fin-text-soft);
  font-size: 14px;
  line-height: 1.6;
}

/* A continuous alternative column makes the comparison readable at a glance. */
body.finly-clarity .clarity-compare-section {
  background: #fff;
  border-block: 1px solid #eaf0f5;
}

body.finly-clarity .clarity-compare-intro {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  align-items: end;
  gap: 60px;
  margin-block-end: clamp(38px, 5vw, 70px);
}

body.finly-clarity .clarity-compare-intro .clarity-lead {
  max-inline-size: 400px;
  margin-block-end: 5px;
}

body.finly-clarity .clarity-comparison {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: start;
}

body.finly-clarity .clarity-comparison > figcaption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-block-end: 23px;
  color: var(--fin-text-muted);
  font-size: 14px;
  line-height: 1.55;
}

body.finly-clarity .clarity-comparison > figcaption > span:first-child {
  color: var(--fin-navy);
  font-size: 17px;
  font-weight: 550;
}

body.finly-clarity .clarity-compare-grid {
  overflow: hidden;
  border-block: 1px solid #cbd8e7;
  background: var(--fin-surface);
}

body.finly-clarity .clarity-comparison .fin-compare-head,
body.finly-clarity .clarity-comparison .fin-compare-row {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) repeat(2, minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.finly-clarity .clarity-comparison .fin-compare-row {
  border-block-start: 1px solid #e1e8ef;
}

body.finly-clarity .clarity-comparison .fin-compare-head > *,
body.finly-clarity .clarity-comparison .fin-compare-row > * {
  display: flex;
  align-items: center;
  justify-content: center;
  min-inline-size: 0;
  padding: 27px 24px;
  color: var(--fin-navy);
  background: transparent;
  font-family: var(--fin-font-display);
  font-size: clamp(21px, 2.5vw, 34px);
  font-weight: 450;
  line-height: 1.3;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.035em;
  text-align: center;
}

body.finly-clarity .clarity-comparison .fin-compare-head > * {
  padding-block: 22px;
  color: var(--fin-text-soft);
  font-family: var(--fin-font-body);
  font-size: 16px;
  font-weight: 550;
  letter-spacing: 0;
}

body.finly-clarity .clarity-comparison .fin-compare-head > :first-child,
body.finly-clarity .clarity-comparison .fin-compare-row > :first-child {
  justify-content: flex-start;
  font-family: var(--fin-font-body);
  font-size: 16px;
  font-weight: 450;
  letter-spacing: 0;
  text-align: start;
}

body.finly-clarity .clarity-comparison .fin-compare-head > .is-option,
body.finly-clarity .clarity-comparison .fin-compare-row > .is-option {
  color: var(--fin-teal-ink);
  background: var(--fin-teal-50);
}

body.finly-clarity .clarity-comparison .clarity-compare-emphasis > b {
  font-size: clamp(30px, 4.2vw, 60px);
  font-weight: 450;
  letter-spacing: -.065em;
}

body.finly-clarity .clarity-comparison .fin-compare-foot {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-block-start: 0;
  padding: 27px 0 0;
  border: 0;
  border-radius: 0;
  color: var(--fin-navy);
  background: transparent;
}

body.finly-clarity .clarity-comparison .fin-compare-foot > span {
  color: var(--fin-teal-ink);
  font-size: 14px;
  font-weight: 650;
}

body.finly-clarity .clarity-comparison .fin-compare-foot > strong {
  font-size: clamp(17px, 1.65vw, 22px);
  font-weight: 550;
  line-height: 1.45;
}

body.finly-clarity .clarity-comparison .fin-compare-foot > small {
  margin-inline-start: auto;
  color: var(--fin-text-muted);
  font-size: 14px;
}

/* Human responsibility is expressed as open, readable columns. */
body.finly-clarity .clarity-human-intro {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  align-items: end;
  gap: 70px;
}

body.finly-clarity .clarity-human-intro .clarity-lead {
  margin: 0;
}

body.finly-clarity .clarity-text-link,
body.finly-clarity .clarity-trust-grid a {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  min-block-size: 44px;
  margin-block-start: 21px;
  color: var(--fin-blue);
  font-size: 16px;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: #aac7e9;
  text-underline-offset: 6px;
}

body.finly-clarity .clarity-text-link > span,
body.finly-clarity .clarity-trust-grid a > span {
  font-size: 21px;
}

body.finly-clarity .clarity-trust-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-block-start: clamp(48px, 6vw, 86px);
  padding-block-start: 36px;
  border-block-start: 1px solid var(--fin-line);
}

body.finly-clarity .clarity-trust-grid article {
  min-inline-size: 0;
  padding-inline: clamp(22px, 4vw, 58px);
}

body.finly-clarity .clarity-trust-grid article:first-child {
  padding-inline-start: 0;
}

body.finly-clarity .clarity-trust-grid article:last-child {
  padding-inline-end: 0;
}

body.finly-clarity .clarity-trust-grid article + article {
  border-inline-start: 1px solid var(--fin-line);
}

body.finly-clarity .clarity-trust-number {
  display: block;
  margin-block-end: 29px;
  color: var(--fin-teal-ink);
  font-family: var(--fin-font-display);
  font-size: 14px;
  font-weight: 450;
}

body.finly-clarity .clarity-trust-grid h3 {
  color: var(--fin-blue);
  font-family: var(--fin-font-display);
  font-size: clamp(25px, 2.4vw, 34px);
  font-weight: 480;
  line-height: 1.2;
  letter-spacing: -.04em;
}

body.finly-clarity .clarity-trust-grid p {
  max-inline-size: 310px;
  margin: 17px 0 0;
  color: var(--fin-text-soft);
  font-size: 16px;
  line-height: 1.75;
}

body.finly-clarity .clarity-trust-grid a {
  gap: 12px;
  margin-block-start: 11px;
  font-size: 14px;
}

/* Two large typographic doors, with a shared baseline and a quiet dividing rule. */
body.finly-clarity .clarity-routes {
  padding-block: 20px 32px;
  background: var(--fin-surface);
}

body.finly-clarity .clarity-routes-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px;
}

body.finly-clarity .clarity-route {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-inline-size: 0;
  padding: clamp(32px, 4.9vw, 70px);
  color: var(--fin-navy);
  background: var(--fin-blue-50);
  text-decoration: none;
  transition: background-color .24s ease;
}

body.finly-clarity .clarity-route:nth-child(2) {
  background: var(--fin-teal-50);
}

body.finly-clarity .clarity-route > span {
  color: var(--fin-blue);
  font-size: 14px;
  font-weight: 550;
}

body.finly-clarity .clarity-route:nth-child(2) > span {
  color: var(--fin-teal-ink);
}

body.finly-clarity .clarity-route h2 {
  margin-block: 25px 20px;
  color: var(--fin-blue);
  font-family: var(--fin-font-display);
  font-size: clamp(43px, 5.2vw, 74px);
  font-weight: 550;
  line-height: 1.05;
  letter-spacing: -.055em;
}

body.finly-clarity .clarity-route p {
  max-inline-size: 355px;
  margin: 0 0 30px;
  color: var(--fin-text-soft);
  font-size: 17px;
  line-height: 1.7;
}

body.finly-clarity .clarity-route > b {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  inline-size: 100%;
  min-block-size: 44px;
  margin-block-start: auto;
  padding-block-start: 17px;
  border-block-start: 1px solid #c6d8ec;
  color: var(--fin-blue);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
}

body.finly-clarity .clarity-route:nth-child(2) > b {
  border-color: #b9e2e4;
  color: var(--fin-teal-ink);
}

body.finly-clarity .clarity-route i {
  flex-shrink: 0;
  font-size: 25px;
  font-style: normal;
  transition: transform .24s ease;
}

body.finly-clarity .clarity-route:focus-visible {
  z-index: 1;
  outline-offset: -5px;
}

/* Resources read as an index, rather than another collection of cards. */
body.finly-clarity .clarity-resources {
  padding-block: clamp(60px, 7.4vw, 112px);
  color: var(--fin-navy);
  background: var(--fin-surface);
}

body.finly-clarity .clarity-resources-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px;
  margin-block-end: 38px;
}

body.finly-clarity .clarity-resources-heading h2 {
  color: var(--fin-blue);
  font-family: var(--fin-font-display);
  font-size: clamp(30px, 3.2vw, 46px);
  font-weight: 480;
  line-height: 1.2;
  letter-spacing: -.045em;
}

body.finly-clarity .clarity-resources-list {
  border-block-start: 1px solid var(--fin-line);
}

body.finly-clarity .clarity-resources-list > a {
  display: grid;
  grid-template-columns: minmax(90px, .25fr) minmax(0, 1fr) 44px;
  align-items: center;
  gap: 25px;
  padding-block: 28px;
  border-block-end: 1px solid var(--fin-line);
  color: var(--fin-navy);
  text-decoration: none;
  transition: background-color .2s ease;
}

body.finly-clarity .clarity-resource-kind {
  color: var(--fin-text-muted);
  font-size: 14px;
}

body.finly-clarity .clarity-resources-list h3 {
  color: var(--fin-blue);
  font-family: var(--fin-font-display);
  font-size: clamp(21px, 2vw, 28px);
  font-weight: 480;
  line-height: 1.35;
  letter-spacing: -.03em;
}

body.finly-clarity .clarity-resources-list p {
  margin: 7px 0 0;
  color: var(--fin-text-soft);
  font-size: 15px;
  line-height: 1.65;
}

body.finly-clarity .clarity-resources-list > a > span:last-child {
  display: grid;
  place-items: center;
  inline-size: 44px;
  block-size: 44px;
  color: var(--fin-blue);
  font-size: 29px;
  transition: transform .2s ease;
}

/* The finale stays luminous; a single line carries the hero's motif forward. */
body.finly-clarity .clarity-finale {
  position: relative;
  overflow: hidden;
  padding-block: clamp(84px, 10vw, 150px) clamp(86px, 10vw, 154px);
  background: radial-gradient(ellipse at 18% 82%, #bff1f5 0, transparent 55%),
    linear-gradient(130deg, #e5f8ff 0%, #e4edff 100%);
}

body.finly-clarity .clarity-finale::before {
  content: "";
  position: absolute;
  inset-block-start: 53%;
  inset-inline-end: -240px;
  inline-size: 580px;
  block-size: 300px;
  border: 2px solid var(--fin-teal);
  border-radius: 50%;
  transform: rotate(-28deg);
  opacity: .35;
  pointer-events: none;
}

body.finly-clarity .clarity-finale::after {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  block-size: 1px;
  background: linear-gradient(90deg, transparent, #cbdcea 25%, #a8dee3 70%, transparent);
}

body.finly-clarity .clarity-finale .final-cta {
  position: relative;
  overflow: visible;
  max-inline-size: 1060px;
  margin-inline: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--fin-navy);
  background: transparent;
  text-align: center;
}

body.finly-clarity .clarity-finale .final-cta::after {
  content: none;
}

body.finly-clarity .clarity-finale-kicker {
  display: block;
  margin-block-end: 30px;
  color: var(--fin-teal-ink);
  font-size: 15px;
  font-weight: 550;
}

body.finly-clarity .clarity-finale .final-cta h2 {
  color: var(--fin-blue);
  font-family: var(--fin-font-display);
  font-size: clamp(48px, 7.8vw, 112px);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -.06em;
  text-wrap: balance;
}

body.finly-clarity .clarity-finale .final-cta > p {
  max-inline-size: 620px;
  margin: 29px auto 31px;
  color: var(--fin-text-soft);
  font-size: clamp(17px, 1.8vw, 22px);
  line-height: 1.7;
}

body.finly-clarity .clarity-finale .fin-actions-row {
  justify-content: center;
}

body.finly-clarity .clarity-finale .final-cta .fin-honesty {
  max-inline-size: 570px;
  margin-block: 25px 0;
  color: var(--fin-text-muted);
  font-size: 14px;
  line-height: 1.75;
  opacity: 1;
}

@supports (background-clip: text) {
  body.finly-clarity .clarity-chapter h2,
  body.finly-clarity .clarity-chapter h2 em,
  body.finly-clarity .clarity-finale .final-cta h2 {
    background: var(--fin-grad-display);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }
}
@media (forced-colors: active) {
  body.finly-clarity .clarity-chapter h2,
  body.finly-clarity .clarity-chapter h2 em,
  body.finly-clarity .clarity-finale .final-cta h2 { background: none; color: CanvasText; }
}
@media print {
  body.finly-clarity .clarity-chapter h2,
  body.finly-clarity .clarity-chapter h2 em,
  body.finly-clarity .clarity-finale .final-cta h2 { background: none; color: var(--fin-blue); }
}
@media (hover: hover) and (pointer: fine) {
  body.finly-clarity .clarity-route:hover { background: #e4eefc; }
  body.finly-clarity .clarity-route:nth-child(2):hover { background: #def6f7; }
  body.finly-clarity .clarity-route:hover i { transform: translateX(-5px); }
  body.finly-clarity .clarity-resources-list > a:hover { background: #f7fafd; }
  body.finly-clarity .clarity-resources-list > a:hover > span:last-child { transform: translate(-3px, -3px); }
  body.finly-clarity .clarity-text-link:hover,
  body.finly-clarity .clarity-trust-grid a:hover { text-decoration-color: currentColor; }
}

@media (max-width: 1050px) {
  body.finly-clarity .clarity-editorial-grid { gap: 40px; }
  body.finly-clarity .clarity-chapter h2 { font-size: clamp(42px, 5.4vw, 61px); }
  body.finly-clarity .clarity-ledger { padding: 26px; }
  body.finly-clarity .clarity-ledger-head { flex-wrap: wrap; gap: 12px; }
  body.finly-clarity .clarity-ledger-head strong { font-size: 34px; }
  body.finly-clarity .clarity-track-title > small { margin-inline-start: 14px; }
  body.finly-clarity .clarity-track-values { gap: 9px; }
  body.finly-clarity .clarity-track-values b { font-size: 16px; }
  body.finly-clarity .clarity-compare-intro,
  body.finly-clarity .clarity-human-intro { gap: 42px; }
  body.finly-clarity .clarity-comparison .fin-compare-foot { flex-wrap: wrap; gap: 10px 20px; }
  body.finly-clarity .clarity-comparison .fin-compare-foot > small { flex-basis: 100%; margin-inline-start: 0; }
  body.finly-clarity .clarity-trust-grid article { padding-inline: 28px; }
}

@media (max-width: 800px) {
  body.finly-clarity .clarity-editorial-grid { grid-template-columns: minmax(0, 1fr); gap: 44px; }
  body.finly-clarity .clarity-editorial-copy { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
  body.finly-clarity .clarity-editorial-copy h2 { grid-row: 1 / 3; }
  body.finly-clarity .clarity-editorial-copy .clarity-lead { margin: 0; }
  body.finly-clarity .clarity-insights { margin-block-start: 23px; }
  body.finly-clarity .clarity-ledger { inline-size: 100%; max-inline-size: 620px; margin-inline: auto; padding: 32px; }
  body.finly-clarity .clarity-ledger-head strong { font-size: 40px; }
  body.finly-clarity .clarity-track-title > small { margin-inline-start: auto; }
  body.finly-clarity .clarity-track-values b { font-size: 20px; }
  body.finly-clarity .clarity-compare-intro,
  body.finly-clarity .clarity-human-intro { grid-template-columns: 1.1fr 1fr; gap: 32px; }
  body.finly-clarity .clarity-human-intro { align-items: start; }
  body.finly-clarity .clarity-chapter-top { gap: 16px; }
  body.finly-clarity .clarity-trust-grid article { padding-inline: 20px; }
  body.finly-clarity .clarity-trust-grid h3 { font-size: 27px; }
  body.finly-clarity .clarity-trust-grid p { font-size: 15px; }
  body.finly-clarity .clarity-route { padding: 34px 28px; }
  body.finly-clarity .clarity-route h2 { font-size: 48px; }
  body.finly-clarity .clarity-route p { font-size: 16px; }
  body.finly-clarity .clarity-resources-list > a { grid-template-columns: 78px minmax(0, 1fr) 44px; gap: 20px; }
  body.finly-clarity .clarity-finale::before { inset-inline-end: -370px; }
}

@media (max-width: 600px) {
  body.finly-clarity .clarity-chapter { padding-block: 64px 70px; }
  body.finly-clarity .clarity-chapter-top { gap: 12px; margin-block-end: 35px; }
  body.finly-clarity .clarity-chapter-top > span:last-child { max-inline-size: 145px; font-size: 14px; }
  body.finly-clarity .clarity-chapter h2 { font-size: clamp(40px, 10.5vw, 56px); line-height: 1.1; }
  body.finly-clarity .clarity-editorial-copy { display: block; }
  body.finly-clarity .clarity-editorial-copy .clarity-lead { margin-block-start: 24px; }
  body.finly-clarity .clarity-editorial-copy h2 br:last-child { display: none; }
  body.finly-clarity .clarity-insights { max-inline-size: none; margin-block-start: 27px; }
  body.finly-clarity .clarity-insights > div { gap: 11px; }
  body.finly-clarity .clarity-ledger { padding: 24px; }
  body.finly-clarity .clarity-ledger-head { gap: 13px; }
  body.finly-clarity .clarity-ledger-head strong { font-size: clamp(30px, 8vw, 40px); }
  body.finly-clarity .clarity-sample { font-size: 14px; }
  body.finly-clarity .clarity-track-title { gap: 6px; }
  body.finly-clarity .clarity-track-title > b { font-size: 16px; }
  body.finly-clarity .clarity-track-title > small { font-size: 14px; }
  body.finly-clarity .clarity-track-values { gap: 10px; }
  body.finly-clarity .clarity-track-values b { font-size: 16px; }
  body.finly-clarity .clarity-observation { padding: 17px; }
  body.finly-clarity .clarity-observation > strong { font-size: 17px; }
  body.finly-clarity .clarity-compare-intro,
  body.finly-clarity .clarity-human-intro { grid-template-columns: minmax(0, 1fr); gap: 21px; }
  body.finly-clarity .clarity-compare-intro { margin-block-end: 31px; }
  body.finly-clarity .clarity-compare-intro .clarity-lead { margin: 0; }
  body.finly-clarity .clarity-comparison > figcaption { align-items: start; flex-direction: column; gap: 5px; margin-block-end: 17px; }
  body.finly-clarity .clarity-comparison .fin-compare-head,
  body.finly-clarity .clarity-comparison .fin-compare-row { grid-template-columns: minmax(0, 1.05fr) repeat(2, minmax(0, 1fr)); }
  body.finly-clarity .clarity-comparison .fin-compare-head > *,
  body.finly-clarity .clarity-comparison .fin-compare-row > * { padding: 21px 8px; font-size: 19px; line-height: 1.45; }
  body.finly-clarity .clarity-comparison .fin-compare-head > *,
  body.finly-clarity .clarity-comparison .fin-compare-head > :first-child,
  body.finly-clarity .clarity-comparison .fin-compare-row > :first-child { font-size: 14px; }
  body.finly-clarity .clarity-comparison .fin-compare-head > * { padding-block: 18px; }
  body.finly-clarity .clarity-comparison .clarity-compare-emphasis > b { font-size: clamp(26px, 7vw, 36px); }
  body.finly-clarity .clarity-comparison .fin-compare-foot { display: grid; gap: 7px; padding-block-start: 22px; }
  body.finly-clarity .clarity-comparison .fin-compare-foot > strong { font-size: 19px; }
  body.finly-clarity .clarity-comparison .fin-compare-foot > small { margin: 0; }
  body.finly-clarity .clarity-human-intro h2 { font-size: clamp(37px, 10vw, 52px); }
  body.finly-clarity .clarity-text-link { margin-block-start: 16px; }
  body.finly-clarity .clarity-trust-grid { grid-template-columns: minmax(0, 1fr); gap: 0; margin-block-start: 35px; padding-block-start: 0; }
  body.finly-clarity .clarity-trust-grid article { position: relative; padding: 26px 39px 27px 0; }
  body.finly-clarity .clarity-trust-grid article:first-child,
  body.finly-clarity .clarity-trust-grid article:last-child { padding-inline: 39px 0; }
  body.finly-clarity .clarity-trust-grid article + article { border-inline-start: 0; border-block-start: 1px solid var(--fin-line); }
  body.finly-clarity .clarity-trust-number { position: absolute; inset-block-start: 30px; inset-inline-start: 0; margin: 0; }
  body.finly-clarity .clarity-trust-grid h3 { font-size: 27px; }
  body.finly-clarity .clarity-trust-grid h3 br { display: none; }
  body.finly-clarity .clarity-trust-grid p { margin-block-start: 10px; max-inline-size: none; font-size: 16px; }
  body.finly-clarity .clarity-routes { padding-block: 0 10px; }
  body.finly-clarity .clarity-routes-grid { grid-template-columns: minmax(0, 1fr); }
  body.finly-clarity .clarity-route { padding: 34px 27px; }
  body.finly-clarity .clarity-route h2 { margin-block: 21px 18px; font-size: clamp(49px, 13vw, 65px); }
  body.finly-clarity .clarity-route p { margin-block-end: 25px; }
  body.finly-clarity .clarity-route > b { font-size: 14px; }
  body.finly-clarity .clarity-resources { padding-block: 60px; }
  body.finly-clarity .clarity-resources-heading { display: block; margin-block-end: 27px; }
  body.finly-clarity .clarity-resources-heading h2 { margin-block-start: 15px; font-size: clamp(28px, 7.9vw, 37px); }
  body.finly-clarity .clarity-resources-list > a { grid-template-columns: minmax(0, 1fr) 35px; gap: 9px 16px; padding-block: 22px; }
  body.finly-clarity .clarity-resource-kind { grid-column: 1; }
  body.finly-clarity .clarity-resources-list > a > div { grid-column: 1; }
  body.finly-clarity .clarity-resources-list > a > span:last-child { grid-column: 2; grid-row: 1 / 3; inline-size: 35px; block-size: 44px; }
  body.finly-clarity .clarity-resources-list h3 { font-size: 23px; }
  body.finly-clarity .clarity-resources-list p { font-size: 15px; }
  body.finly-clarity .clarity-finale { padding-block: 75px 82px; }
  body.finly-clarity .clarity-finale-kicker { margin-block-end: 26px; font-size: 14px; }
  body.finly-clarity .clarity-finale .final-cta h2 { font-size: clamp(45px, 11.5vw, 65px); line-height: 1.08; }
  body.finly-clarity .clarity-finale .final-cta > p { margin-block: 22px 26px; font-size: 17px; }
  body.finly-clarity .clarity-finale .final-cta .fin-honesty { margin-block: 22px 0; font-size: 14px; }
  body.finly-clarity .clarity-finale::before { inset-block-start: 37%; inset-inline-end: -467px; opacity: .3; }
}

@media (max-width: 380px) {
  body.finly-clarity .clarity-chapter-top { gap: 8px; }
  body.finly-clarity .clarity-chapter-top > span:last-child { max-inline-size: 123px; }
  body.finly-clarity .clarity-chapter h2 { font-size: 38px; }
  body.finly-clarity .clarity-ledger { padding: 20px 15px; }
  body.finly-clarity .clarity-ledger-head { display: block; }
  body.finly-clarity .clarity-sample { display: inline-block; margin-block-start: 12px; }
  body.finly-clarity .clarity-track-title > small { flex-basis: calc(100% - 13px); margin-inline-start: 13px; }
  body.finly-clarity .clarity-track-values { gap: 7px; }
  body.finly-clarity .clarity-track-values b { font-size: 14px; }
  body.finly-clarity .clarity-observation { padding: 15px 12px; }
  body.finly-clarity .clarity-comparison .fin-compare-head > *,
  body.finly-clarity .clarity-comparison .fin-compare-row > * { padding-inline: 5px; }
  body.finly-clarity .clarity-comparison .fin-compare-row > b { font-size: 16px; }
  body.finly-clarity .clarity-comparison .clarity-compare-emphasis > b { font-size: 25px; }
  body.finly-clarity .clarity-human-intro h2 { font-size: 35px; }
  body.finly-clarity .clarity-route { padding-inline: 22px; }
  body.finly-clarity .clarity-route > b { gap: 10px; }
  body.finly-clarity .clarity-finale .final-cta h2 { font-size: 41px; }
}

@media (prefers-reduced-motion: reduce) {
  body.finly-clarity .clarity-route,
  body.finly-clarity .clarity-route i,
  body.finly-clarity .clarity-resources-list > a,
  body.finly-clarity .clarity-resources-list > a > span:last-child { transition: none; }
}

/* Large gradient text stays on white; surrounding diagrams carry the full turquoise. */
body.finly-clarity .clarity-chapter h2, body.finly-clarity .clarity-finale .final-cta { background-color: #fff; }