/* =====================================================================
   Collateral26.ascx.css - the logo kit (Collateral.aspx), KG/Claude 11/1/2026
   On HomeMaster's night surface: heading on the night, one white card26 per logo. Colors are --sw-* only. Scoped to .col26-*.
   ===================================================================== */

.col26 { text-align: left; color: var(--sw-ink); display: grid; gap: 16px; max-width: 760px; }
.col26 *, .col26 *::before, .col26 *::after { box-sizing: border-box; }
.col26-head h1 { margin: 0; font: 700 40px/1.05 var(--sw-font-cond); letter-spacing: .01em; text-transform: uppercase; color: var(--sw-surface); }
.col26-card { display: grid; grid-template-columns: 220px 1fr; gap: 6px 22px; align-items: start; padding: 18px 20px; }
.col26-name { grid-column: 1 / -1; margin: 0; font: 700 22px/1.2 var(--sw-font-cond); letter-spacing: .01em; text-transform: uppercase; color: var(--sw-navy); }
.col26-pic { display: flex; justify-content: center; align-items: center; }
.col26-pic img { max-width: 100%; height: auto; }
.col26-groups { display: grid; gap: 14px; }
.col26-gl { margin: 0 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--sw-muted); }
.col26-cols { display: flex; flex-wrap: wrap; gap: 16px; }
.col26-col { display: grid; gap: 8px; justify-items: start; }
.col26-dl { text-align: left; line-height: 1.25; }

@media (max-width: 640px) {
  .col26-head h1 { font-size: 32px; }
  .col26-card { grid-template-columns: 1fr; }
  .col26-pic { justify-content: flex-start; }
}