/* 530utopian.help · assets/may-consider.css
   ==========================================================================================
   SITE: loaded by /facts/may-consider/ alone ("The discretion they already have").
   On screen it sits inside the site's chrome; in print the chrome drops away and it lays out on
   two US Letter pages.
   Engine tokens and type roles only: no new colors, no radius, nothing centered, no motion.
   Acid and the 6px heavy rule stay with the deadline component. Emphasis is the 2px rule.
   ========================================================================================== */

.mc{padding:var(--s6) 0 var(--s7)}
.mc *{min-width:0}
.mc p{margin:0 0 var(--s3)}
.mc sup{font-family:var(--mach); font-size:.62em; color:var(--mark); line-height:0; margin-left:2px; font-weight:400; letter-spacing:0}
.mc sup a{color:inherit; text-decoration:none}
.mc h2{font-family:var(--mach); font-weight:400; font-size:var(--t-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--mark);
  margin:0 0 var(--s4); padding-top:var(--s2); border-top:var(--mid) solid var(--ink)}
.mc > section, .mc > div, .mc > header{margin-bottom:var(--s7)}
.mc .nw{white-space:nowrap}

/* ---------- masthead ---------- */
.mc-mast{display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--s2) var(--s4); align-items:baseline;
  border-top:var(--mid) solid var(--ink); border-bottom:var(--hair) solid var(--ink); padding:var(--s2) 0; margin:0 0 var(--s6) !important}
.mc-mast .id{font-family:var(--voice); font-weight:700; font-size:1.05rem; letter-spacing:-.01em; color:var(--ink); text-decoration:none}
.mc-mast .id em{font-style:normal; color:var(--mark)}
.mc-mast .k{font-family:var(--mach); font-size:var(--t-xs); letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft)}
.mc-mast .k b{font-weight:400; color:var(--mark)}

/* ---------- head ---------- */
.mc-head{display:grid; gap:var(--s6); align-items:end}
.mc h1{max-width:9.5em; font-size:clamp(3rem,8.4vw,7rem); line-height:.86; letter-spacing:-.04em; margin:0 0 var(--s5); font-variation-settings:"wdth" 76,"opsz" 96}
.mc h1 em{color:var(--mark); font-style:normal}
.mc-dek{font-family:var(--read); font-weight:300; font-size:clamp(1.25rem,2.1vw,1.65rem); line-height:1.32; max-width:28em;
  padding-left:var(--s4); border-left:var(--mid) solid var(--mark)}
.mc-dl{font-family:var(--mach); font-size:var(--t-xs); letter-spacing:.08em; text-transform:uppercase; margin:var(--s4) 0 0 !important}

/* ---------- the board: eight calls ---------- */
.mc-board{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:minmax(0,1fr); gap:0; border-top:var(--mid) solid var(--ink)}
@media(min-width:760px){ .mc-board{grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:var(--s6)} }
.mc-board li{display:flex; flex-direction:column; gap:var(--s2); padding:var(--s4) 0; border-bottom:var(--hair) solid var(--quiet)}
.mc-board .lv{display:flex; align-items:baseline; gap:var(--s3); margin:0}
.mc-board .lv b{font-family:var(--voice); font-weight:700; font-size:1.9rem; line-height:.9; letter-spacing:-.04em; color:var(--mark); font-variation-settings:"wdth" 76,"opsz" 96; min-width:2.2rem}
.mc-board .lv span{font-family:var(--voice); font-weight:700; font-size:clamp(1.25rem,2vw,1.55rem); line-height:1.05; letter-spacing:-.015em; font-variation-settings:"wdth" 84,"opsz" 36}
.mc-board blockquote{margin:0; padding:0 0 0 calc(2.2rem + var(--s3))}
.mc-board blockquote p{font-family:var(--read); font-weight:400; font-size:1.06rem; line-height:1.45; margin:0}
.mc-board mark{background:none; color:var(--ink); font-weight:600; box-shadow:inset 0 -2px 0 var(--mark)}
.mc-board .who{margin:0; padding-left:calc(2.2rem + var(--s3)); font-family:var(--mach); font-weight:400; font-size:var(--t-xs); letter-spacing:.03em; line-height:1.55; color:var(--ink-soft)}
@media(min-width:760px){ .mc-board li.key{grid-column:1 / -1; background:var(--paper-2); padding:var(--s4) var(--s4); margin:var(--s2) 0; border-bottom:0; border-left:var(--mid) solid var(--mark)} .mc-board li.key blockquote p{font-size:1.25rem} }
.mc-none{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:var(--s2) var(--s4); margin:var(--s4) 0 0 !important; padding:var(--s3) var(--s4); background:var(--ink); color:var(--paper)}
.mc-none .k{font-family:var(--mach); font-size:var(--t-xs); letter-spacing:.1em; text-transform:uppercase; color:var(--paper); max-width:34em; line-height:1.6}
.mc-none b{font-family:var(--voice); font-weight:700; font-size:clamp(2rem,4vw,3rem); line-height:.9; letter-spacing:-.04em; color:var(--mark-lit); font-variation-settings:"wdth" 76,"opsz" 96}

