/* GEO entry card only. The other eight tool cards keep their existing styles. */
@media (min-width: 681px) {
  #toolkitView .toolkit-grid { grid-template-rows: 112px repeat(4, 126px) !important; row-gap: 12px !important; }
  #toolkitView .tool-card { min-height: 126px !important; height: 126px !important; padding: 14px !important; }
  #toolkitView .tool-card.geo-tool { grid-column: 1 / -1 !important; grid-row: 1 !important; min-height: 112px !important; height: 112px !important; padding: 14px 22px !important; }
  #toolkitView .geo-tool > strong, #toolkitView .geo-tool > small { grid-column: 1 / -1 !important; justify-self: center !important; max-width: 58% !important; width: 58% !important; text-align: center !important; }
  #toolkitView .geo-tool > strong { font-size: 20px !important; margin-top: 4px !important; }
  #toolkitView .geo-tool > small { font-size: 11px !important; margin-top: 4px !important; line-height: 1.35 !important; }
  #toolkitView .geo-tool .geo-card-visual { -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.4) 34%, #000 58%, #000 100%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.4) 34%, #000 58%, #000 100%); }
}
@media (max-width: 680px) {
  #toolkitView .toolkit-grid { grid-template-rows: 92px repeat(4, minmax(0, 1fr)) !important; height: min(72dvh, calc(100dvh - 228px)) !important; row-gap: 10px !important; }
  #toolkitView .tool-card.geo-tool { grid-column: 1 / -1 !important; grid-row: 1 !important; min-height: 92px !important; height: 92px !important; padding: 10px 13px !important; }
  #toolkitView .geo-tool > strong, #toolkitView .geo-tool > small { grid-column: 1 / -1 !important; justify-self: center !important; max-width: 78% !important; width: 78% !important; text-align: center !important; }
  #toolkitView .geo-tool > strong { font-size: 14px !important; margin-top: 3px !important; }
  #toolkitView .geo-tool > small { font-size: 8.5px !important; line-height: 1.22 !important; margin-top: 3px !important; }
}

/* The entry card keeps the same two-line description rhythm as the eight
   existing cards; card-level logos are intentionally omitted. */
#toolkitView .tool-card > .tool-card-logo { display: none !important; }
#toolkitView .tool-card:not(.geo-tool) > strong,
#toolkitView .tool-card:not(.geo-tool) > small { padding-left: 0 !important; }
#toolkitView .tool-card:not(.geo-tool) > small {
  min-height: 2.9em !important;
  max-height: 2.9em !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}
#toolkitView .tool-card.geo-tool > small {
  min-height: 2.7em !important;
  max-height: 2.7em !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

/* Keep the GEO headline centered even when later shared card rules change the
   grid's default alignment. The artwork remains decorative behind the copy. */
#toolkitView .tool-card.geo-tool > strong,
#toolkitView .tool-card.geo-tool > small {
  grid-column: 1 / -1 !important;
  justify-self: center !important;
  text-align: center !important;
}

@media (max-width: 680px) {
  /* Nine cards = one full-width GEO row plus four compact two-column rows. */
  #toolkitView .toolkit-grid {
    grid-template-rows: 92px repeat(4, minmax(0, 1fr)) !important;
    height: min(72dvh, calc(100dvh - 228px)) !important;
    overflow: visible !important;
  }
}
