/* TrustedRouter homepage — composite working mock
   Tokens are listed in design-tokens.json. Module styles below are grouped by module prefix:
   .trnav nav · .trh hero · .trc catalog · .trm migration · .trv verification · .trp pricing · .trs social proof · .trf FAQ · .trft footer */
:root{
  color-scheme:dark;
  --bg:#050706; --panel:#0F1411; --card:#151C18; --canvas:#070A08;
  --cream:#edf8f5; --text:#C3C9C3; --muted:#98A198; --faint:#adbbb2;
  --rule:#232B26; --rule-2:#33403A; --mint:#cce8d7; --zdr:#E2C98A; --e2ee:#D3D6F0; --stop:#F0B3A6;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--cream)}
body{font:400 15px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit}
section{scroll-margin-top:72px}
.page{max-width:1440px;margin:0 auto;overflow-x:clip}.trh .hero>*, .trm .body>*, .trf>*, .trs .sp>*{min-width:0}
.trh .labs{max-width:min(460px,100%)}

/* proposed TR module mock: fixed TrustedRouter look in both themes */

details.was summary{cursor:pointer;font:500 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding-block:4px}
details.was[open] summary{margin-bottom:12px}
/* hero mock */
.trh{background:#050706;color:#edf8f5;font-family:var(--sans)}
.trh .hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:48px;align-items:center;padding:64px 48px 72px}
.trh .copy{display:flex;flex-direction:column;gap:22px}
.trh h2{margin:0;font-family:var(--heading-font, Archivo),Arial,sans-serif;font-weight:400;font-size:52px;line-height:1.04;letter-spacing:-.015em;color:#edf8f5;text-wrap:balance}
.trh h2 em{font-style:italic;color:#cce8d7}
.trh .sub{font-size:16px;line-height:1.5;color:#AEB3AA;max-width:38ch;min-height:3em}
.trh .sub b{color:#edf8f5;font-weight:500}
.trh .s{position:relative;font:500 13px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#edf8f5;padding:6px 0;border-bottom:1px dotted #5E6B62;cursor:help;outline:none}
.trh .s:hover,.trh .s:focus-visible,.trh .s.on{color:#cce8d7;border-bottom-color:#cce8d7}
.trh .tip{min-height:42px;font-size:14px;line-height:1.45;color:#AEB3AA;max-width:40ch;transition:opacity .15s}
.trh .tip b{color:#edf8f5;font-weight:500}
.trh .cta{display:flex;align-items:center;gap:22px}
.trh .labs{margin-top:14px;overflow:hidden;max-width:460px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.trh .labtrack{display:flex;gap:28px;width:max-content}
@media (prefers-reduced-motion:no-preference){.trh .labtrack{animation:labs 40s linear infinite}.trh .labs:hover .labtrack{animation-play-state:paused}}
@keyframes labs{to{transform:translateX(calc(-50% - 14px))}}
.trh .lab{display:inline-flex;align-items:center;gap:9px;white-space:nowrap;font-size:13.5px;color:#bac9bf}
.trh .lab img{width:20px;height:20px;border-radius:4px;filter:grayscale(1) contrast(1.1);opacity:.8}
/* route panel */
.trh .route{border:1px solid #232B26;background:#0F1411;padding:22px 22px 18px;display:flex;flex-direction:column;gap:0;position:relative}
.trh .k{font:500 10.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#adbbb2}
.trh .node{border:1px solid #2A332D;background:#121915;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:14px;transition:opacity .2s,border-color .2s,box-shadow .2s}
.trh .node .t{font-size:14px;color:#edf8f5;font-weight:500}
.trh .node .d{font:400 12px/1.5 var(--mono);color:#98A198}
.trh .node .col{display:flex;flex-direction:column;gap:3px;min-width:0}

@keyframes flow{to{background-position:0 8px}}
.trh .tag{font:500 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:4px 6px;border:1px solid #33403A;color:#AEB3AA;border-radius:2px;white-space:nowrap}
.trh .row{display:flex;gap:6px;flex-wrap:wrap}
.trh .clouds{display:flex;gap:4px}
.trh .clouds span{font:500 10px/1 var(--mono);color:#98A198;border:1px solid #2A332D;padding:4px 5px;border-radius:2px}
.trh .cost{font:500 15px/1 var(--mono);color:#edf8f5;font-variant-numeric:tabular-nums}
/* highlight on S hover */
.trh [data-s]{transition:opacity .2s,border-color .2s,box-shadow .2s}
/* catalog mock */
.trc{background:#050706;color:#edf8f5;font-family:var(--sans);padding:64px 48px 56px;display:flex;flex-direction:column;gap:22px}
.trc .chd{display:flex;justify-content:space-between;align-items:end;gap:24px}
.trc h2{margin:0;font-family:var(--heading-font, Archivo),Arial,sans-serif;font-weight:400;font-size:36px;line-height:1.1;letter-spacing:-.01em;color:#edf8f5}
.trc .all{color:#edf8f5;font-size:14.5px;border-bottom:1px solid #3A443D;padding-bottom:2px;white-space:nowrap}
.trc .fl{display:flex;gap:40px;align-items:center;border-bottom:1px solid #1E2621;padding-bottom:12px}
.trc .fl button{all:unset;cursor:pointer;font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#adbbb2;padding:4px 0;border-bottom:1px solid transparent}
.trc .fl button[aria-pressed="true"]{color:#edf8f5;border-bottom-color:#cce8d7}
.trc .fl button:focus-visible{outline:1px solid #cce8d7;outline-offset:3px}
.trc .fl .cnt{margin-left:auto;font:400 12px/1 var(--mono);color:#adbbb2}
.trc table{width:100%;min-width:0;border-collapse:collapse;background:transparent}
.trc th{background:transparent;text-align:left;font:500 10.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#adbbb2;padding:0 12px 10px;border-bottom:1px solid #1E2621}
.trc td{padding:14px 12px;border-bottom:1px solid #1A211D;vertical-align:middle;color:#edf8f5}
.trc tr[hidden],.trc tbody[hidden]{display:none}
.trc tbody tr{transition:background .15s}
.trc tbody tr:hover{background:#111713}
.trc .m{display:flex;align-items:center;gap:12px}
.trc .m img{width:30px;height:30px;border-radius:5px;flex:none}
.trc .m b{display:block;font-weight:500;font-size:14.5px;color:#edf8f5}
.trc .m code{font:400 12px/1.4 var(--mono);color:#adbbb2}
.trc .tags{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.trc .tg{font:500 11px/1 var(--sans);padding:5px 7px;border:1px solid #3E5A4A;color:#CFE3D6;background:#132019;border-radius:2px}
.trc .tg.z{border-color:#5A4F2E;color:#E2C98A;background:#1C1A10}
.trc .tg.e{border-color:#6B6F8E;color:#D3D6F0;background:#16172A}
.trc .pc{font:400 12px/1 var(--mono);color:#adbbb2;white-space:nowrap}
.trc .num{font:400 13.5px/1.35 var(--mono);color:#edf8f5;font-variant-numeric:tabular-nums;white-space:nowrap}
.trc .num small{display:block;font-size:10.5px;color:#adbbb2;letter-spacing:.06em;text-transform:uppercase}
.trc .cft{font-size:12px;color:#adbbb2}
.tipt{position:relative;cursor:help;outline:none}
.tipt::after{content:attr(data-tip);position:absolute;left:0;bottom:calc(100% + 8px);width:240px;padding:9px 11px;background:#edf8f5;color:#111410;font:400 12.5px/1.45 var(--sans);letter-spacing:0;text-transform:none;border-radius:3px;box-shadow:0 8px 24px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(3px);pointer-events:none;z-index:5;white-space:normal;text-decoration:none}
.tipt:hover::after,.tipt:focus-visible::after{opacity:1;visibility:visible;transform:none}
@media (prefers-reduced-motion:no-preference){.tipt::after{transition:opacity .12s,transform .12s,visibility .12s}}
/* migration mock */
.trm{background:#050706;color:#edf8f5;font-family:var(--sans);padding:64px 48px}
.trm .box{border:1px solid #232B26;background:#0F1411}
.trm .facts{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #232B26}
.trm .facts span{padding:13px 16px;text-align:center;font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#98A198;border-right:1px solid #232B26}
.trm .facts span:last-child{border-right:0}
.trm .body{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.trm .l{padding:32px 32px 28px;display:flex;flex-direction:column;gap:18px;border-right:1px solid #232B26}
.trm h2{margin:0;font-family:var(--heading-font, Archivo),Arial,sans-serif;font-weight:400;font-size:34px;line-height:1.08;letter-spacing:-.01em;color:#edf8f5;text-wrap:balance}
.trm h2 .bu{font-family:var(--mono);font-size:.84em;letter-spacing:-.02em}
.trm .docs{margin-top:auto;padding-top:18px;border-top:1px solid #1E2621;display:flex;gap:20px;align-items:baseline;font-size:13.5px;color:#adbbb2}
.trm .docs span{border-bottom:1px solid #2F3731;padding-bottom:1px}
.trm .lede{font-size:15px;line-height:1.5;color:#AEB3AA;max-width:36ch}
.trm .field{display:flex;flex-direction:column;gap:6px}
.trm .k{font:500 10.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#adbbb2}
.trm .val{display:flex;align-items:center;gap:10px;border:1px solid #2A332D;background:#121915;padding:0 6px 0 12px;height:40px}
.trm .val code{font:400 13px/1.5 var(--mono);color:#edf8f5;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trm .cp{all:unset;cursor:pointer;font:500 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#AEB3AA;border:1px solid #33403A;padding:7px 9px;border-radius:2px}
.trm .cp:hover,.trm .cp:focus-visible{color:#edf8f5;border-color:#cce8d7}
.trm .acts{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px}
.trm .agent{all:unset;cursor:pointer;background:#edf8f5;color:#111410;font:500 15px/1 var(--sans);padding:13px 16px;border-radius:2px;display:inline-flex;gap:9px;align-items:center}
.trm .agent:focus-visible{outline:2px solid #cce8d7;outline-offset:2px}
.trm .credit{font-size:13px;color:#adbbb2}
.trm .credit b{color:#edf8f5;font-weight:500}
.trm .r{display:flex;flex-direction:column;min-width:0}
.trm .ph2{display:flex;align-items:center;gap:4px;padding:8px 10px;border-bottom:1px solid #232B26}
.trm .tab{all:unset;cursor:pointer;font:500 12px/1 var(--mono);color:#adbbb2;padding:8px 10px;border-radius:2px}
.trm .tab[aria-selected="true"]{color:#edf8f5;background:#18211C}
.trm .tab.ag[aria-selected="true"]{color:#111410;background:#cce8d7}
.trm .from{margin-left:auto;display:flex;align-items:center;gap:6px;font:400 11.5px/1 var(--mono);color:#adbbb2}
.trm .from button{all:unset;cursor:pointer;color:#adbbb2;padding:6px 7px;border:1px solid transparent;border-radius:2px}
.trm .from button[aria-pressed="true"]{color:#edf8f5;border-color:#33403A}
.trm pre{margin:0;flex:1;padding:22px 22px;font:400 13px/1.75 var(--mono);color:#C9CFC8;overflow-x:auto;white-space:pre;background:transparent;border:0;min-height:330px}
.trm pre .del{display:block;background:#2A1512;color:#E6A597;margin:0 -22px;padding:0 22px}
.trm pre .add{display:block;background:#12261A;color:#A8DDBB;margin:0 -22px;padding:0 22px}
.trm pre .cm{color:#adbbb2}
.trm pre.prompt{white-space:pre-wrap;color:#edf8f5;font-size:13px;line-height:1.7}
.trm .pf{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;border-top:1px solid #232B26}
.trm .pf .hint{font-size:12.5px;color:#adbbb2}
.trm .links{display:flex;gap:18px;font-size:13px;color:#adbbb2}
.trm .links span{border-bottom:1px solid #2F3731;padding-bottom:1px}
/* verification + reliability mock */
.trv{background:#050706;color:#edf8f5;font-family:var(--sans);padding:64px 48px;display:flex;flex-direction:column;gap:28px}
.trv .vh{display:block}
.trv h2{margin:0;font-family:var(--heading-font, Archivo),Arial,sans-serif;font-weight:400;font-size:40px;line-height:1.06;letter-spacing:-.012em;color:#edf8f5;text-wrap:balance}
.trv .vh p{font-size:15px;line-height:1.5;color:#AEB3AA;max-width:36ch;justify-self:end}
.trv .card{border:1px solid #29332D;background:#151C18;display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0}
.trv .cap{padding:18px 22px 20px;display:flex;flex-direction:column;gap:6px;align-self:stretch}
.trv .cap .top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.trv .cap b{font-weight:500;font-size:16px;color:#edf8f5}
.trv .cap p{font-size:13.5px;line-height:1.5;color:#C3C9C3;margin:0}
.trv .cap a.go{text-decoration:none;font-size:13px;color:#edf8f5;border-bottom:1px solid #3A443D;padding-bottom:1px;align-self:flex-start;margin-top:4px}
.trv .flow{display:grid;grid-template-columns:1fr auto 1.15fr auto 1fr;align-items:center;gap:8px}
.trv .clouds{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;position:relative}
.trc .alias{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:14px 12px;border:1px solid #232B26;background:#0F1411}
.trc .alk{font-size:14px;color:#edf8f5;margin-right:10px}
.trc .alp{font:400 13px/1 var(--mono);color:#adbbb2}
.trc .alc{all:unset;position:relative;cursor:pointer;font:500 13px/1 var(--mono);color:#edf8f5;border:1px solid #33403A;background:#141C18;padding:7px 10px;border-radius:2px}
.trc .alc:hover,.trc .alc:focus-visible{border-color:#cce8d7;color:#cce8d7}
/* pricing mock */
.trp .ph2{display:flex;justify-content:space-between;align-items:end;gap:24px}
.trp .terms{display:flex;flex-wrap:wrap;gap:6px 0;font-size:14.5px;color:#C3C9C3;margin-top:-10px}
.trp .terms span:not(:last-child)::after{content:"·";margin:0 12px;color:#5E6B62}
.trp .terms b{color:#edf8f5;font-weight:500}
/* social proof mock */
.trs{background:#050706;color:#edf8f5;font-family:var(--sans);padding:64px 48px}
.trs .sp{border:1px solid #29332D;background:#151C18;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
.trs .stat{padding:32px 32px 28px;display:flex;flex-direction:column;gap:14px;border-right:1px solid #29332D}
.trs .who{font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#98A198}
.trs .nums{margin:0;font-family:var(--heading-font, Archivo),Arial,sans-serif;font-weight:400;font-size:30px;line-height:1.18;color:#edf8f5;letter-spacing:-.01em}
.trs .body{font-size:14px;line-height:1.5;color:#C3C9C3;max-width:44ch;margin:0}
.trs a.go{font-size:13.5px;color:#edf8f5;border-bottom:1px solid #3A443D;padding-bottom:1px;text-decoration:none;align-self:flex-start;margin-top:auto}
.trs .q{padding:32px 36px 28px;display:flex;flex-direction:column;justify-content:center;gap:16px;background:#070A08}
.trs blockquote{margin:0;font-family:var(--heading-font, Archivo),Arial,sans-serif;font-style:italic;font-size:24px;line-height:1.32;color:#edf8f5;text-wrap:balance}
.trs .press{grid-column:1/-1;border-top:1px solid #29332D;display:flex;align-items:center;gap:22px;padding:16px 32px}
.trs .press .src{font:600 15px/1 var(--sans);color:#edf8f5;letter-spacing:-.01em;white-space:nowrap}
.trs .press .src small{display:block;font:500 10px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#adbbb2;margin-bottom:4px}
.trs .press p{margin:0;font-size:14.5px;line-height:1.45;color:#C3C9C3;flex:1}
.trs .press a{font-size:13.5px;color:#edf8f5;border-bottom:1px solid #3A443D;padding-bottom:1px;text-decoration:none;white-space:nowrap}
/* faq mock */
.trf{background:#050706;color:#edf8f5;font-family:var(--sans);padding:72px 48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:56px;align-items:start}
.trf h2{margin:0;font-family:var(--heading-font, Archivo),Arial,sans-serif;font-weight:400;font-size:36px;line-height:1.1;letter-spacing:-.01em;color:#edf8f5;text-wrap:balance;position:sticky;top:0}
.trf .ql{border-top:1px solid #29332D}
.trf details{border-bottom:1px solid #29332D}
.trf summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 4px;font-size:17px;color:#edf8f5}
.trf summary::-webkit-details-marker{display:none}
.trf summary::after{content:"+";font:300 22px/1 var(--sans);color:#98A198;transition:transform .15s}
.trf details[open] summary::after{transform:rotate(45deg);color:#cce8d7}
.trf summary:hover{color:#cce8d7}
.trf summary:focus-visible{outline:1px solid #cce8d7;outline-offset:2px}
.trf details p{margin:0;padding:0 48px 24px 4px;font-size:15px;line-height:1.6;color:#C3C9C3;max-width:62ch}
/* footer mock */
.trft{background:#050706;color:#edf8f5;font-family:var(--sans)}
.trft .cols{display:grid;grid-template-columns:1.6fr repeat(5,1fr);gap:28px;padding:44px 48px 36px}
.trft .brand{display:flex;flex-direction:column;gap:14px}
.trft .brand img{height:22px;width:auto;align-self:flex-start}
.trft .brand p{margin:0;font-size:13.5px;line-height:1.5;color:#98A198;max-width:26ch}
.trft .live{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font:400 12px/1 var(--mono);color:#C3C9C3;border:1px solid #29332D;padding:7px 9px;align-self:flex-start}
.trft .live i{width:6px;height:6px;border-radius:50%;background:#cce8d7}
.trft .col{display:flex;flex-direction:column;gap:9px}
.trft .col h4{margin:0 0 4px;font:500 10.5px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#adbbb2}
.trft .col span{font-size:13.5px;color:#C3C9C3;line-height:1.35}
.trft .col span.hot{color:#edf8f5}
.trft .base{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 48px 24px;border-top:1px solid #1A211D;font:400 12px/1 var(--mono);color:#adbbb2}
.trft .base .r{display:flex;gap:18px}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .trh .hero{grid-template-columns:1fr;gap:40px;padding:48px 24px 56px}
  .trc,.trm,.trv,.trs,.trf{padding-inline:24px}
  .trft .cols{grid-template-columns:repeat(3,1fr);padding-inline:24px}
  .trft .brand{grid-column:1/-1}
  .trft .base{padding-inline:24px}

}
@media (max-width:880px){

  .trh h2{font-size:40px}
  .trc .chd{flex-direction:column;align-items:flex-start}
  .trc table{display:block;overflow-x:auto}
  .trm .body{grid-template-columns:1fr}
  .trm .l{border-right:0;border-bottom:1px solid #232B26}
  .trm .facts{grid-template-columns:1fr}
  .trm .facts span{border-right:0;border-bottom:1px solid #232B26}.trv .flow{grid-template-columns:1fr;justify-items:stretch}
  .trp .ph2{flex-direction:column;align-items:flex-start}
  .trs .sp{grid-template-columns:1fr}
  .trs .stat{border-right:0;border-bottom:1px solid #29332D}
  .trs .press{flex-direction:column;align-items:flex-start}
  .trf{grid-template-columns:1fr;gap:28px}
  .trft .cols{grid-template-columns:repeat(2,1fr)}
  .trft .base{flex-direction:column;align-items:flex-start;gap:12px}
}
@media (max-width:520px){
  .trh h2{font-size:34px}
  .trc th:nth-child(5),.trc td:nth-child(5){display:none}
  .trft .cols{grid-template-columns:1fr 1fr}
}

@media (max-width:880px){
  .trm .ph2{flex-wrap:wrap}
  .trm .from{margin-left:0;width:100%;padding:4px 10px 2px}
}
@media (max-width:600px){
  .trc table{display:block;overflow:visible}
  .trc thead{display:none}
  .trc tbody{display:block}
  .trc tbody[hidden]{display:none}
  .trc tr{display:grid;grid-template-columns:1fr 1fr;column-gap:16px;padding:14px 0;border-bottom:1px solid #1A211D}
  .trc td{display:block;border:0;padding:3px 0}
  .trc td:nth-child(1),.trc td:nth-child(2){grid-column:1/-1}
  .trc td:nth-child(2){padding:8px 0}
  .trc td.num::before{display:block;font:500 10px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#adbbb2}
  .trc td:nth-child(3)::before{content:"Input / 1M"}
  .trc td:nth-child(4)::before{content:"Output / 1M"}
  .trc td.num small{display:inline;margin-right:4px}
  .trc .fl{gap:22px;flex-wrap:wrap}
  .trc .fl .cnt{margin-left:0;width:100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
