/* =============================================================================
   Trust badges — secure-checkout + accepted-payment signals (ki-peptides)
   Used on the Cart (compact) and the About page (full). Token-driven so it reads
   on both light and dark surfaces; the card tiles carry their own brand colours.
   ========================================================================== */
.ki-trust {
  text-align: center;
  color: var(--ki-on-surface);
}

/* Compact (cart): a tidy strip under the cart, set off by a hairline. */
.ki-trust--compact {
  max-width: 640px;
  margin: clamp(2rem, 5vw, 3.5rem) auto 0;
  padding-top: clamp(1.5rem, 3vw, 2rem);
  border-top: 1px solid var(--ki-outline-variant);
}

/* Full (about): a centred block; about.php wraps it in a .ki-section. */
.ki-trust--full { max-width: 760px; margin-inline: auto; }
.ki-trust__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--ki-font-label);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ki-secondary);
  margin: 0 0 0.75rem;
}
/* Leading dot to match the other section eyebrows. */
.ki-trust__eyebrow::before {
  content: "";
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--ki-secondary);
  box-shadow: 0 0 6px rgba(0, 104, 119, 0.8);
  flex-shrink: 0;
}
.ki-trust__heading {
  font-family: var(--ki-font-display);
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 300;
  color: var(--ki-on-surface);
  margin: 0 0 1.75rem;
}

/* Secure line + cards row */
.ki-trust__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(1rem, 3vw, 2rem);
}
.ki-trust__secure {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--ki-font-display);
  font-size: 0.9375rem;
  color: var(--ki-on-surface);
}
.ki-trust__lock { color: var(--ki-secondary); flex-shrink: 0; }
.ki-trust__secure strong { font-weight: 600; }
.ki-trust__sub { color: var(--ki-on-surface-muted); }

.ki-trust__cards {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ki-trust__cards li { display: flex; line-height: 0; }
.ki-trust__cards svg {
  border-radius: 4px;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.12));
}

/* Full-variant trust points */
.ki-trust__points {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(1.25rem, 4vw, 2.75rem);
  margin: clamp(1.75rem, 4vw, 2.5rem) 0 0;
  padding: 0;
  list-style: none;
}
.ki-trust__points li {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--ki-font-label);
  font-size: 0.8125rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--ki-on-surface-muted);
}
.ki-trust__points svg { color: var(--ki-secondary); flex-shrink: 0; }

@media (max-width: 600px) {
  .ki-trust__secure { font-size: 0.875rem; }
  .ki-trust__sub { display: none; } /* tighten on phones */
}
