/* ==========================================================================
   TRUST & SECURITY · V8, new design (15 Oct 2026)
   The existing page's words, every section drawn fresh in the homepage's
   language; none of the old inner-page section styles are loaded.
   ========================================================================== */
.ts-head { max-width: 1120px; margin-inline: auto; text-align: center; }
.ts-head .lede { margin: 18px auto 0; max-width: 50em; text-wrap: pretty; }
.page-ts main .h2 { text-wrap: balance; }
.page-ts .section--deep .h2 em { color: var(--accent-lift); }
.page-ts .section--deep .ts-head .lede { color: var(--on-deep-2); }
[data-mascot] > svg, [data-ts-herobot] > svg { display: block; width: 100%; height: 100%; overflow: visible; }
.ts-b { margin: 0; max-width: 88%; padding: 10px 13px; font: 500 14px/1.42 var(--font); transition: opacity .4s, transform .45s var(--ease-out); }
.ts-b--in { align-self: flex-end; background: #4857C2; color: #fff; border-radius: 16px 16px 5px 16px; }
.ts-b--out { align-self: flex-start; background: var(--paper); color: var(--ink); border-radius: 16px 16px 16px 5px; }
.ts-b--team { align-self: flex-start; background: #FFEDF4; color: var(--ink); border-radius: 16px 16px 16px 5px; }
.ts-b--team small { display: block; margin-bottom: 3px; font: 700 11px/1 var(--font); color: #A8264F; }
.ts-split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 5.5vw, 88px); align-items: center; }
.ts-split--flip { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); }
.ts-split__copy .lede { max-width: 30em; }
.ts-list { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 10px; }
.ts-list li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; align-items: start; font: 400 var(--fs-p)/1.5 var(--font); color: var(--body); }
.ts-list li::before { content: ''; width: 24px; height: 24px; border-radius: 50%; background: var(--green-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23167947' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='m3.6 8.4 2.9 2.9 5.9-6.3'/%3E%3C/svg%3E") center / 13px no-repeat; }
.ts-list b { color: var(--ink); font-weight: 700; }
.ts-list--plain li { font-weight: 600; color: var(--ink); }

/* --- 1 · HERO --------------------------------------------------------------- */
.ts-hero { overflow: hidden; padding-block: clamp(32px, 4vw, 56px) clamp(64px, 7vw, 104px); background: var(--white); }
.ts-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4.5vw, 72px); align-items: center; }
.ts-hero__title { font-size: 48px; line-height: 1.08; letter-spacing: -.04em; text-wrap: balance; }
.ts-hero__lede { margin: 22px 0 0; max-width: 31em; font: 500 clamp(17px, 1.4vw, 20px)/1.55 var(--font); color: var(--ink-2); }
.ts-hero__lede b { color: var(--ink); }
.ts-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.ts-route { padding: 22px; border-radius: 36px; background: radial-gradient(80% 60% at 80% 0%, #E3E7FF 0%, transparent 70%), radial-gradient(70% 60% at 0% 100%, #E3F8EF 0%, transparent 70%), #F6F7FB; box-shadow: inset 0 0 0 1px var(--line); }
.ts-route__in { position: relative; display: grid; gap: 14px; }
.ts-route__msg { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; align-items: start; padding: 14px 16px; border-radius: 20px; background: #fff; box-shadow: 0 14px 30px -24px rgba(23, 23, 43, .45); }
.ts-route__av { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(160deg, #FFB3D0, #F2659A); color: #fff; font: 800 15px/1 var(--font); }
.ts-route__msg small { font: 600 11.5px/1 var(--font); color: var(--muted); }
.ts-route__msg p { margin: 5px 0 0; font: 600 15px/1.4 var(--font); color: var(--ink); }
.ts-gates { position: relative; list-style: none; margin: 0; padding: 0 0 0 4px; display: grid; gap: 10px; }
.ts-gates::before { content: ''; position: absolute; left: 25px; top: 10px; bottom: 10px; border-left: 2px dashed #C3C9F2; }
.ts-gates li { --cc: var(--accent); position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: center; padding: 10px 14px 10px 0; border-radius: 18px; transition: background-color .4s, box-shadow .4s; }
.ts-gates__node { position: relative; z-index: 1; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: #9DA2B5; box-shadow: inset 0 0 0 2px #D5D9E8; transition: background-color .4s, color .4s, box-shadow .4s; }
.ts-gates__node svg { width: 20px; height: 20px; fill: none; stroke: currentColor; }
.ts-gates__node--pic img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; filter: grayscale(1); opacity: .6; transition: filter .4s, opacity .4s; }
.ts-gates b { display: block; font: 700 15px/1.25 var(--font); color: var(--muted); transition: color .4s; }
.ts-gates small { display: block; margin-top: 3px; font: 500 13px/1.35 var(--font); color: var(--muted); opacity: .6; transition: opacity .4s; }
.ts-gates li.is-on { background: #fff; box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--cc) 40%, transparent), 0 18px 34px -26px rgba(23, 23, 43, .45); }
.ts-gates li.is-on, .ts-gates li.is-done { padding-left: 0; }
.ts-gates li.is-on .ts-gates__node, .ts-gates li.is-done .ts-gates__node { background: var(--cc); color: #fff; box-shadow: 0 0 0 5px color-mix(in srgb, var(--cc) 18%, transparent); }
.ts-gates li.is-on .ts-gates__node--pic, .ts-gates li.is-done .ts-gates__node--pic { background: #fff; box-shadow: 0 0 0 3px var(--cc); }
.ts-gates li.is-on img, .ts-gates li.is-done img { filter: none; opacity: 1; }
.ts-gates li.is-on b, .ts-gates li.is-done b { color: var(--ink); }
.ts-gates li.is-on small, .ts-gates li.is-done small { opacity: 1; color: var(--ink-2); }
.ts-route__foot { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 12px; align-items: center; }
.ts-route__bot { display: block; width: 76px; height: 76px; }
.ts-route__bot > svg { display: block; width: 100%; height: 100%; overflow: visible; }
.ts-stamp__ic { width: 34px; height: 34px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #22C08F; }
.ts-stamp__ic svg { width: 18px; height: 18px; color: #fff; fill: none; }
.ts-stamp { display: flex; align-items: center; gap: 12px; padding: 12px 16px 12px 12px; border-radius: 20px; background: #17172B; color: #fff; transition: opacity .45s, transform .5s var(--ease-soft); }
.ts-stamp__bot { display: block; width: 46px; height: 46px; flex: none; }
.ts-stamp b { display: block; font: 800 15px/1.2 var(--font); color: var(--green); }
.ts-stamp span:not(.ts-stamp__bot) { font: 500 13.5px/1.35 var(--font); color: rgba(255, 255, 255, .85); }
.ts-route.is-pre .ts-stamp:not(.is-in) { opacity: 0; transform: translateY(10px) scale(.97); }

/* --- 2 · SEALS ------------------------------------------------------------------ */
.ts-seals { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ts-seals li { --cc: var(--accent); --ct: var(--accent-tint); position: relative; display: grid; justify-items: center; gap: 6px; padding: 30px 24px 28px; border-radius: var(--card-r); background: #fff; text-align: center; box-shadow: var(--card-shadow); overflow: hidden; }
.ts-seals li::before { content: ''; position: absolute; inset: 0 0 auto; height: 110px; background: radial-gradient(60% 100% at 50% 0%, var(--ct), transparent 70%); }
.ts-seal { position: relative; display: grid; place-items: center; width: 120px; height: 120px; margin-bottom: 12px; }
.ts-seal__ring { position: absolute; inset: 0; width: 100%; height: 100%; }
.ts-seal__ring circle { fill: none; stroke: var(--cc); stroke-width: 1.5; }
.ts-seal__ring circle:first-child { stroke-dasharray: 3 5; opacity: .5; }
.ts-seal__ring circle + circle { fill: var(--ct); stroke-width: 2; }
.ts-seal__in { position: relative; display: grid; justify-items: center; gap: 2px; color: var(--cc); }
.ts-seal__in .icon { font-size: 26px; }
.ts-seal__in b { font: 800 18px/1 var(--font); letter-spacing: .02em; }
.ts-seal__lock { width: 38px; height: 38px; fill: none; stroke: currentColor; }
.ts-stars { position: relative; width: 34px; height: 34px; }
.ts-stars i { position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; margin: -2.5px; border-radius: 50%; background: var(--cc); transform: rotate(calc(var(--k) * 30deg)) translateY(-14px); }
.ts-stars i:nth-child(1) { --k: 0; } .ts-stars i:nth-child(2) { --k: 1; } .ts-stars i:nth-child(3) { --k: 2; } .ts-stars i:nth-child(4) { --k: 3; } .ts-stars i:nth-child(5) { --k: 4; } .ts-stars i:nth-child(6) { --k: 5; } .ts-stars i:nth-child(7) { --k: 6; } .ts-stars i:nth-child(8) { --k: 7; } .ts-stars i:nth-child(9) { --k: 8; } .ts-stars i:nth-child(10) { --k: 9; } .ts-stars i:nth-child(11) { --k: 10; } .ts-stars i:nth-child(12) { --k: 11; }
.ts-seal__tick { position: absolute; right: 4px; bottom: 8px; width: 28px; height: 28px; border-radius: 50%; background: #22C08F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='m3.6 8.4 2.9 2.9 5.9-6.3'/%3E%3C/svg%3E") center / 15px no-repeat; box-shadow: 0 0 0 4px #fff; }
.ts-seals h3 { position: relative; margin: 0; font: 700 var(--fs-h3)/1.2 var(--font); color: var(--ink); }
.ts-seals p { position: relative; margin: 0; max-width: 22em; font: 400 var(--fs-p)/1.5 var(--font); color: var(--body); }

/* --- 3 · COMMITMENTS -------------------------------------------------------------- */
.ts-coms { list-style: none; margin: clamp(40px, 5vw, 64px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ts-coms li { --cc: var(--accent); --ct: var(--accent-tint); display: flex; flex-direction: column; border-radius: 28px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px var(--line), 0 24px 50px -44px rgba(23, 23, 43, .45); }
.ts-coms__vis { display: grid; place-items: center; height: 250px; padding: 22px; background: radial-gradient(90% 70% at 30% 0%, #fff 0%, transparent 60%), var(--ct); }
.ts-coms__n { margin: 22px 24px 0; font: 800 13px/1 var(--font); letter-spacing: .06em; color: var(--cc); }
.ts-coms h3 { margin: 8px 24px 0; font: 700 var(--fs-h3)/1.2 var(--font); color: var(--ink); }
.ts-coms li > p { margin: 8px 24px 26px; font: 400 var(--fs-p)/1.55 var(--font); color: var(--body); }
.ts-rec { width: 100%; max-width: 290px; display: grid; gap: 6px; padding: 12px; border-radius: 18px; background: #fff; box-shadow: 0 18px 36px -24px rgba(23, 23, 43, .45); }
.ts-rec__head { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 2px 8px; align-items: center; padding: 2px 4px 8px; border-bottom: 1px solid var(--line); }
.ts-rec__head svg { grid-row: span 2; width: 20px; height: 20px; fill: none; stroke: var(--cc); }
.ts-rec__head b { font: 700 13px/1.2 var(--font); color: var(--ink); }
.ts-rec__head small { font: 500 11px/1 var(--font); color: var(--muted); }
.ts-rec__row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 8px; border-radius: 10px; background: var(--paper); font: 600 12px/1.25 var(--font); color: var(--ink); transition: opacity .4s, transform .45s var(--ease-out); }
.ts-rec__row em { flex: none; padding: 4px 7px; border-radius: 7px; background: var(--green-tint); font: 700 10.5px/1 var(--font); font-style: normal; color: var(--green-ink); }
.ts-chat { width: 100%; max-width: 290px; display: flex; flex-direction: column; gap: 8px; }
.ts-chat .ts-b { font-size: 13px; }
.ts-chat .ts-b--out { background: #fff; }
.ts-src { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 7px 11px 7px 7px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--cc) 40%, transparent); font: 700 12px/1.25 var(--font); color: var(--ink); transition: opacity .4s, transform .45s var(--ease-out); }
.ts-src svg { width: 26px; height: 26px; padding: 5px; border-radius: 8px; background: var(--ct); fill: none; stroke: var(--cc); box-sizing: border-box; }
.ts-src small { display: block; font: 600 10.5px/1 var(--font); color: var(--muted); }
.ts-join { align-self: center; display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 5px; border-radius: var(--r-pill); background: #fff; font: 700 11.5px/1 var(--font); color: #A8264F; transition: opacity .4s, transform .45s var(--ease-out); }
.ts-join img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
.ts-coms.is-pre [data-cs]:not(.is-in) { opacity: 0; transform: translateY(8px); }

/* --- 4 · VAULT ------------------------------------------------------------------- */
.ts-vault { position: relative; height: 470px; border-radius: 34px; background: radial-gradient(60% 60% at 50% 50%, #EEF0FF 0%, transparent 70%), #fff; box-shadow: var(--card-shadow); overflow: hidden; }
.ts-vault__lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.ts-vault__lines path { fill: none; stroke: #AEB7FF; stroke-width: 2; stroke-dasharray: 3 7; stroke-linecap: round; vector-effect: non-scaling-stroke; animation: tsFlow 1.1s linear infinite; }
@keyframes tsFlow { to { stroke-dashoffset: -20; } }
.ts-vault__rings { position: absolute; left: 50%; top: 50%; width: 260px; height: 260px; transform: translate(-50%, -50%); }
.ts-vault__ring { position: absolute; border-radius: 50%; display: grid; justify-items: center; }
.ts-vault__ring::before { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px dashed currentColor; opacity: .55; animation: tsSpin 36s linear infinite; }
.ts-vault__ring--in::before { animation-duration: 26s; animation-direction: reverse; }
.ts-vault__ring small { position: relative; z-index: 1; }
@keyframes tsSpin { to { transform: rotate(360deg); } }
.ts-vault__ring small { margin-top: -10px; height: 20px; padding: 0 8px; border-radius: var(--r-pill); background: #fff; font: 700 11px/20px var(--font); }
.ts-vault__ring--out { inset: 0; color: var(--accent-ink); }
.ts-vault__ring--in { inset: 42px; color: var(--green-ink); }
.ts-vault__core { position: absolute; z-index: 1; inset: 86px; border-radius: 50%; display: grid; place-items: center; align-content: center; gap: 4px; background: #17172B; color: #fff; box-shadow: 0 20px 40px -20px rgba(23, 23, 43, .7); }
.ts-vault__core svg { width: 26px; height: 26px; fill: none; stroke: #8FE3C2; }
.ts-vault__core b { font: 700 12px/1.15 var(--font); text-align: center; }
.ts-role { --cc: var(--accent); position: absolute; display: grid; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; gap: 4px 10px; align-items: center; width: 220px; padding: 10px 12px 10px 10px; border-radius: 16px; background: #fff; box-shadow: 0 0 0 1px var(--line), 0 16px 32px -22px rgba(23, 23, 43, .45); transition: opacity .45s, transform .5s var(--ease-soft); }
.ts-role > i { grid-row: span 2; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--cc); color: #fff; font: 800 13px/1 var(--font); font-style: normal; }
.ts-role__mark { background: var(--accent-tint) !important; }
.ts-role__mark svg { width: 20px; height: 13px; fill: var(--accent); }
.ts-role b { display: block; font: 700 13px/1.2 var(--font); color: var(--ink); }
.ts-role small { display: block; font: 500 11px/1.25 var(--font); color: var(--muted); }
.ts-lvl { grid-column: 2; display: flex; gap: 3px; }
.ts-lvl em { width: 22px; height: 5px; border-radius: 3px; background: #E3E6EF; }
.ts-lvl[style*="--n:3"] em, .ts-lvl[style*="--n:2"] em:nth-child(-n+2), .ts-lvl[style*="--n:1"] em:first-child { background: var(--cc); }
.ts-role--a { left: 18px; top: 22px; } .ts-role--b { right: 18px; top: 22px; } .ts-role--c { left: 18px; bottom: 22px; } .ts-role--d { right: 18px; bottom: 22px; }
.ts-vault.is-pre .ts-role:not(.is-in) { opacity: 0; transform: scale(.9); }

/* --- 5 · SIX CHECKS ----------------------------------------------------------------- */
.ts-acc { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(24px, 4vw, 56px); align-items: center; margin-top: clamp(40px, 5vw, 64px); }
.ts-conv { border-radius: 28px; overflow: hidden; background: #fff; box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .55); }
.ts-conv__bar { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.ts-conv__bar img { width: 22px; height: 22px; }
.ts-conv__bar b { display: block; font: 700 14px/1.2 var(--font); color: var(--ink); }
.ts-conv__bar small { font: 500 11.5px/1 var(--font); color: var(--muted); }
.ts-conv__body { display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; height: 440px; padding: 16px; background: #FAFBFC; }
.ts-flag { align-self: center; display: inline-flex; align-items: center; gap: 7px; margin: 0; padding: 7px 12px 7px 8px; border-radius: var(--r-pill); background: var(--green-tint); font: 700 12px/1.2 var(--font); color: var(--green-ink); transition: opacity .4s, transform .45s var(--ease-out); }
.ts-flag svg { width: 17px; height: 17px; padding: 3px; border-radius: 50%; background: #22C08F; color: #fff; box-sizing: border-box; fill: none; }
.ts-flag .icon { font-size: 16px; padding: 0; background: none; color: var(--green-ink); }
.ts-acc.is-pre .ts-conv [data-step]:not(.is-in) { display: none; }
.ts-conv [data-step].is-in { animation: tsIn .4s var(--ease-out) both; }
@keyframes tsIn { from { opacity: 0; transform: translateY(8px); } }
.ts-checks { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ts-checks li { position: relative; display: grid; gap: 6px; align-content: start; padding: 18px 18px 18px; border-radius: 22px; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--line-deep); transition: background-color .4s, box-shadow .4s; }
.ts-checks__ic { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: rgba(142, 155, 255, .16); color: var(--accent-lift); font-size: 19px; transition: background-color .4s, color .4s; }
.ts-checks__ic svg:not(.icon) { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; }
.ts-checks b { margin-top: 6px; font: 700 15.5px/1.3 var(--font); color: #fff; }
.ts-checks small { font: 400 13.5px/1.5 var(--font); color: var(--on-deep-2); }
.ts-checks__tick { position: absolute; right: 14px; top: 14px; width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--line-deep); transition: background-color .4s, box-shadow .4s; }
.ts-checks li.is-on { background: rgba(142, 155, 255, .14); box-shadow: inset 0 0 0 1.5px rgba(142, 155, 255, .6); }
.ts-checks li.is-on .ts-checks__ic, .ts-checks li.is-done .ts-checks__ic { background: var(--accent-lift); color: #15142B; }
.ts-checks li.is-done .ts-checks__tick, .ts-checks li.is-on .ts-checks__tick { background: #22C08F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='m3.6 8.4 2.9 2.9 5.9-6.3'/%3E%3C/svg%3E") center / 12px no-repeat; box-shadow: none; }

/* --- 6 · SECURITY PACK ----------------------------------------------------------------- */
.ts-pack { position: relative; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 30px 24px 0; border-radius: 34px; background: radial-gradient(70% 60% at 50% 20%, #FFF1E6 0%, transparent 70%), #FBF7F3; box-shadow: inset 0 0 0 1px var(--line); overflow: hidden; }
.ts-pack__docs { order: 1; position: relative; z-index: 1; display: grid; gap: 8px; width: min(340px, 100%); }
.ts-doc { --cc: var(--accent); display: grid; grid-template-columns: 46px minmax(0, 1fr); grid-template-rows: auto auto; gap: 2px 12px; align-items: center; padding: 10px 14px 10px 10px; border-radius: 14px; background: #fff; box-shadow: 0 12px 26px -18px rgba(23, 23, 43, .45); transition: opacity .45s, transform .6s var(--ease-soft); }
.ts-doc i { grid-row: span 2; width: 46px; height: 52px; border-radius: 6px 12px 6px 6px; display: grid; place-items: end center; padding-bottom: 6px; background: color-mix(in srgb, var(--cc) 14%, #fff); font: 800 9.5px/1 var(--font); font-style: normal; color: var(--cc); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--cc) 30%, transparent); }
.ts-doc b { font: 700 13px/1.25 var(--font); color: var(--ink); }
.ts-doc small { font: 500 11.5px/1.2 var(--font); color: var(--muted); }
.ts-pack.is-pre .ts-doc:not(.is-in) { opacity: 0; transform: translateY(-30px) rotate(-3deg); }
.ts-pack__folder { order: 3; position: relative; z-index: 2; width: min(380px, 100%); height: 96px; margin-top: 16px; }
.ts-pack__tab { position: absolute; left: 18px; top: -16px; width: 120px; height: 24px; border-radius: 10px 10px 0 0; background: #D27A3E; }
.ts-pack__front { position: absolute; inset: 0 0 -20px; display: grid; grid-template-columns: 30px minmax(0, 1fr); grid-template-rows: auto auto; gap: 2px 10px; align-content: start; padding: 18px 22px; border-radius: 6px 18px 0 0; background: linear-gradient(180deg, #F0A66A, #E08A4B); color: #fff; box-shadow: 0 -10px 30px -16px rgba(0, 0, 0, .3); }
.ts-pack__front svg { grid-row: span 2; width: 26px; height: 26px; fill: none; stroke: #fff; }
.ts-pack__front b { font: 800 16px/1.2 var(--font); }
.ts-pack__front small { font: 600 12px/1 var(--font); color: rgba(255, 255, 255, .85); }
.ts-pack__ready { order: 2; position: relative; z-index: 3; display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 9px 14px 9px 10px; border-radius: var(--r-pill); background: #fff; font: 700 13px/1 var(--font); color: var(--green-ink); white-space: nowrap; box-shadow: 0 14px 28px -16px rgba(23, 23, 43, .45); transition: opacity .45s, transform .5s var(--ease-soft); }
.ts-pack__ready svg { width: 18px; height: 18px; padding: 3px; border-radius: 50%; background: #22C08F; color: #fff; box-sizing: border-box; fill: none; }
.ts-pack.is-pre .ts-pack__ready:not(.is-in) { opacity: 0; transform: translateY(10px); }
.ts-docs__cta { margin-top: 28px; }
.ts-band { display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; margin-top: clamp(56px, 7vw, 96px); padding: clamp(28px, 3.5vw, 44px) clamp(26px, 4vw, 56px); border-radius: 32px; background: radial-gradient(80% 160% at 100% 0%, #6070E0 0%, transparent 60%), #4857C2; }
.ts-band__t { margin: 0; max-width: 18em; font: 600 clamp(24px, 2.6vw, 36px)/1.15 var(--font); letter-spacing: -.03em; color: #fff; text-wrap: balance; }
.ts-band__t em { font-style: normal; color: #C9CEFF; }
.ts-band__btn { flex: none; background: #fff; color: #4857C2; box-shadow: 0 16px 30px -16px rgba(0, 0, 0, .5); }
.ts-band__btn:hover { background: #F4F5FF; color: #3A47A8; }

/* --- RESPONSIVE ---------------------------------------------------------------------------- */
@media (max-width: 1100px) {
  .ts-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .ts-hero__copy, .ts-route { max-width: 640px; }
  .ts-coms { grid-template-columns: minmax(0, 1fr); max-width: 560px; margin-inline: auto; }
}
@media (max-width: 960px) {
  .ts-split, .ts-split--flip, .ts-acc { grid-template-columns: minmax(0, 1fr); }
  .ts-split__copy { max-width: 640px; }
  .ts-split--flip .ts-pack { order: -1; }
  .ts-seals { grid-template-columns: minmax(0, 1fr); max-width: 520px; margin-inline: auto; }
  .ts-band { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 600px) {
  .ts-hero__title { font-size: clamp(32px, 8.6vw, 48px); }
  .ts-hero__ctas .btn, .ts-band .btn, .ts-docs__cta .btn { width: 100%; }
  .ts-route { padding: 14px; border-radius: 26px; }
  .ts-route__foot { grid-template-columns: 60px minmax(0, 1fr); gap: 8px; }
  .ts-route__bot { width: 60px; height: 60px; }
  .ts-vault { height: 560px; }
  .ts-vault__rings { width: 200px; height: 200px; }
  .ts-vault__ring--in { inset: 32px; }
  .ts-vault__core { inset: 66px; }
  .ts-role { width: calc(50% - 22px); grid-template-columns: minmax(0, 1fr); padding: 10px; }
  .ts-role > i { grid-row: auto; }
  .ts-lvl { grid-column: 1; }
  .ts-role--a, .ts-role--b { top: 14px; } .ts-role--c, .ts-role--d { bottom: 14px; }
  .ts-role--a, .ts-role--c { left: 14px; } .ts-role--b, .ts-role--d { right: 14px; }
  .ts-checks { grid-template-columns: minmax(0, 1fr); }
  .ts-conv__body { height: 460px; }
}
@media (prefers-reduced-motion: reduce) {
  .ts-vault__ring::before, .ts-vault__lines path { animation: none !important; }
}

/* --- Three commitments (kept from the old page): the two chat boxes match the first box's height --- */
.page-trust-security .awways .awmini--chat { min-height: 260px; align-content: center; }
@media (max-width: 960px) { .page-trust-security .awways .awmini--chat { min-height: 0; } }