/* trust: "Pure data. Your call." (E2, SPEC 4.9). Every selector starts with #trust.
   Background night -> dawn. Three statements (columns on desktop, stacked below 1100) with the small
   redaction card inside statement 03, then five FAQ rows. Default CSS is the final (struck) state;
   trust.js sets the start states only when it animates. */
#trust{background:linear-gradient(180deg,var(--night) 0%,var(--night) 55%,var(--dawn) 100%);
  padding-block:clamp(96px,14vh,160px) clamp(64px,10vh,96px)}

/* faint Loess Hills crop behind the content (desktop only), drifted by trust.js.
   The box carries a static top fade, so the photo rises out of the night with no edge at the seam
   (the box never moves; only the image inside it drifts). */
#trust .trust-terrain{display:none}
@media (min-width:1100px){
  #trust .trust-terrain{display:block;position:absolute;left:0;right:0;top:0;height:84%;z-index:0;pointer-events:none;overflow:clip;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.35) 14%,#000 30%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.35) 14%,#000 30%)}
}
/* the bottom fade sits on the moving layer itself, so the drift is a plain layer translate */
#trust .trust-terrain-img{position:absolute;left:0;right:0;top:0;height:112%;opacity:.16;
  background-repeat:no-repeat;background-size:170% auto;background-position:16% 0;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 42%,transparent 86%);
  mask-image:linear-gradient(180deg,#000 0%,#000 42%,transparent 86%)}
#trust .trust-terrain.is-near .trust-terrain-img{background-image:url(../assets/terrain-2k.jpg)}
#trust .trust-in{position:relative;z-index:1}

/* head */
#trust .trust-head{max-width:880px}
#trust .trust-eyebrow{color:var(--ink-2);margin-bottom:22px}
#trust .trust-sub{margin-top:clamp(20px,3vh,28px);max-width:46ch}

/* three statements */
#trust .trust-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap);align-items:start;
  margin-top:clamp(72px,10vh,112px)}
#trust .trust-pt{min-width:0;padding:28px 28px 0 0;border-top:1px solid var(--hair-2)}
#trust .trust-pt:last-child{padding-right:0}
#trust .trust-idx{display:block;font:500 .875rem/1 var(--f-mono);letter-spacing:.14em;color:var(--lime);font-variant-numeric:tabular-nums}
#trust .trust-pt .h3{margin-top:22px;color:var(--ink)}
#trust .trust-pt .body{margin-top:10px;color:var(--ink-2);max-width:36ch}

/* redaction card: small, never the focal point (max 280px) */
#trust .trust-card{margin:28px 0 0;width:100%;max-width:280px;padding:14px 16px 8px;background:var(--night-2);
  border:1px solid var(--hair-2);border-radius:var(--r-card)}
#trust .trust-card-h{font:500 .875rem/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding-bottom:8px}
#trust .trust-rows{margin:0}
#trust .tr-row{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 10px;padding:8px 0;border-top:1px solid var(--hair)}
#trust .tr-row dt{position:relative;font:400 .875rem/1.35 var(--f-sans);color:var(--ink-2)}
#trust .tr-row dd{margin:0 0 0 auto;font:600 .875rem/1.35 var(--f-sans);color:var(--ink);text-align:right}
#trust .tr-row .tr-num{font:500 .875rem/1.35 var(--f-mono);font-variant-numeric:tabular-nums}
#trust .tr-row.is-cut .tr-k{opacity:.72}  /* struck, yet >= 4.5:1 on --night-2 (about 5.2:1); the clay strike and REMOVED carry the meaning */
#trust .tr-row.is-cut dd{font:500 .875rem/1.35 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--clay)}
#trust .tr-strike{position:absolute;left:-2px;right:-2px;top:55%;height:1px;background:var(--clay);transform-origin:0 50%}
#trust .tr-dot{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:var(--lime);vertical-align:.08em}

/* FAQ: hairline rows, a + that rotates to x */
#trust .trust-faq{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start;
  margin-top:clamp(104px,14vh,168px)}
#trust .trust-faq-h{grid-column:1 / span 3;color:var(--ink-2);padding-top:26px}
#trust .trust-faq-list{grid-column:4 / -1;border-top:1px solid var(--hair-2)}
#trust .trust-faq-list details{border-bottom:1px solid var(--hair-2)}
#trust .trust-faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-inline:-12px;padding:24px 12px;list-style:none;
  font:500 clamp(1.2rem,1.7vw,1.5rem)/1.3 var(--f-display);letter-spacing:-.02em;color:var(--ink);border-radius:2px}
#trust .trust-faq-list summary:focus-visible{outline-offset:-2px;border-radius:var(--r-btn)}
#trust .trust-faq-list summary::-webkit-details-marker{display:none}
#trust .trust-faq-list summary::marker{content:""}
#trust .faq-x{position:relative;flex:none;width:18px;height:18px;transition:transform .35s var(--ease-out)}
#trust .faq-x::before,#trust .faq-x::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;margin-top:-.75px;
  background:var(--ink-2);border-radius:1px;transition:background-color .2s}
#trust .faq-x::after{transform:rotate(90deg)}
#trust .trust-faq-list details[open] .faq-x{transform:rotate(45deg)}
#trust .trust-faq-list summary:hover .faq-x::before,#trust .trust-faq-list summary:hover .faq-x::after{background:var(--ink)}
#trust .faq-a{padding:0 48px 28px 0;margin-top:6px;color:var(--ink-2);max-width:64ch}

@media (max-width:1099px){
  #trust .trust-points{grid-template-columns:minmax(0,1fr);row-gap:40px;max-width:640px}
  #trust .trust-pt{padding-right:0}
  #trust .trust-pt .body{max-width:52ch}
  #trust .trust-faq-h{grid-column:1 / -1;padding-top:0;margin-bottom:16px}
  #trust .trust-faq-list{grid-column:1 / -1}
}
/* phones: the page's phone --sec-pad (base.css) at the top, tighter gaps between the head, the three
   statements and the FAQ. Each statement hangs its lime index in a 36px gutter, level with the title,
   so the title, text and card share one left edge and the index costs no line of its own. */
@media (max-width:759px){
  #trust{padding-block:var(--sec-pad) clamp(56px,8vh,72px)}
  #trust .trust-eyebrow{margin-bottom:18px}
  #trust .trust-points{row-gap:0;margin-top:48px}
  #trust .trust-pt{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:baseline;padding:22px 0 26px}
  #trust .trust-pt:last-child{padding-bottom:0}
  #trust .trust-idx{grid-column:1;grid-row:1}
  #trust .trust-pt .h3{grid-column:2;grid-row:1;margin-top:0}
  #trust .trust-pt .body{grid-column:2;margin-top:8px}
  #trust .trust-card{grid-column:2;margin-top:20px}
  #trust .trust-faq{margin-top:64px}
  #trust .trust-faq-h{margin-bottom:12px}
  #trust .faq-a{padding-right:0;padding-bottom:22px}
  #trust .trust-faq-list summary{padding:18px 12px}
}