/* ============================================================
   Capabilities grid — "Everything it takes, in one platform"
   NewLayoutC / v2c only. Loaded in head.html for that variant.
   A quiet hairline grid that maps every BetaHub capability — the
   bottom-of-page catch-all so nothing dropped from the main spine
   gets missed. Direction A from design-dev/capabilities-grid.html.
   ============================================================ */
.v2-capabilities{
  --cap-cyan:#74FFE2;
  --cap-ink:#eff4ff;
  --cap-muted:#9fb2cc;
  --cap-faint:#6b7e98;
  --cap-line:rgba(120,150,200,.14);
  --cap-line-soft:rgba(120,150,200,.08);
  --cap-ease:cubic-bezier(.22,.61,.36,1);
  padding:clamp(60px,8vw,100px) 0;
}

/* ── header ── */
.v2-capabilities .cap-head{max-width:760px;margin-bottom:40px}
.v2-capabilities .cap-kicker{
  font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cap-cyan);margin:0 0 14px;
}
.v2-capabilities .cap-title{
  display:block;                 /* beat theme's h2{display:inline-block} */
  font-size:clamp(30px,4vw,46px);line-height:1.08;letter-spacing:-.02em;
  margin:0 0 14px;font-weight:700;
  background:linear-gradient(120deg,#eff4ff,#9fbaff 60%,#74ffe2);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.v2-capabilities .cap-sub{
  font-size:17px;line-height:1.55;color:var(--cap-muted);margin:0;max-width:560px;
}

/* ── grid ── */
.v2-capabilities .cap-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--cap-line);border-radius:16px;overflow:hidden;
  background:linear-gradient(180deg,rgba(16,30,52,.35),rgba(12,21,36,.15));
}
.v2-capabilities .cap-cell{
  position:relative;padding:30px 28px 32px;min-height:188px;
  border-right:1px solid var(--cap-line-soft);border-bottom:1px solid var(--cap-line-soft);
  display:flex;flex-direction:column;text-decoration:none;color:inherit;
  /* progress-bar wipe: same cyan tint, filled left→right on hover (brighter leading edge) */
  background-image:linear-gradient(90deg,rgba(116,255,226,.06),rgba(116,255,226,.11));
  background-repeat:no-repeat;background-position:left center;background-size:0% 100%;
  transition:background-size .42s var(--cap-ease);
}
.v2-capabilities .cap-grid .cap-cell:nth-child(3n){border-right:0}
.v2-capabilities .cap-cell:hover{background-size:100% 100%;text-decoration:none}
/* non-linked cell: no hover wipe, no pointer — reads as non-interactive */
.v2-capabilities .cap-cell--plain{background-image:none;cursor:default}

.v2-capabilities .cap-cell__icon{margin-bottom:auto;opacity:.92}
.v2-capabilities .cap-cell__icon img{
  width:74px;height:74px;display:block;object-fit:contain;margin:-8px 0 0 -6px;
}
.v2-capabilities .cap-cell__text{margin-top:22px}
.v2-capabilities .cap-cell__name{
  font-size:17px;font-weight:650;letter-spacing:-.01em;color:var(--cap-ink);margin:0;
}
.v2-capabilities .cap-cell__desc{
  font-size:13.5px;line-height:1.45;color:var(--cap-muted);margin:6px 0 0;
}

/* ── per-cell CTA: underline-sweep + arrow nudge on cell hover (matches .bh-link family) ── */
.v2-capabilities .cap-cell__cta{
  display:inline-flex;align-items:center;gap:6px;margin-top:14px;
  font-size:.82rem;font-weight:600;color:var(--cap-cyan);
}
.v2-capabilities .cap-cell__cta .t{
  background-image:linear-gradient(90deg,var(--cap-cyan),var(--cap-cyan));
  background-size:0 1.5px;background-position:0 100%;background-repeat:no-repeat;
  padding-bottom:2px;transition:background-size .32s var(--cap-ease);
}
.v2-capabilities .cap-cell__cta svg{width:14px;height:14px;transition:transform .25s}
.v2-capabilities .cap-cell:hover .cap-cell__cta .t{background-size:100% 1.5px}
.v2-capabilities .cap-cell:hover .cap-cell__cta svg{transform:translateX(4px)}

/* ── catch-all cell ── */
.v2-capabilities .cap-cell--cta{background:rgba(116,255,226,.04);justify-content:center}
.v2-capabilities .cap-cell--cta .cap-cell__text{margin-top:0}
.v2-capabilities .cap-cta-btn{
  margin-top:14px;display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
  padding:9px 16px;border-radius:999px;background:var(--cap-cyan);color:#04121b;
  font-weight:650;font-size:14px;text-decoration:none;
  transition:transform .2s var(--cap-ease),box-shadow .2s var(--cap-ease);
}
.v2-capabilities .cap-cta-btn:hover{
  transform:translateY(-1px);box-shadow:0 8px 24px rgba(116,255,226,.25);
  color:#04121b;text-decoration:none;            /* beat theme a:hover underline */
}
.v2-capabilities .cap-cta-btn svg{width:15px;height:15px}

/* ── responsive ── */
@media(max-width:880px){
  .v2-capabilities .cap-grid{grid-template-columns:repeat(2,1fr)}
  .v2-capabilities .cap-grid .cap-cell:nth-child(3n){border-right:1px solid var(--cap-line-soft)}
  .v2-capabilities .cap-grid .cap-cell:nth-child(2n){border-right:0}
}
@media(max-width:560px){
  .v2-capabilities .cap-grid{grid-template-columns:1fr}
  .v2-capabilities .cap-grid .cap-cell{border-right:0!important;min-height:0}
}
