/* Deal pages, alternatives and niche shortlists (tools/pages/money.py). */
.md-head-grid, .ma-head { display: grid; gap: 28px; align-items: start; }
@media (min-width: 960px) { .md-head-grid, .ma-head { grid-template-columns: minmax(0, 1fr) 420px; gap: 56px; } }
.md-head-grid h1, .ma-head h1 { font-size: clamp(2rem, 1.4rem + 2.4vw, 3.2rem); }

.md-figs { display: grid; gap: 20px; }
@media (min-width: 720px) { .md-figs { grid-template-columns: 1fr 1fr 1.3fr; } }
.md-figs > div { padding: 20px 22px; border-radius: var(--radius); background: var(--paper); border: 1px solid var(--rule); }
.md-fig { font-size: clamp(2.2rem, 1.8rem + 1.6vw, 3.2rem); font-weight: 720; font-stretch: 80%; letter-spacing: -.02em; line-height: 1; }
.md-fig-total { background: var(--ink) !important; border-color: var(--ink) !important; }
.md-fig-total .md-fig, .md-fig-total p { color: var(--paper); }

.md-how-grid { display: grid; gap: 40px; }
@media (min-width: 900px) { .md-how-grid { grid-template-columns: 1fr 1fr; gap: 64px; } }
.md-steps { margin: 0; padding: 0; list-style: none; counter-reset: step; display: grid; gap: 14px; }
.md-steps li { counter-increment: step; display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: start; }
.md-steps li::before { content: counter(step); display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--magenta-wash); color: var(--magenta); font-weight: 700; }
.md-steps code { background: var(--magenta-wash); padding: 1px 6px; border-radius: 4px; }
.md-inc { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.md-inc li { display: flex; gap: 8px; }
.md-inc .i { color: var(--good); margin-top: .2em; }
.md-facts { margin: 0; display: grid; gap: 8px; }
.md-facts div { display: grid; grid-template-columns: 140px 1fr; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--rule); }
.md-facts dt { color: var(--ink-2); }
.md-facts dd { margin: 0; font-weight: 600; }
.md-facts dd span { display: block; font-weight: 400; color: var(--ink-2); }
.md-test { padding-left: 14px; border-left: 3px solid var(--magenta); }
.md-sims { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
@media (min-width: 768px) { .md-sims { grid-template-columns: repeat(3, 1fr); } }
.md-sims a { display: flex; gap: 12px; align-items: center; padding: 14px; background: var(--paper); border: 1px solid var(--rule); border-radius: var(--radius); text-decoration: none; height: 100%; }
.md-sims a:hover { border-color: var(--magenta); }
.md-sims strong { display: block; }

/* shortlist rows */
.ms-list, .dh-list { list-style: none; margin: 0; padding: 0; display: grid; }
.ms-row { display: grid; gap: 10px 18px; padding: 18px 0; border-bottom: 1px solid var(--rule); align-items: center;
  grid-template-columns: 34px minmax(160px, 220px) minmax(0, 1fr) 230px auto; }
.ms-rank { font-size: 1.6rem; font-weight: 720; font-stretch: 80%; color: var(--magenta); }
.ms-host { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.ms-host strong { display: block; }
.ms-why p { margin: 0; }
.ms-perk { display: flex; gap: 6px; color: var(--good); margin-top: 4px !important; font-weight: 560; }
.ms-price { display: grid; gap: 2px; }
.ms-fit { font-size: .85rem; color: var(--ink-2); }
.ms-query { margin-top: 4px; }
@media (max-width: 899px) {
  .ms-row { grid-template-columns: 34px 1fr auto; }
  .ms-why { grid-column: 2 / -1; }
  .ms-price { grid-column: 2 / 3; }
  .ms-cta { grid-column: 3; grid-row: 3; }
}
.dh-row { display: grid; gap: 10px 18px; padding: 16px 0; border-bottom: 1px solid var(--rule); align-items: center; grid-template-columns: minmax(170px, 230px) minmax(0, 1fr) 210px auto; }
.dh-perk { margin: 0; font-weight: 560; }
.dh-note { margin-top: 14px; }
.dh-more { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.dh-more a { display: inline-flex; min-height: 44px; align-items: center; padding: 0 16px; border: 1px solid var(--rule-strong); border-radius: var(--pill); text-decoration: none; background: var(--paper); font-weight: 560; }
.dh-more a:hover { border-color: var(--magenta); color: var(--magenta); }
@media (max-width: 899px) { .dh-row { grid-template-columns: 1fr auto; } .dh-perk, .dh-row .ms-price { grid-column: 1 / -1; } }
.ma-reasons { margin: 0; padding-left: 1.1em; display: grid; gap: 8px; max-width: 70ch; }
.ma-reasons li::marker { color: var(--magenta); }
.mn-guide { display: grid; gap: 28px; }
@media (min-width: 900px) { .mn-guide { grid-template-columns: 1fr 1fr; gap: 56px; } }
.mn-guide h3 { margin-bottom: 8px; }
.md-head-grid, .ma-head { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) { .md-head-grid, .ma-head { grid-template-columns: minmax(0, 1fr) 420px; } }
@media (max-width: 899px) {
  .ms-row { grid-template-columns: 34px minmax(0, 1fr); }
  .ms-why, .ms-price, .ms-cta { grid-column: 2 / -1; grid-row: auto; }
  .dh-row { grid-template-columns: minmax(0, 1fr); }
}
.md-sims .small { display: flex; flex-wrap: wrap; gap: 0 4px; }
