/* Capabilities archive — the blocks of the owner's own capabilities page file:
   the four overview figures, the six process cards with their tag badge and
   three spec rows, the capability matrix with its per-cell emphasis, the
   material groups and their tags, the customization cards and the four testing
   cards. Page furniture (banner, section heads, closing call to action) comes
   from the shared page shell, assets/css/page-shell.css. Scoped to
   .bovt-capabilities so no other page is affected. Colours are tokens.

   The matrix is written in the template rather than through the shared
   components/spec-table.php, and the process cards rather than through
   components/card.php: the shared table renders every cell alike and cannot
   mark the individual "Yes" cells this matrix leans on, and the shared card has
   nowhere for the tag badge and the three spec rows. */

/* ===== Overview figures ===== */
.bovt-capabilities .cap-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.bovt-capabilities .cap-stat{background:#fff;border-radius:14px;padding:28px 20px;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.06);border-top:3px solid var(--color-orange)}
.bovt-capabilities .cap-stat h3{font-size:26px;font-weight:800;color:var(--color-blue);margin:0}
.bovt-capabilities .cap-stat p{font-size:12.5px;color:#666;margin:6px 0 0}

/* ===== Process cards ===== */
.bovt-capabilities .process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.bovt-capabilities .process-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 6px 20px rgba(0,0,0,.06);transition:transform .3s ease,box-shadow .3s ease}
.bovt-capabilities .process-card:hover{transform:translateY(-6px);box-shadow:0 12px 30px rgba(0,0,0,.1)}
.bovt-capabilities .process-card .pr-img{position:relative}
.bovt-capabilities .process-card .pr-img .media{margin:0}
.bovt-capabilities .process-card .pr-img img{width:100%;border-radius:0}
.bovt-capabilities .process-card .pr-tag{position:absolute;top:12px;left:12px;background:var(--color-blue);color:#fff;font-size:11px;font-weight:800;padding:4px 11px;border-radius:16px}
.bovt-capabilities .process-card .pr-body{padding:20px}
.bovt-capabilities .process-card h4{font-size:16px;font-weight:800;margin:0 0 10px}
.bovt-capabilities .process-card .pr-row{display:flex;justify-content:space-between;gap:12px;font-size:12.5px;color:#777;padding:6px 0;border-bottom:1px dashed #eee}
.bovt-capabilities .process-card .pr-row:last-child{border-bottom:none}
.bovt-capabilities .process-card .pr-row span:last-child{font-weight:700;color:#333;text-align:right}

/* ===== Capability matrix ===== */
.bovt-capabilities .matrix-table{width:100%;border-collapse:collapse;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 6px 20px rgba(0,0,0,.06)}
.bovt-capabilities .matrix-table th{background:var(--color-blue);color:#fff;text-align:left;padding:14px 18px;font-size:13.5px;font-weight:700}
.bovt-capabilities .matrix-table td{padding:14px 18px;font-size:13px;color:#444;border-bottom:1px solid #f0f0f0}
.bovt-capabilities .matrix-table tr:last-child td{border-bottom:none}
.bovt-capabilities .matrix-table tr:nth-child(even) td{background:#fafcff}
.bovt-capabilities .matrix-table td.yes{color:var(--color-orange);font-weight:800}

/* ===== Material groups ===== */
.bovt-capabilities .material-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.bovt-capabilities .material-card{background:#fff;border-radius:14px;padding:26px;box-shadow:0 4px 14px rgba(0,0,0,.05)}
.bovt-capabilities .material-card h4{font-size:15.5px;font-weight:800;margin:0 0 14px;color:var(--color-blue)}
.bovt-capabilities .material-tags{display:flex;flex-wrap:wrap;gap:8px}
.bovt-capabilities .material-tags span{background:var(--color-brand-tint);color:#345;font-size:12px;font-weight:600;padding:6px 13px;border-radius:16px}

/* ===== Customization options ===== */
.bovt-capabilities .custom-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.bovt-capabilities .custom-card{background:#fff;border-radius:14px;padding:26px;box-shadow:0 4px 14px rgba(0,0,0,.05);display:flex;gap:18px;align-items:flex-start}
.bovt-capabilities .custom-card .cc-icon{width:50px;height:50px;background:var(--color-brand-tint);color:var(--color-blue);border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;flex-shrink:0}
.bovt-capabilities .custom-card h4{font-size:15px;font-weight:800;margin:0 0 8px}
.bovt-capabilities .custom-card p{font-size:13px;color:#777;margin:0}

/* ===== Testing cards ===== */
.bovt-capabilities .test-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.bovt-capabilities .test-card{background:#fff;border-radius:14px;padding:24px 18px;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.05);border-top:3px solid var(--color-orange)}
.bovt-capabilities .test-card .media{margin:0 auto 14px;width:54px}
.bovt-capabilities .test-card img{width:54px;height:54px;border-radius:50%}
.bovt-capabilities .test-card h5{font-size:13.5px;font-weight:700;margin:0 0 6px}
.bovt-capabilities .test-card p{font-size:11.5px;color:#888;margin:0}

@media (max-width:900px){
  .bovt-capabilities .cap-stats,
  .bovt-capabilities .process-grid,
  .bovt-capabilities .material-grid,
  .bovt-capabilities .custom-grid,
  .bovt-capabilities .test-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .bovt-capabilities .cap-stats,
  .bovt-capabilities .process-grid,
  .bovt-capabilities .material-grid,
  .bovt-capabilities .custom-grid,
  .bovt-capabilities .test-grid{grid-template-columns:1fr}
  .bovt-capabilities .matrix-table{font-size:11.5px}
  .bovt-capabilities .matrix-table th,
  .bovt-capabilities .matrix-table td{padding:10px}
}