:root { --ink:#18161f; --muted:#696575; --paper:#f7f4ed; --surface:#fffdf8; --line:#ded8ca; --violet:#6253d5; --mint:#2f8d6c; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.6; }
a { color:#5548bc; }
.trust-topbar { position:sticky; top:0; z-index:30; min-height:68px; padding:0 clamp(20px,6vw,78px); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:24px; background:rgba(247,244,237,.94); backdrop-filter:blur(18px); }
.trust-brand { display:flex; align-items:center; gap:10px; color:var(--ink); font-weight:820; text-decoration:none; }
.trust-brand img { width:34px; height:34px; }
.trust-topbar nav { display:flex; align-items:center; gap:18px; }
.trust-topbar nav a { color:#5d5765; font-size:12px; font-weight:750; text-decoration:none; }
.trust-topbar nav a:focus-visible { outline:3px solid rgba(109,80,230,.24); outline-offset:4px; border-radius:4px; }
.trust-topbar nav a.primary { padding:9px 13px; border-radius:10px; background:#1b1921; color:#fff; }
.trust-main { width:min(900px,calc(100% - 40px)); margin:0 auto; padding:clamp(48px,8vw,88px) 0 90px; }
.trust-kicker { margin:0 0 12px; color:var(--violet); font-size:10px; font-weight:850; letter-spacing:.13em; text-transform:uppercase; }
.trust-main h1 { max-width:800px; margin:0; font-size:clamp(39px,6vw,66px); letter-spacing:-.06em; line-height:.98; }
.trust-lead { max-width:720px; margin:22px 0 38px; color:#56515e; font-size:clamp(16px,2vw,19px); }
.trust-meta { margin:0 0 34px; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:#fff; color:#68616e; font-size:11px; }
.trust-section { padding:30px 0; border-top:1px solid var(--line); }
.trust-section h2 { margin:0 0 10px; font-size:25px; letter-spacing:-.035em; }
.trust-section h3 { margin:24px 0 7px; font-size:16px; }
.trust-section p, .trust-section li { color:#58525f; font-size:13px; }
.trust-section ul { padding-left:20px; }
.trust-callout { padding:18px 20px; border-left:4px solid var(--mint); border-radius:0 12px 12px 0; background:#eaf7f2; }
.trust-callout strong { display:block; margin-bottom:4px; }
.trust-callout p { margin:0; color:#3e5d51; }
.example-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); overflow:hidden; margin:30px 0; border:1px solid #35313b; border-radius:15px; background:#1d1a22; color:#fff; }
.example-summary div { min-width:0; padding:17px; border-left:1px solid #37323e; display:grid; gap:5px; }
.example-summary div:first-child { border-left:0; }
.example-summary span { color:#9f98a8; font-size:8px; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.example-summary strong { font-size:19px; letter-spacing:-.03em; }
.example-summary .selected { background:#21483c; }
.example-summary .selected strong { color:#8ce2c3; }
.example-table { width:100%; margin:22px 0; border-collapse:collapse; border:1px solid var(--line); background:#fff; font-size:12px; }
.example-table th, .example-table td { padding:12px 14px; border-bottom:1px solid #e6e1d8; text-align:left; }
.example-table th { color:#756e79; background:#f2efe8; font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.example-table tr.selected td { background:#eaf7f2; font-weight:750; }
.trust-code { margin:20px 0; padding:17px; overflow:auto; border-radius:13px; background:#1d1a22; color:#f0ebf4; font:12px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace; }
.trust-actions { margin-top:28px; display:flex; gap:12px; flex-wrap:wrap; }
.trust-actions a { padding:11px 15px; border:1px solid #ccc5ba; border-radius:11px; background:#fff; color:#312c39; font-size:12px; font-weight:800; text-decoration:none; }
.trust-actions a.primary { border-color:#1d1a22; background:#1d1a22; color:#fff; }
.trust-footer { min-height:90px; padding:24px clamp(20px,6vw,78px); border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:20px; color:#716b76; font-size:11px; }
.trust-footer nav { display:flex; gap:14px; flex-wrap:wrap; }
.trust-footer a { color:#625b68; text-decoration:none; }
@media (max-width:700px) {
  .trust-topbar { min-height:62px; padding:10px 18px; }
  .trust-topbar nav { gap:11px; justify-content:flex-end; }
  .trust-topbar nav a:nth-child(1), .trust-topbar nav a:nth-child(3) { display:none; }
  .example-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .example-summary div:nth-child(3) { border-left:0; border-top:1px solid #37323e; }
  .example-summary div:nth-child(4) { border-top:1px solid #37323e; }
  .example-table { display:block; overflow-x:auto; white-space:nowrap; }
  .trust-footer { flex-direction:column; }
}
