/* /trust — how the TrustScore works. Tokens from /css/mocopo-theme.css. */

.trust-container { max-width: 960px; margin: 0 auto; padding: 0 1.5rem 5rem; }

.trust-hero { text-align: center; padding: 2.5rem 0 1.5rem; }
.trust-hero h1 { font-size: clamp(1.9rem, 4vw, 2.8rem); font-weight: 800; letter-spacing: -0.02em; color: var(--mc-text); }
.trust-hero p { max-width: 62ch; margin: 1rem auto 0; color: var(--mc-muted); line-height: 1.65; font-size: 1.02rem; }
.trust-hero strong { color: var(--mc-text); }
.gold { color: var(--mc-accent); }

.trust-section { margin-top: 3rem; }
.trust-section > h2 { font-size: 1.4rem; font-weight: 700; color: var(--mc-text); margin-bottom: 0.35rem; }
.trust-lead, .trust-note { color: var(--mc-muted); line-height: 1.6; }
.trust-note { margin-top: 1rem; font-size: 0.9rem; }

/* Score bands — Trustpilot-style colored tiles */
.trust-bands { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.75rem; margin-top: 1.25rem; }
.trust-band { border-radius: 12px; padding: 1rem 0.75rem; text-align: center; border: 1px solid var(--mc-border); background: var(--mc-surface); }
.trust-band-stars { font-size: 1.05rem; letter-spacing: 1px; }
.trust-band-label { font-weight: 800; margin-top: 0.4rem; color: var(--mc-text); }
.trust-band-range { font-size: 0.8rem; color: var(--mc-faint); margin-top: 0.15rem; }
.trust-band.excellent .trust-band-stars { color: #15803d; }
.trust-band.great .trust-band-stars { color: #4ade80; }
.trust-band.average .trust-band-stars { color: var(--mc-amber); }
.trust-band.poor .trust-band-stars { color: #f59e0b; }
.trust-band.bad .trust-band-stars { color: var(--mc-red); }

/* Three weighting factors */
.trust-factors { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 1.25rem; }
.trust-factor { position: relative; border: 1px solid var(--mc-border); border-radius: 14px; padding: 1.25rem; background: var(--mc-surface); }
.trust-factor-num { width: 30px; height: 30px; border-radius: 8px; background: var(--mc-amber); color: var(--mc-on-amber); font-weight: 800; display: flex; align-items: center; justify-content: center; }
.trust-factor h3 { font-size: 1.05rem; font-weight: 700; margin: 0.75rem 0 0.4rem; color: var(--mc-text); }
.trust-factor p { color: var(--mc-muted); line-height: 1.55; font-size: 0.92rem; }
.trust-factor strong { color: var(--mc-text); }
.trust-factor-tag { display: inline-block; margin-top: 0.75rem; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--mc-accent); background: var(--mc-accent-bg); border: 1px solid var(--mc-accent-border); padding: 0.15rem 0.5rem; border-radius: 999px; }

/* Formula */
.trust-formula { margin-top: 1.25rem; }
.trust-formula-section p { margin-top: 1rem; color: var(--mc-muted); line-height: 1.65; max-width: 68ch; }
.trust-formula-section strong { color: var(--mc-text); }

/* Why it can't be gamed */
.trust-why-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-top: 1.25rem; }
.trust-why-card { border: 1px solid var(--mc-border); border-radius: 14px; padding: 1.25rem; background: var(--mc-surface); }
.trust-why-card ion-icon { font-size: 1.5rem; color: var(--mc-accent); }
.trust-why-card strong { display: block; margin: 0.6rem 0 0.3rem; color: var(--mc-text); font-size: 1rem; }
.trust-why-card span { color: var(--mc-muted); line-height: 1.55; font-size: 0.92rem; }

/* Closing callout */
.trust-callout { text-align: center; border: 1px solid var(--mc-accent-border); border-radius: 18px; padding: 2.25rem 1.5rem; background: var(--mc-accent-bg); }
.trust-callout p { max-width: 60ch; margin: 0.6rem auto 0; color: var(--mc-muted); line-height: 1.65; }
.trust-callout strong { color: var(--mc-text); }
.trust-ctas { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; margin-top: 1.5rem; }

@media (max-width: 760px) {
    .trust-bands { grid-template-columns: repeat(2, 1fr); }
    .trust-factors, .trust-why-grid { grid-template-columns: 1fr; }
}
