/* BuildKitly home part A (hero, platform band, collection, industry panel).
   Scoped to .bk-ha-* classes set on native Elementor containers/widgets. Only what controls cannot express:
   mock-website preview geometry (aspect ratio, container query units, image crop), showcase glow,
   button min-height, and the reference's 900px layout state (between Elementor tablet and mobile). */

/* ---------- shared inline icons (Lucide-like arrows in text; FA5 has no arrow-up-right) ---------- */
.bk-ha-ico { display: inline-block; width: 18px; margin-left: 10px; text-align: center; font-size: 17px; line-height: 1; font-weight: 400; -webkit-text-stroke: .5px currentColor; }
.bk-ha-btn .bk-ha-ico { margin-left: 14px; }
.bk-ha-ico--lg { width: 20px; margin-left: 0; font-size: 19px; }
.bk-ha-ico--title { width: 17px; margin-left: 15px; font-size: 17px; }
.bk-ha-ico--sm { width: 13px; margin-left: 6px; font-size: 12px; -webkit-text-stroke: .3px currentColor; }
.bk-ha-ico--pre { margin: 0 6px 0 0; font-size: 15px; -webkit-text-stroke: 0; }

/* ---------- hero ---------- */
/* reference identity v2 tightens display/eyebrow tracking for the hero only (-.055em / .09em) */
.elementor.elementor .bk-ha-hero-copy .elementor-widget-heading h1.elementor-heading-title { letter-spacing: -.055em; }
.elementor.elementor .bk-ha-hero-eyebrow.elementor-widget-heading .elementor-heading-title { letter-spacing: .09em; }
.bk-ha-em { color: var(--e-global-color-accent); }
.elementor.elementor .bk-ha-spark.elementor-widget-spacer { align-self: center; height: var(--spacer-size); }
.elementor.elementor .bk-ha-spark.elementor-widget-spacer .elementor-spacer { height: 100%; }
.bk-ha-btn .elementor-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; }
.bk-ha-showcase { isolation: isolate; }
.bk-ha-showcase::before { content: ''; position: absolute; inset: 0 -80px 0 40px; border-radius: 50%; background: radial-gradient(ellipse, #dce1e8 0, transparent 70%); z-index: -1; pointer-events: none; }
.bk-ha-sticker .elementor-heading-title { white-space: nowrap; }

/* ---------- theme preview mockups (hero + cards) ---------- */
.bk-ha-preview { container-type: inline-size; color: #242522; text-decoration: none; }
.bk-ha-preview .bk-ha-chrome { position: relative; }
.bk-ha-preview .bk-ha-chrome::before { content: ''; position: absolute; left: 7px; top: 50%; width: 15px; height: 3px; transform: translateY(-50%);
  background: radial-gradient(circle, #c9c9c2 1.4px, transparent 1.6px) 0 0 / 6px 3px repeat-x; }
.bk-ha-preview .bk-ha-chrome > .elementor-widget { flex: 1 1 auto; }
.bk-ha-preview .bk-ha-window { aspect-ratio: 1.36; position: relative; }
.bk-ha-preview .bk-ha-mini-nav { --height: 12%; flex: 0 0 12%; }
.bk-ha-preview .bk-ha-mini-cta .elementor-heading-title { border-bottom: 1px solid currentColor; padding-bottom: 4px; }
.elementor.elementor .bk-ha-preview .bk-ha-mini-title--serif .elementor-heading-title { font-family: Georgia, "Times New Roman", serif; }
.bk-ha-preview .bk-ha-shot { height: 71%; }
.bk-ha-preview .bk-ha-shot .elementor-widget-container { height: 100%; }
.bk-ha-preview .bk-ha-shot img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- collection cards ---------- */
.bk-ha-save .elementor-icon { box-shadow: 0 2px 6px rgba(0, 0, 0, .03); }
.bk-ha-tabs { scrollbar-width: none; }
.bk-ha-tabs .elementor-heading-title { white-space: nowrap; }
.bk-ha-tab--active { margin-bottom: -1px; }

/* ---------- industry list ---------- */
.bk-ha-ind-link { text-decoration: none; }
/* hover: lift / arrow nudge / focus come from bk-motion.css utilities (bk-lift, bk-arrow, bk-link) */

/* ---------- Elementor tablet (768-1024) = reference <=1200 state ---------- */
@media (min-width: 768px) and (max-width: 1024px) {
  /* kit display clamp targets a 1-col tablet hero; the reference keeps 2 columns down to 900px at 4.5vw */
  .elementor.elementor .bk-ha-hero-copy .elementor-widget-heading h1.elementor-heading-title { font-size: 4.5vw; }
}

/* ---------- reference <=900px state inside Elementor tablet range ---------- */
@media (min-width: 768px) and (max-width: 900px) {
  .elementor.elementor .bk-ha-hero-copy .elementor-widget-heading h1.elementor-heading-title { font-size: 60px; }
  .bk-ha-band > .e-con-inner, .bk-ha-band.e-con-full { justify-content: center; --justify-content: center; row-gap: 20px; column-gap: 35px; --row-gap: 20px; --column-gap: 35px; }
  .elementor.elementor .bk-ha-band .bk-ha-band-label.elementor-widget { width: 100%; max-width: 100%; --container-widget-width: 100%; text-align: center; }
  .elementor.elementor .bk-ha-band .bk-ha-band-logo .elementor-heading-title { font-size: 17px; }
  .bk-ha-grid > .bk-ha-card:nth-child(3) { display: none; }
}

@media (max-width: 767px) {
  .elementor.elementor .bk-ha-hero-eyebrow.elementor-widget-heading .elementor-heading-title { font-size: 9px; letter-spacing: .045em; }
  .bk-ha-hero-copy .bk-ha-btn .bk-ha-ico { margin-left: 14px; }
  .elementor.elementor .bk-ha-btn .elementor-button { font-size: 12px; line-height: 1.4; }
  .elementor.elementor .bk-ha-card .elementor-widget-heading h3.elementor-heading-title { font-size: 23px; }
}