/* ---------- the gap ---------- */
.mc-gaps{list-style:none; margin:0; padding:0; display:grid; gap:var(--s4)}
@media(min-width:760px){ .mc-gaps{grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s6)} }
.mc-gaps li{display:flex; flex-direction:column; gap:var(--s2); border-top:var(--hair) solid var(--ink); padding-top:var(--s3)}
.mc-gaps b{font-family:var(--voice); font-weight:700; font-size:clamp(2rem,3.4vw,2.6rem); line-height:.9; letter-spacing:-.035em; font-variation-settings:"wdth" 78,"opsz" 96}
.mc-gaps span{font-size:1.08rem; line-height:1.5; max-width:24em}
.mc-gaps li.hit{border-top:var(--mid) solid var(--mark)}
.mc-gaps li.hit b{color:var(--mark)}

/* ---------- smaller, and the limits ---------- */
.mc-r2{display:grid; gap:var(--s6)}
@media(min-width:900px){ .mc-r2{grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s7)} }
.mc-diff{width:100%; border-collapse:collapse}
.mc-diff thead th{text-align:left; font-family:var(--voice); font-weight:700; font-size:1.05rem; padding:0 var(--s3) var(--s2) 0; border-bottom:var(--mid) solid var(--ink); font-variation-settings:"wdth" 86,"opsz" 24}
.mc-diff thead td{border-bottom:var(--mid) solid var(--ink)}
.mc-diff tbody th{text-align:left; font-family:var(--voice); font-weight:600; font-size:1rem; line-height:1.25; padding:var(--s2) var(--s3) var(--s2) 0; vertical-align:top; font-variation-settings:"wdth" 90,"opsz" 24}
.mc-diff td{font-size:1rem; line-height:1.35; padding:var(--s2) var(--s3) var(--s2) 0; vertical-align:top}
.mc-diff tbody tr{border-bottom:var(--hair) solid var(--quiet)}
.mc-diff s{color:var(--ink-soft); text-decoration-color:var(--mark); text-decoration-thickness:2px}
.mc-diff tr.gone td span{font-family:var(--mach); font-size:var(--t-xs); letter-spacing:.1em; text-transform:uppercase; background:var(--mark); color:var(--paper); padding:2px 7px}
.mc-limits{list-style:none; margin:0; padding:0}
.mc-limits li{display:grid; grid-template-columns:3rem minmax(0,1fr); gap:var(--s3); padding:var(--s3) 0; border-bottom:var(--hair) solid var(--quiet); font-size:1.08rem; line-height:1.5}
.mc-limits li:first-child{padding-top:0}
.mc-limits b{font-family:var(--voice); font-weight:700; font-size:2.2rem; line-height:.9; letter-spacing:-.04em; color:var(--mark); font-variation-settings:"wdth" 76,"opsz" 96}
.mc-note{font-family:var(--voice); font-weight:700; font-size:1.2rem; margin-top:var(--s3) !important; font-variation-settings:"wdth" 86,"opsz" 24}

/* ---------- the opening ---------- */
.mc .mc-open{margin:0 0 var(--s7); padding:var(--s6) var(--s5)}
.mc-open-in{display:grid; gap:var(--s6)}
@media(min-width:900px){ .mc-open-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--s7)} }
.mc-open h2{color:var(--mark-lit); border-top-color:var(--paper)}
.mc-open q{display:block; font-family:var(--read); font-weight:300; font-size:clamp(1.45rem,2.6vw,2.1rem); line-height:1.25; color:var(--paper); margin:0 0 var(--s4); quotes:"\201C" "\201D"}
.mc-open p{color:var(--paper-2); font-size:1.05rem; line-height:1.5}
.mc-asks-k{font-family:var(--mach); font-size:var(--t-xs) !important; letter-spacing:.14em; text-transform:uppercase; color:var(--mark-lit) !important; padding-top:var(--s2); border-top:var(--mid) solid var(--paper); margin-bottom:var(--s3) !important}
.mc-asks{list-style:none; margin:0 0 var(--s5); padding:0; counter-reset:a}
.mc-asks li{counter-increment:a; display:grid; grid-template-columns:2.4rem minmax(0,1fr); gap:var(--s2); padding:var(--s2) 0; border-bottom:var(--hair) solid var(--rule-dk);
  color:var(--paper); font-size:1.08rem; line-height:1.45}
