/* BuildKitly homepage (page 25) phase 3 — owner: agent "hp".
   The collection / tools / FAQ / build-notes blocks are Loop Grids of the shared loop items 351 / 355 / 363 / 359.
   Only what the widget controls cannot express: the reference's 900px / 1200px grid states (between Elementor
   breakpoints), the tab strip underline, and the homepage variant of the article card (h3 size, no excerpt).
   No transitions / hover motion here (bk-motion.css owns them). */

/* ---------- collection tabs (native Nested Tabs): one underline under the strip, like .segment ---------- */
.bk-hp-tabs .e-n-tabs-heading { border-bottom: 1px solid var(--e-global-color-border); width: max-content; max-width: 100%; scrollbar-width: none; }
.bk-hp-tabs .e-n-tab-title { margin-bottom: -1px; white-space: nowrap; }
.bk-hp-themes, .bk-hp-themes > .elementor-widget-container { width: 100%; }

/* reference <=900px (inside Elementor's tablet range): 2 columns; a 3-card row drops its 3rd card */
@media (min-width: 768px) and (max-width: 900px) {
  .elementor .elementor-element.elementor-widget.bk-hp-themes .elementor-loop-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* the loop container also holds <style> nodes, so count loop items only */
  .bk-hp-themes--featured .elementor-loop-container > .e-loop-item:nth-child(3 of .e-loop-item) { display: none; }
}

/* ---------- tools (loop 355): reference <=1200px shows 3 cards, 4th hidden ---------- */
@media (min-width: 901px) and (max-width: 1200px) {
  .elementor .elementor-element.elementor-widget.bk-hp-tools-grid .elementor-loop-container { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bk-hp-tools-grid .elementor-loop-container > .e-loop-item:nth-child(4 of .e-loop-item) { display: none; }
}

/* ---------- build notes (loop 359) on the homepage: reference home .article-grid (h3 22px / 1.3, no intro,
   small " / 01" index and the ↗ glyph inside the tile, 20px under the tile) ---------- */
.bk-hp-notes-grid .e-loop-item .elementor-element.bk-ct-card-title .elementor-heading-title {
  font-size: 22px; line-height: 1.3; letter-spacing: -0.025em;
}
.bk-hp-notes-grid .e-loop-item .bk-ct-card-excerpt { display: none; }
.bk-hp-notes-grid .e-loop-item .bk-ct-tile-num { font-weight: 400; font-size: 20px; letter-spacing: -0.06em; }
.bk-hp-notes-grid .e-loop-item .bk-ct-card .bk-ct-tile-arrow { display: block; }
.elementor .bk-hp-notes-grid .e-loop-item .e-con.bk-ct-tile.bk-ct-tile { --margin-bottom: 20px; }
@media (max-width: 1024px) {
  .bk-hp-notes-grid .e-loop-item .bk-ct-tile-num { font-size: 16px; }
}