/* hub.css - the only grid-primary page on the site. update_hub.py clones .card forever, so
   the card is designed once, properly.
   Column count follows the CHILD COUNT, never auto-fit: auto-fit picks columns from the WIDTH
   and orphans the last card at some viewport on almost any count. Five cards run 2 + 2 + 1,
   with the last card spanning the full row so there is never a dead cell. */
.cards{margin-top:44px;display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;
      display:flex;flex-direction:column;transition:box-shadow .2s ease,transform .2s ease}
.card:hover{box-shadow:0 16px 40px rgba(11,61,56,.10);transform:translateY(-3px)}
.card:last-child:nth-child(odd){grid-column:1 / -1}
.card:last-child:nth-child(odd) .shot img{height:250px}
.card .shot{display:block}
.card .shot img{width:100%;height:210px;object-fit:cover}
.card .pad{padding:24px 26px 28px;display:flex;flex-direction:column;gap:9px;flex:1}
.card .ck{font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
          color:var(--teal-deep)}
.card h3{font-size:1.2rem;max-width:22em}
.card h3 a{color:var(--teal-ink);text-decoration:none}
.card h3 a:hover{text-decoration:underline}
.card p{font-size:.94rem;color:var(--ink-soft)}
@media(max-width:780px){.cards{grid-template-columns:1fr}
  .card:last-child:nth-child(odd){grid-column:auto}}