.mc-asks li::before{content:counter(a,decimal-leading-zero); font-family:var(--voice); font-weight:700; font-size:1.3rem; line-height:1.1; color:var(--mark-lit); font-variation-settings:"wdth" 76,"opsz" 72}
.mc-open .ask{font-family:var(--voice); font-weight:700; font-size:clamp(1.8rem,3.2vw,2.6rem); line-height:1; letter-spacing:-.025em; color:var(--paper);
  font-variation-settings:"wdth" 80,"opsz" 72; margin:0 0 var(--s3); max-width:11em}
.mc-open .ask em{font-style:normal; color:var(--mark-lit)}
.mc-open .tel{font-family:var(--mach); font-size:var(--t-xs); letter-spacing:.08em; color:var(--paper-2); margin:0}
.mc-open .tel a{color:var(--paper)}

/* ---------- receipts ---------- */
.mc .mc-rc{margin-bottom:0}
.mc-rc ol{margin:0; padding:0; list-style:none; columns:1; column-gap:var(--s6)}
@media(min-width:900px){ .mc-rc ol{columns:2} }
.mc-rc li{break-inside:avoid; font-family:var(--mach); font-weight:400; font-size:var(--t-xs); line-height:1.65; color:var(--ink-soft);
  margin:0 0 var(--s3); padding-left:2.2em; text-indent:-2.2em; overflow-wrap:anywhere}
.mc-rc li > b:first-child{display:inline-block; width:2.2em; text-indent:0; font-weight:400; color:var(--mark)}
.mc-rc .t{color:var(--mark)}
.mc-rc a{color:var(--ink)}
.mc-foot{display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--s2) var(--s4); border-top:var(--mid) solid var(--ink); margin-top:var(--s5); padding-top:var(--s2);
  font-family:var(--mach); font-size:var(--t-xs); letter-spacing:.08em; color:var(--ink-soft)}
.mc-foot b{font-weight:400; color:var(--ink)}

/* ---------- print: two US Letter pages, the break falling before the gap ---------- */
@page{size:letter; margin:0}
@media print{
  html{font-size:9.4px}
  body{background:var(--paper) !important; -webkit-print-color-adjust:exact; print-color-adjust:exact; padding:0 .6in}
  .skip,.colorbar,header.top,.route,.number,.acts-band,footer.foot,.mc-dl{display:none !important}
  main > .sheet{padding:0 !important; max-width:none !important}
  .mc{padding:.55in 0 0 !important}
  .mc > section,.mc > div,.mc > header{margin-bottom:2.6rem}
  .mc-mast{margin-bottom:2.4rem !important}
  .mc h1{font-size:6.2rem}
  .mc-dek{font-size:1.5rem}
  .mc-board{grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:2.4rem}
  .mc-board li{padding:1rem 0}
  .mc-board li.key{grid-column:1 / -1; background:var(--paper-2); padding:1rem 1.2rem; margin:.4rem 0; border-bottom:0; border-left:var(--mid) solid var(--mark)}
  .mc-board blockquote p{font-size:1.04rem}
  .mc-board li.key blockquote p{font-size:1.15rem}
  .mc-gap{break-before:page; padding-top:.55in}
  .mc-gap,.mc-r2{margin-bottom:2rem !important}
  .mc-gaps{grid-template-columns:repeat(3,minmax(0,1fr)); gap:2.4rem}
  .mc-r2{grid-template-columns:repeat(2,minmax(0,1fr)); gap:3rem; margin-bottom:2.4rem !important}
  .mc-open-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3rem}
  .mc .mc-open{padding:1.6rem 2rem; margin-bottom:1.8rem}
  .mc-asks{margin-bottom:1.2rem}
  .mc-open q{font-size:1.7rem}
  .mc-open .ask{font-size:2.2rem}
  .mc-rc ol{columns:3; column-gap:1.8rem}
  .mc-rc li{font-size:.84rem; line-height:1.45; margin-bottom:.3rem}
  .mc-foot{margin-top:1rem}
  a{text-decoration:none}
}
