/* more: "Everything else, already in there." (E2, SPEC 4.8). Every selector starts with #more.
   Night. Six cells, 3x2 on desktop, 2x3 under 1100, one column under 760.
   Cells are divided by 1px --hair lines: no cards, no icons. One lime scan line (added by more.js). */
#more{padding-block:clamp(96px,14vh,160px)}
#more .more-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
#more .more-in>*{grid-column:1 / -1;min-width:0}
#more .more-eyebrow{color:var(--ink-2);margin-bottom:20px}
#more .more-h{grid-column:1 / span 8}

#more .more-gridwrap{position:relative;margin-top:clamp(48px,7vh,72px)}
#more .more-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
#more .more-cell{min-width:0;padding:clamp(32px,4.6vh,48px) clamp(24px,2.8vw,44px);border-left:1px solid var(--hair)}
#more .more-cell:nth-child(3n+1){border-left:0;padding-left:0}
#more .more-cell:nth-child(3n){padding-right:0}
#more .more-cell:nth-child(n+4){border-top:1px solid var(--hair)}
#more .more-t{color:var(--ink);transition:color .45s var(--ease-out)}
#more .is-scan .more-cell:not(.is-lit) .more-t{color:var(--ink-3)}
#more .more-b{margin-top:12px;color:var(--ink-2);max-width:34ch}

/* the scan line: base .scan (2px lime core + falloff), moved with transform only */
#more .more-scan{opacity:0;--scan-fall:72px}
#more.is-final .more-scan{display:none}

@media (max-width:1099px){
  #more .more-h{grid-column:1 / -1}
  #more .more-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #more .more-cell,#more .more-cell:nth-child(3n+1),#more .more-cell:nth-child(3n),#more .more-cell:nth-child(n+4){
    border-left:1px solid var(--hair);border-top:0;padding-left:clamp(24px,3vw,40px);padding-right:clamp(24px,3vw,40px)}
  #more .more-cell:nth-child(2n+1){border-left:0;padding-left:0}
  #more .more-cell:nth-child(2n){padding-right:0}
  #more .more-cell:nth-child(n+3){border-top:1px solid var(--hair)}
}
/* phones: one column; the section padding follows the page's phone --sec-pad (base.css), and the
   cells keep a calm 22px above and below each title/line pair */
@media (max-width:759px){
  #more{padding-block:var(--sec-pad)}
  #more .more-gridwrap{margin-top:40px}
  #more .more-grid{grid-template-columns:minmax(0,1fr)}
  #more .more-cell,#more .more-cell:nth-child(3n+1),#more .more-cell:nth-child(3n),#more .more-cell:nth-child(n+4),
  #more .more-cell:nth-child(2n+1),#more .more-cell:nth-child(2n),#more .more-cell:nth-child(n+3){
    border-left:0;border-top:0;padding:22px 0}
  #more .more-cell:nth-child(n+2){border-top:1px solid var(--hair)}
  #more .more-b{margin-top:8px;max-width:none}
}