/* data-bi-credentials-proof
 *
 * Reusable credential-and-proof band: partner badge row over a two-row proof matrix.
 * Row 1 is standing BI credentials, row 2 is migration performance. The two rows are
 * deliberately different grounds so the reader gets the credential claim first.
 * Approved as a new library template candidate (manifest section `data-bi-credentials-proof`).
 * Depends on: css/tokens.css, assets-premium/fonts/fonts.css.
 *
 * Library spacing standard: section root renders 120px top and bottom padding, with
 * 56px between the title/description block and the section content.
 */

.data-bi-credentials-proof,
.data-bi-credentials-proof *{box-sizing:border-box}

.data-bi-credentials-proof{
  scroll-margin-top:var(--hdr-h);
  width:100vw;
  max-width:none;
  padding-block:var(--section-padding-y);
  border-top:1px solid var(--rule);
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
}

.data-bi-credentials-proof__in{width:var(--shell);margin:0 auto}

.data-bi-credentials-proof__head{display:flex;flex-direction:column;gap:18px}
.data-bi-credentials-proof__kicker{color:var(--bronze)}
.data-bi-credentials-proof__title{color:var(--deep)}

.data-bi-credentials-proof__badges{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  margin-top:56px;
  background:var(--rule);
  border:1px solid var(--rule);
}
.data-bi-credentials-proof__badge{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:150px;
  padding:26px 22px;
  background:var(--paper);
}
.data-bi-credentials-proof__badge img{width:auto;max-width:100%;max-height:96px;object-fit:contain}

.data-bi-credentials-proof__matrix{display:flex;flex-direction:column;margin-top:32px}

.data-bi-credentials-proof__row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
}
.data-bi-credentials-proof__row-label{
  display:flex;
  align-items:center;
  gap:14px;
  padding:0 0 14px;
  color:var(--bronze);
}
.data-bi-credentials-proof__row-label::after{
  content:'';
  flex:1;
  height:1px;
  background:linear-gradient(90deg,var(--gold),rgba(212,175,55,0));
}
.data-bi-credentials-proof__row + .data-bi-credentials-proof__row-label{padding-top:34px}

.data-bi-credentials-proof__metric{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:32px 28px 34px;
}

/* Row 1: standing credentials carry the emphasis ground. */
.data-bi-credentials-proof__row--credentials .data-bi-credentials-proof__metric{
  background:var(--deep);
  color:var(--on-dark-soft);
}
.data-bi-credentials-proof__row--credentials .data-bi-credentials-proof__figure{color:var(--gold)}
.data-bi-credentials-proof__row--credentials .data-bi-credentials-proof__note{color:var(--paper)}

/* Row 2: migration performance sits on paper under a gold rule. */
.data-bi-credentials-proof__row--migration .data-bi-credentials-proof__metric{
  background:var(--paper);
  border:1px solid var(--rule);
  border-top:3px solid var(--gold);
}
.data-bi-credentials-proof__row--migration .data-bi-credentials-proof__figure{color:var(--deep)}
.data-bi-credentials-proof__row--migration .data-bi-credentials-proof__note{color:var(--grey-mid)}

.data-bi-credentials-proof__figure{
  font-family:var(--display);
  font-weight:var(--display-weight);
  font-size:clamp(34px,3vw,44px);
  line-height:1;
  letter-spacing:0;
}
.data-bi-credentials-proof__note{max-width:30ch}

@media (max-width:1040px){
  .data-bi-credentials-proof__badges{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .data-bi-credentials-proof__row{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:620px){
  .data-bi-credentials-proof__badges{grid-template-columns:minmax(0,1fr)}
  .data-bi-credentials-proof__badge{min-height:130px}
}

/* Template title standard: section H2 */
[data-section="data-bi-credentials-proof"][data-section="data-bi-credentials-proof"] h2,
.data-bi-credentials-proof.data-bi-credentials-proof h2{
  font-size:50px !important;
  font-weight:500 !important;
  line-height:var(--lh-tight) !important;
  overflow-wrap:anywhere;
}

/* Title/description stack standard: main title stacks above description at 75% content width. */
[data-section="data-bi-credentials-proof"] .data-bi-credentials-proof__title{
  width:var(--title-description-width) !important;
  max-width:var(--title-description-width) !important;
  margin-left:0 !important;
  margin-right:auto !important;
}
