/* build/ hub: the list of the four Build pages under the solo hero. The row is the Work hub's (work/hub.css .kinds), copied
   value for value so the site has one hub list: a two-column grid, the page's name over one line, a teal "→".
   Red-team wave 2 (Sept 25): the arrow sits beside the text, not at the far column edge (the row is capped at the text measure);
   the list section is a page section so the close (always deep) alternates. When the frame owner moves this row into
   shared/site.css as one hub list, delete this file's .kinds rules and keep only .hub-note and .sec-kinds. */
.hub-note{margin-top:var(--sp-p);max-width:34em}
.sec-kinds{padding-block:8px clamp(56px,8vh,96px);border-top:0}
.kinds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--col-gap)}
.kinds li{border-top:1px solid var(--hair)}
.kinds li:nth-child(-n+2){border-top:0}
.kinds li:nth-last-child(-n+2){border-bottom:1px solid var(--hair)}
.kinds a{position:relative;display:grid;gap:6px;max-width:calc(30em + 48px);padding:24px 48px 26px 0;transition:color var(--motion-base) var(--ease-out)}
.kinds a::after{content:"→";position:absolute;right:8px;top:24px;font-size:18px;color:var(--teal-hi);transition:transform var(--motion-base) var(--ease-out)}
.kinds span{font-size:var(--fs-base);line-height:1.5;color:var(--sub);max-width:30em}
.kinds a:hover span{color:var(--ink)}
.kinds a:hover::after{transform:translateX(4px)}
.kinds a:focus-visible{outline-offset:-2px}
@media (max-width:760px){
  .kinds{grid-template-columns:minmax(0,1fr)}
  .kinds li:nth-last-child(2){border-bottom:0}
  .kinds li:nth-child(2){border-top:1px solid var(--hair)}
  .kinds a{padding:20px 40px 22px 0}
  .kinds a::after{top:20px}
}