@font-face { font-family: 'Mona Display'; src: url('../fonts/MonaSans-Display.woff2') format('woff2'); font-weight: 200 900; font-stretch: 75% 125%; font-display: swap; }
html { background: #000; color-scheme: dark; scrollbar-color: rgb(255 255 255 / 0.22) transparent; }
::selection { background: #36d6c3; color: #000; text-shadow: none; }
body { margin: 0; background: #000; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
*, *::before, *::after { box-sizing: border-box; }
a { color: inherit; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote { margin: 0; padding: 0; }
summary { list-style: none; }
summary::-webkit-details-marker { display: none; }
details[open] .chev { transform: rotate(180deg); }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible { outline: 2px solid #36d6c3; outline-offset: 2px; }
.dim:hover { color: #f5f5f7 !important; }
.pill:hover { background: #fff !important; }
.row:hover { box-shadow: inset 0 0 0 1px #b4c1bd !important; }
.round:hover { background: rgb(255 255 255 / 0.17) !important; }
.go::after { content: ''; display: inline-block; width: 7px; height: 7px; margin-left: 2px; border-right: 1.5px solid currentColor; border-top: 1.5px solid currentColor; transform: rotate(45deg); }
.two-store { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 88px); align-items: center; }
.store-read { order: -1; }
.two-faq { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(32px, 5vw, 88px); align-items: start; }
.two-traders { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 28px clamp(32px, 6vw, 96px); align-items: end; }
.foot-top { display: grid; grid-template-columns: minmax(0, 2.2fr) repeat(3, minmax(0, 1fr)) minmax(0, 1.5fr); gap: 28px clamp(20px, 3vw, 48px); }
.outline:hover { box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.55) !important; }
.two-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 88px); }
.two-founder { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr); gap: clamp(28px, 6vw, 104px); align-items: start; }
.two-founder > img { position: sticky; top: 88px; }
/* Small things that move */
:root { --e: cubic-bezier(0.16, 1, 0.3, 1); --e2: cubic-bezier(0.23, 1, 0.32, 1); }
h1, h2, h3 { text-wrap: balance; }
p, li, blockquote, dd, summary > span { text-wrap: pretty; }
body { font-kerning: normal; text-rendering: optimizeLegibility; }
.dim { transition: color 0.2s; }
.pill { transition: background-color 0.2s, box-shadow 0.3s, transform 0.25s var(--e2); }
.pill:hover { box-shadow: 0 10px 34px -8px rgb(255 255 255 / 0.32); }
.pill:active, .round:active, .outline:active { transform: scale(0.96); }
.round { transition: background-color 0.2s, transform 0.2s var(--e2); }
.outline { transition: box-shadow 0.2s, transform 0.2s var(--e2); }
.row { transition: box-shadow 0.25s, background-color 0.25s, transform 0.2s var(--e2); }
.row:hover { background-color: rgb(255 255 255 / 0.03) !important; }
.row:active { transform: scale(0.99); }
.go::after { transition: translate 0.25s var(--e2); }
.go:hover::after { translate: 3px 0; }
.reel img { transition: scale 0.7s var(--e); }
.reel:hover img { scale: 1.035; }
.photo { outline: 1px solid rgb(255 255 255 / 0.1); outline-offset: -1px; }
summary .chev { transition: transform 0.3s var(--e), color 0.2s; color: #9a9a9f; }
summary:hover .chev, details[open] .chev { color: #f5f5f7; }
input[type="email"] { transition: border-color 0.2s; }
input[type="email"]:hover, input[type="email"]:focus { border-color: rgb(255 255 255 / 0.4) !important; }
.skip { position: fixed; left: 12px; top: -60px; z-index: 20; padding: 10px 16px; border-radius: 999px; background: #f5f5f7; color: #000; font-size: 14px; text-decoration: none; text-shadow: none; transition: top 0.2s; }
.skip:focus { top: 12px; }
.top-bar::before { content: ''; position: absolute; inset: 0 0 -28px; z-index: -1; background: linear-gradient(rgb(0 0 0 / 0.5), transparent); pointer-events: none; }
.hero { height: min(100vh, 900px); height: min(100svh, 900px); }

/* Sliding selector: one capsule that glides to whichever option you pick */
[data-seg] { position: relative; }
[data-seg] > button { position: relative; z-index: 1; }
.seg-pill { position: absolute; left: 0; top: 3px; bottom: 3px; opacity: 0; border-radius: inherit; background: rgb(255 255 255 / 0.16); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.2), inset 0 0 0 1px rgb(255 255 255 / 0.05); transition: transform 0.42s var(--e), width 0.42s var(--e), opacity 0.2s, background-color 0.35s, box-shadow 0.35s; }

/* Words arrive one at a time, out of a soft blur */
.w { display: inline-block; }
.rv-t { transition: opacity 1s var(--e), transform 1.2s var(--e); }
.rv { opacity: 0; transform: translateY(16px); }
.rv.rv-big { transform: perspective(1500px) rotateX(9deg) translateY(36px) scale(0.975); }
@media (prefers-reduced-motion: no-preference) {
  .wr .w { opacity: 0; transform: translateY(0.34em); filter: blur(12px); transition: opacity 1s var(--e), transform 1.15s var(--e), filter 1s var(--e); transition-delay: calc(var(--i) * 62ms); }
  .wr.in .w { opacity: 1; transform: none; filter: blur(0); }
  .rise { animation: rise 1.1s var(--e) backwards; }
  .q:not(.ready) .rise { animation-play-state: paused; }
  .r1 { animation-delay: 0.12s; } .r2 { animation-delay: 0.24s; } .r3 { animation-delay: 0.3s; } .r4 { animation-delay: 0.42s; } .r5 { animation-delay: 0.54s; }
  @keyframes rise { from { opacity: 0; transform: translateY(18px); } }
  :root { interpolate-size: allow-keywords; }
  details::details-content { block-size: 0; overflow: clip; transition: block-size 0.42s var(--e), content-visibility 0.42s allow-discrete; }
  details[open]::details-content { block-size: auto; }
  details > p { opacity: 0; transform: translateY(-6px); transition: opacity 0.25s var(--e), transform 0.42s var(--e); }
  details[open] > p { opacity: 1; transform: none; transition-delay: 0.06s, 0s; }
  .menu-in { animation: menuIn 0.28s var(--e) backwards; }
  @keyframes menuIn { from { opacity: 0; transform: translateY(-6px); } }
  .nav-ed .page { animation: pageIn 0.7s var(--e) backwards; }
  @keyframes pageIn { from { opacity: 0; transform: translateY(10px); } }
  @supports (animation-timeline: scroll()) {
    .hero-in { animation: heroOut linear both; animation-timeline: scroll(root); animation-range: 0 75vh; transform-origin: 0 100%; }
    @keyframes heroOut { to { opacity: 0.08; transform: translateY(-36px) scale(0.985); } }
  }
}

/* Cover flow for the certificates: grab it and pull */
.cf { position: relative; perspective: 1500px; cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; outline: none; }
.cf.is-drag { cursor: grabbing; }
.cf [data-cf] { cursor: inherit; will-change: transform; }
.cf:focus-visible { outline: 2px solid #36d6c3; outline-offset: 6px; border-radius: 14px; }
.cf-ctl { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 10px; }
.cf-dots { display: flex; align-items: center; height: 40px; padding: 0 8px; border-radius: 999px; background: rgb(255 255 255 / 0.08); }
.cf-dot { display: block; padding: 16px 4px; border: 0; background: none; cursor: pointer; }
.cf-dot i { position: relative; display: block; width: 8px; height: 8px; overflow: hidden; border-radius: 99px; background: rgb(255 255 255 / 0.3); transition: width 0.4s var(--e), background-color 0.2s; }
.cf-dot:hover i { background: rgb(255 255 255 / 0.55); }
.cf-dot.on i { width: 34px; background: rgb(255 255 255 / 0.22); }
.cf-dot b { position: absolute; inset: 0; display: block; border-radius: inherit; background: #f5f5f7; transform: scaleX(0); transform-origin: left; }
.cf-dot.on b { transform: scaleX(var(--p, 0)); }
.cf-pause { display: grid; place-items: center; width: 28px; height: 28px; margin-left: 2px; border: 0; border-radius: 50%; background: none; color: #d6d6db; cursor: pointer; transition: color 0.2s, background-color 0.2s; }
.cf-pause:hover { color: #fff; background: rgb(255 255 255 / 0.1); }
.cf-pause .play { display: none; }
.cf-pause.is-paused .play { display: block; }
.cf-pause.is-paused .stop { display: none; }

/* TruTik */
.two-tk { display: grid; grid-template-columns: minmax(0, 4.6fr) minmax(0, 8fr); gap: clamp(24px, 3.4vw, 56px); align-items: center; }
.tk-win { position: relative; aspect-ratio: 2560 / 1311; overflow: hidden; border-radius: clamp(10px, 1.3vw, 16px); background: #0a0d10; box-shadow: 0 0 0 1px rgb(255 255 255 / 0.13), 0 50px 130px -30px rgb(58 120 255 / 0.42), 0 40px 90px -30px rgb(0 0 0 / 0.9); }
.tk-win::after { content: ''; position: absolute; inset: 0; z-index: 3; border-radius: inherit; pointer-events: none; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.2), inset 0 0 0 1px rgb(255 255 255 / 0.05); }
.tk-layer { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; visibility: hidden; transform: scale(1.02); transition: opacity 0.7s var(--e), transform 1.2s var(--e), visibility 0s 0.7s; }
.tk-layer[data-on="true"] { opacity: 1; visibility: visible; transform: none; transition: opacity 0.7s var(--e), transform 1.2s var(--e), visibility 0s; }
.tk-zc { display: flex; flex-direction: column; background: #0a0d10; font-size: 12px; color: #c7ccd4; text-shadow: none; }
.tk-zc-bar { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 40px; padding: 0 12px; border-bottom: 1px solid rgb(255 255 255 / 0.08); }
.tk-zc-bar b { font-weight: 600; color: #f5f5f7; }
.bar-short { display: none; }
.hero-br { display: inline; }
.tk-zc-tag { white-space: nowrap; padding: 2px 6px; border-radius: 5px; background: rgb(255 255 255 / 0.08); font-size: 11px; color: #c7ccd4; }
.tk-zc canvas { display: block; flex: 1; width: 100%; min-height: 0; outline: none; }
.tk-zc-foot { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 34px; padding: 0 12px; border-top: 1px solid rgb(255 255 255 / 0.08); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; }
.tk-zc-foot b { font-weight: 600; color: #f5f5f7; }
.tk-ranges { display: flex; gap: 2px; }
.tk-ranges button { min-width: 30px; height: 28px; padding: 0 6px; border: 0; border-radius: 6px; background: none; color: #9aa1ab; font: inherit; font-size: 11.5px; cursor: pointer; transition: background-color 0.2s, color 0.2s; }
.tk-ranges button:hover { color: #f5f5f7; background: rgb(255 255 255 / 0.08); }
.tk-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; gap: clamp(14px, 2vw, 32px); margin-top: clamp(24px, 3vw, 44px); }
.tk-tab { position: relative; display: block; width: 100%; padding: 16px 0 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.tk-tab::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: rgb(255 255 255 / 0.17); }
.tk-prog { position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, #8fb6ff, #e6f0ff); transform: scaleX(0); transform-origin: left; box-shadow: 0 0 10px rgb(120 170 255 / 0.6); }
.tk-tab[data-on="true"] .tk-prog { animation: tkp var(--tk-dur, 8s) linear both; }
.tk-paused .tk-tab[data-on="true"] .tk-prog { animation-play-state: paused; }
.tk-reduce .tk-tab[data-on="true"] .tk-prog { animation: none; transform: scaleX(1); }
@keyframes tkp { to { transform: scaleX(1); } }
.tk-tab b { display: block; font-size: 17px; font-weight: 600; line-height: 1.25; letter-spacing: -0.02em; color: #b4b4b9; transition: color 0.25s; text-wrap: balance; }
.tk-tab span { display: block; margin-top: 8px; font-size: 14.5px; line-height: 1.42; letter-spacing: -0.008em; color: #8e8e94; transition: color 0.25s; text-wrap: pretty; }
.tk-tab:hover b, .tk-tab[data-on="true"] b { color: #f5f5f7; }
.tk-tab:hover span, .tk-tab[data-on="true"] span { color: #c1c1c6; }
.two-risk { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: clamp(36px, 7vw, 120px); align-items: center; margin-top: clamp(56px, 7vw, 104px); }
.tk-card { position: relative; width: 100%; max-width: 340px; padding: 16px 12px 14px; border-radius: 20px; background: linear-gradient(170deg, #252629, #1f2023 55%, #24262a); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.09), inset 0 1px 0 rgb(255 255 255 / 0.07), 0 40px 90px -36px rgb(58 120 255 / 0.45), 0 30px 70px -30px rgb(0 0 0 / 0.9); }
.tk-ticket { display: block; width: 100%; height: auto; -webkit-mask: linear-gradient(90deg, transparent, #000 6px, #000 calc(100% - 6px), transparent), linear-gradient(transparent, #000 6px, #000 calc(100% - 6px), transparent); -webkit-mask-composite: source-in; mask: linear-gradient(90deg, transparent, #000 6px, #000 calc(100% - 6px), transparent) intersect, linear-gradient(transparent, #000 6px, #000 calc(100% - 6px), transparent); }
.tk-more { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px clamp(20px, 3vw, 48px); margin-top: clamp(24px, 3vw, 40px); }
.tk-more li { padding-top: 14px; border-top: 1px solid rgb(255 255 255 / 0.17); }
.gs { position: relative; }
[data-g="1"] .gs { padding: clamp(22px, 3vw, 44px); border-radius: 38px; box-shadow: 0 44px 90px -34px rgb(0 0 0 / 0.8); }
[data-g="2"] .two-store { align-items: stretch; }
[data-g="2"] .store-read { display: flex; flex-direction: column; justify-content: center; position: relative; padding: clamp(22px, 2.6vw, 36px); border-radius: 30px; box-shadow: 0 34px 70px -30px rgb(0 0 0 / 0.8); }
[data-g="2"] .store-read::before { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none; background: linear-gradient(135deg, rgb(255 255 255 / 0.42), rgb(255 255 255 / 0.1) 30%, rgb(255 255 255 / 0.05) 62%, rgb(255 255 255 / 0.24)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); }
.four { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
[data-g="1"] .two-store { align-items: stretch; }
[data-g="1"] .store-read { display: flex; flex-direction: column; justify-content: center; position: relative; padding: clamp(22px, 2.6vw, 36px); border-radius: 26px; background: radial-gradient(70% 46% at 24% 100%, rgb(110 236 205 / 0.09), transparent 72%), radial-gradient(54% 40% at 70% 100%, rgb(244 168 118 / 0.06), transparent 72%), rgb(255 255 255 / 0.035); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08), inset 0 1px 0 rgb(255 255 255 / 0.1); }
.launch-glass { position: relative; margin-bottom: clamp(88px, 10vw, 148px); padding: clamp(22px, 2.6vw, 38px); border-radius: 30px; box-shadow: 0 44px 90px -34px rgb(0 0 0 / 0.8); scroll-margin-top: 88px; }
.two-launch { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: clamp(28px, 4.6vw, 80px); align-items: start; }
.ln-eye { font-size: 12.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #8fe8d2; }
.ln-nos { list-style: none; display: flex; flex-wrap: wrap; gap: 12px 30px; margin-top: clamp(26px, 3vw, 40px); padding-top: 22px; border-top: 1px solid rgb(255 255 255 / 0.09); font-size: 15px; color: #e3e8e6; }
/* hero launch note: text, not a pill */
.ln-note { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 28px; min-height: 32px; color: #c9d3e3; font-size: 15px; letter-spacing: -0.01em; text-decoration: none; }
.ln-note img { display: block; height: 18px; width: auto; }
.ln-note i { width: 1px; height: 18px; background: rgb(255 255 255 / 0.3); }
.ln-note b { font-weight: 500; color: #fff; }
.ln-note em { font-style: normal; }
@media (max-width: 520px) { .ln-note { gap: 11px; font-size: 14px; } .ln-note .ln-d { display: none; } }
.ln-note svg { transition: transform 0.25s var(--e); }
.ln-note:hover svg { transform: translateX(3px); }
.ln-note:hover b { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
/* section heads sit right on top of their glass panel: title left, the live bit (countdown, TruTik hook) on the right */
.sec-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 48px; margin-bottom: clamp(16px, 1.8vw, 22px); padding-inline: clamp(4px, 1.2vw, 16px); }
.sec-head .sec-h { font-size: clamp(32px, 3.4vw, 50px); text-align: left; }
.sec-head .sec-p { margin-top: 10px; max-width: 30em; font-size: clamp(16px, 1.25vw, 18.5px); text-align: left; text-wrap: pretty; }
.sec-head .li-mark { height: 20px; margin-bottom: 14px; }
.sec-head .cd { margin-top: 0; }
.pl-hype { text-align: right; }
.pl-hype-h { font-family: 'Mona Display', -apple-system, 'Helvetica Neue', Arial, sans-serif; font-stretch: 125%; font-weight: 600; font-size: clamp(20px, 1.8vw, 26px); line-height: 1.15; letter-spacing: -0.025em; color: #fff; }
.pl-hype-h img { display: inline-block; height: 0.86em; width: auto; vertical-align: -0.1em; margin: 0 0.04em 0 0.12em; }
.pl-hype-h span { color: #a9c8ff; }
.pl-hype-s { margin-top: 6px; font-size: 14px; color: #b9c6d8; }
@media (max-width: 560px) { .pl-hype-h .ph-l { display: block; } }
.pl-hype-h .ph-l { font-style: normal; }
.pl-hype-s img { display: inline-block; height: 1.05em; width: auto; vertical-align: -0.2em; margin-left: 0.15em; }
/* right of "Our plans.": TruTik launch first, then the trusted platforms as a quiet second row */
.pl-pf { display: grid; justify-items: end; text-align: right; }
.pl-tk-h { font-family: 'Mona Display', -apple-system, 'Helvetica Neue', Arial, sans-serif; font-stretch: 125%; font-weight: 600; font-size: clamp(20px, 1.8vw, 26px); line-height: 1.15; letter-spacing: -0.025em; color: #fff; }
.pl-tk-h img { display: inline-block; height: 0.9em; width: auto; vertical-align: -0.12em; margin: 0 0.02em 0 0.1em; }
.pl-tk-s { margin-top: 7px; font-size: 14.5px; line-height: 1.4; letter-spacing: -0.01em; color: #b9c6d8; }
.pl-tk-a { display: inline-flex; align-items: center; gap: 5px; margin-left: 10px; color: #a9c8ff; font-weight: 500; text-decoration: none; white-space: nowrap; text-shadow: none; transition: color 0.2s ease; }
.pl-tk-a svg { transition: transform 0.2s cubic-bezier(0.23, 1, 0.32, 1); }
@media (hover: hover) and (pointer: fine) { .pl-tk-a:hover { color: #d6e4ff; } .pl-tk-a:hover svg { transform: translateX(3px); } }
.pl-tk-a:focus-visible { outline: 2px solid #a9c8ff; outline-offset: 3px; border-radius: 4px; }
.pl-pf-o { display: grid; justify-items: end; gap: 10px; margin-top: 16px; padding-top: 14px; border-top: 1px solid rgb(255 255 255 / 0.1); }
.pl-pf-lab { font-size: 12.5px; letter-spacing: -0.005em; color: #93a29f; white-space: nowrap; }
.pl-pf-l { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-end; gap: 10px 26px; margin: 0; padding: 0; list-style: none; }
.pl-pf-l li { display: flex; align-items: center; }
.pl-pf-l img { display: block; width: auto; height: var(--lh); }
/* optically matched: equal cap height across the four wordmarks */
.pl-pf-l [data-b="nt"] { --lh: 14px; } .pl-pf-l [data-b="tdv"] { --lh: 24px; margin-top: -3px; } .pl-pf-l [data-b="tv"] { --lh: 16.5px; } .pl-pf-l [data-b="wc"] { --lh: 25px; }
/* look: mono (every mark in white) */
.pl-pf[data-look="mono"] .pl-pf-l img { filter: brightness(0) invert(1); opacity: 0.86; }
/* look: tiles (each mark on its own small glass tile) */
.pl-pf[data-look="tiles"] .pl-pf-l { gap: 8px; }
.pl-pf[data-look="tiles"] .pl-pf-l li { height: 44px; padding: 0 14px; border-radius: 12px; background: rgb(0 0 0 / 0.34); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1), inset 0 1px 0 rgb(255 255 255 / 0.08); }
/* wide screens: title left, launch block right, always on one line (never a half-wrapped block) */
@media (min-width: 1101px) { .sec-plans { flex-wrap: nowrap; } .sec-plans > div:first-child { flex: 1 1 auto; min-width: 0; } .pl-pf { flex: 0 1 auto; } }
/* narrower: everything stacks, left aligned */
@media (max-width: 1100px) { .pl-pf { flex: 1 1 100%; justify-items: start; text-align: left; } .pl-pf-o { justify-items: start; } .pl-pf-l { flex-wrap: wrap; justify-content: flex-start; } }
@media (max-width: 560px) {
  .pl-tk-h { font-size: 20px; }
  .pl-tk-s { font-size: 14px; }
  .pl-tk-a { margin-left: 0; margin-top: 2px; display: flex; width: max-content; }
  .pl-pf { justify-items: stretch; }
  .pl-pf-o { display: grid; gap: 10px; margin-top: 14px; padding-top: 12px; }
  .pl-pf-l { display: grid; grid-template-columns: repeat(2, max-content); justify-content: start; gap: 12px 36px; }
  .pl-pf-l [data-b="nt"] { --lh: 13px; } .pl-pf-l [data-b="tdv"] { --lh: 22px; } .pl-pf-l [data-b="tv"] { --lh: 15px; } .pl-pf-l [data-b="wc"] { --lh: 23px; }
  .pl-pf[data-look="tiles"] .pl-pf-l { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .pl-pf[data-look="tiles"] .pl-pf-l li { height: 40px; justify-content: center; }
}
.ln-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px clamp(24px, 4vw, 64px); margin-top: clamp(22px, 2.4vw, 30px); padding-top: 18px; border-top: 1px solid rgb(170 200 255 / 0.16); }
.ln-gh { font-size: 11.5px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: #8fb6ff; }
.ln-groups .ln-specs { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; padding-top: 0; border-top: 0; }
@media (max-width: 900px) { .ln-groups { grid-template-columns: minmax(0, 1fr); } .pl-hype { text-align: left; } }
@media (max-width: 520px) { .sec-head .cd { justify-content: flex-start; } .sec-head .cd-l { text-align: left; } }
/* affiliate application page */
.ap { max-width: 1320px; margin-inline: auto; padding: clamp(96px, 10vw, 148px) clamp(16px, 3.2vw, 48px) clamp(64px, 7vw, 112px); }
.ap-grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.25fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.ap-intro { position: sticky; top: 112px; }
.ap-back { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: #b4b4b9; text-decoration: none; }
.ap-back:hover { color: #f5f5f7; }
.ap-h { margin-top: 22px; font-family: 'Mona Display', -apple-system, 'Helvetica Neue', Arial, sans-serif; font-stretch: 125%; font-weight: 600; font-size: clamp(36px, 4vw, 60px); line-height: 1.04; letter-spacing: -0.03em; color: #fff; text-wrap: balance; }
.ap-p { margin-top: 16px; max-width: 30em; font-size: clamp(17px, 1.35vw, 19px); line-height: 1.42; letter-spacing: -0.012em; color: #c7cdd4; text-wrap: pretty; }
.ap-facts { display: grid; gap: 14px; margin-top: clamp(28px, 3vw, 40px); padding-top: 22px; border-top: 1px solid rgb(255 255 255 / 0.14); }
.ap-facts div { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: baseline; gap: 14px; }
.ap-facts dt { font-size: 26px; font-weight: 500; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; color: #fff; }
.ap-facts dd { font-size: 14.5px; color: #b4b4b9; }
.ap-help { margin-top: 26px; font-size: 14px; color: #9a9a9f; }
.ap-help a { color: #d6dce3; text-underline-offset: 3px; }
.ap-card { position: relative; padding: clamp(22px, 3vw, 40px); border-radius: 28px; background: linear-gradient(180deg, rgb(255 255 255 / 0.055), rgb(255 255 255 / 0.025)); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1), 0 40px 90px -40px rgb(0 0 0 / 0.9); -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4); }
.ap-form fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.ap-form fieldset + fieldset { margin-top: 26px; padding-top: 24px; border-top: 1px solid rgb(255 255 255 / 0.1); }
.ap-form legend { float: left; width: 100%; padding: 0; margin-bottom: 14px; font-size: 11.5px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: #8fe8d2; }
.ap-form legend + * { clear: both; }
.ap-note { margin: -6px 0 14px; font-size: 13.5px; color: #9fadaa; }
.ap-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ap-row + .ap-row { margin-top: 14px; }
.ap-f { display: grid; gap: 7px; min-width: 0; }
.ap-full { grid-column: 1 / -1; }
.ap-f > span { font-size: 13px; color: #c3c9cf; letter-spacing: -0.004em; }
.ap-f em { font-style: normal; color: #7f8a88; margin-left: 4px; }
.ap-in { width: 100%; min-height: 46px; padding: 0 14px; border: 0; border-radius: 12px; background: rgb(0 0 0 / 0.36); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.12); color: #f5f5f7; font: inherit; font-size: 15px; text-shadow: none; transition: box-shadow 0.2s, background-color 0.2s; -webkit-appearance: none; appearance: none; }
.ap-in::placeholder { color: #6f7776; }
.ap-in:hover { box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.24); }
.ap-in:focus { outline: none; background: rgb(0 0 0 / 0.5); box-shadow: inset 0 0 0 1px rgb(143 232 210 / 0.75), 0 0 0 4px rgb(143 232 210 / 0.12); }
select.ap-in { padding-right: 38px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23b4b4b9' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 14px; cursor: pointer; }
select.ap-in option { background: #111; color: #f5f5f7; }
.ap-err { margin-top: 20px; padding: 11px 14px; border-radius: 12px; background: rgb(236 91 95 / 0.1); box-shadow: inset 0 0 0 1px rgb(236 91 95 / 0.4); font-size: 14px; color: #ffc9ca; }
.ap-send { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin-top: 28px; padding-top: 24px; border-top: 1px solid rgb(255 255 255 / 0.1); }
.ap-send .pill { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 28px; border: 0; border-radius: 999px; background: #f5f5f7; color: #000; font: inherit; font-size: 16.5px; font-weight: 500; letter-spacing: -0.012em; cursor: pointer; text-shadow: none; }
.ap-send p { flex: 1 1 220px; font-size: 13px; line-height: 1.4; color: #9fadaa; }
.ap-done { display: grid; justify-items: start; gap: 12px; padding: clamp(8px, 2vw, 24px) 0; }
.ap-ok { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; color: #06221b; background: linear-gradient(160deg, #c6f6ea, #8fe8d2 55%, #5fd0b4); box-shadow: 0 0 22px rgb(143 232 210 / 0.45); }
.ap-done h2 { margin-top: 6px; font-family: 'Mona Display', -apple-system, 'Helvetica Neue', Arial, sans-serif; font-stretch: 125%; font-weight: 600; font-size: clamp(28px, 2.6vw, 38px); letter-spacing: -0.03em; color: #fff; }
.ap-done p { max-width: 32em; font-size: 16px; line-height: 1.45; color: #c7cdd4; }
.ap-again { margin-top: 6px; padding: 0; border: 0; background: none; color: #a9c8ff; font: inherit; font-size: 14.5px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
@media (max-width: 900px) { .ap-grid { grid-template-columns: minmax(0, 1fr); } .ap-intro { position: static; } }
@media (max-width: 560px) { .ap-row { grid-template-columns: minmax(0, 1fr); } }
/* promo and small print live at the foot of the price card, so the plan list stays short */
.rd-promo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 14px; margin-top: 18px; padding-top: 14px; border-top: 1px solid rgb(255 255 255 / 0.1); font-size: 13.5px; line-height: 1.35; color: #d3dcd9; }
.rd-promo p { flex: 1 1 220px; }
.rd-promo b { font-weight: 500; color: #f5f5f7; }
.rd-fine { margin-top: 10px; font-size: 11.5px; line-height: 1.45; color: #9fadaa; max-width: 46em; }
[data-g="1"] #choose.gs { padding: clamp(20px, 2.4vw, 34px); }
.rd-price { font-size: clamp(66px, 7vw, 116px) !important; }
[data-g="1"] #choose .store-read { padding: clamp(22px, 2.2vw, 30px); }
/* plan rules at a glance: the six things a trader checks first */
.gl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(18px, 2vw, 26px); border-top: 1px solid rgb(255 255 255 / 0.14); }
.gl-i { display: grid; align-content: start; gap: 2px; padding: 10px 14px 10px 0; border-bottom: 1px solid rgb(255 255 255 / 0.07); min-width: 0; }
.gl-i:nth-child(3n+2), .gl-i:nth-child(3n+3) { padding-left: 16px; border-left: 1px solid rgb(255 255 255 / 0.07); }
.gl-l { font-size: 12.5px; color: #9fadaa; letter-spacing: -0.004em; }
.gl-v { font-size: 17px; font-weight: 500; letter-spacing: -0.016em; font-variant-numeric: tabular-nums; color: #f5f7f6; }
.gl-v[data-good="true"] { color: #8fe8d2; }
.gl-n { font-size: 12px; line-height: 1.3; color: #8a9896; }
@media (max-width: 560px) { .gl { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gl-i:nth-child(3n+2), .gl-i:nth-child(3n+3) { padding-left: 0; border-left: 0; } .gl-i:nth-child(2n) { padding-left: 14px; border-left: 1px solid rgb(255 255 255 / 0.07); } }
/* live order ticket (TruTik section) */
.tk-card { padding: 18px 16px 16px !important; }
.tkt { display: grid; gap: 12px; font-size: 13.5px; color: #e9ebef; text-shadow: none; font-variant-numeric: tabular-nums; }
.tkt-h, .tkt-row, .tkt-tick { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tkt-h > span, .tkt-two label > span, .tkt-tick span { color: #b4b8c0; }
.tkt-link { padding: 4px 0; border: 0; background: none; color: #e9ebef; font: inherit; font-weight: 500; cursor: pointer; }
.tkt-link:hover { color: #a9c8ff; }
.tkt-f { display: flex; align-items: center; gap: 2px; min-width: 0; height: 42px; padding: 0 6px 0 14px; border-radius: 12px; background: #17181b; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.06); transition: box-shadow 0.2s; }
.tkt-f:focus-within { box-shadow: inset 0 0 0 1px rgb(143 182 255 / 0.6); }
.tkt-big { height: 48px; }
.tkt-in { flex: 1 1 0; width: 0; min-width: 0; height: 100%; padding: 0; border: 0; outline: none; background: none; color: #fff; font: inherit; font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
.tkt-big .tkt-in { font-size: 19px; }
.tkt-b { flex: none; display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: none; color: #c9ccd2; cursor: pointer; transition: background-color 0.15s, color 0.15s; }
.tkt-b:hover { background: rgb(255 255 255 / 0.07); color: #fff; }
.tkt-b:active { transform: scale(0.92); }
.tkt-u { flex: none; margin: 0 4px 0 2px; font-size: 12px; color: #8f949c; }
.tkt-pre { margin-right: 2px; color: #8f949c; }
.tkt-seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 2px; padding: 3px; border-radius: 11px; background: #17181b; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.05); }
.tkt-seg button { height: 32px; border: 0; border-radius: 8px; background: none; color: #c9ccd2; font: inherit; font-weight: 500; cursor: pointer; transition: background-color 0.2s, color 0.2s; }
.tkt-seg button:hover { color: #fff; }
.tkt-seg button[aria-pressed="true"] { background: #3a3c41; color: #fff; box-shadow: 0 1px 2px rgb(0 0 0 / 0.4), inset 0 1px 0 rgb(255 255 255 / 0.06); }
.tkt-row { padding-top: 12px; border-top: 1px solid rgb(255 255 255 / 0.07); font-size: 14px; font-weight: 500; }
.tkt-sw { position: relative; width: 44px; height: 26px; padding: 0; border: 0; border-radius: 99px; background: rgb(255 255 255 / 0.14); cursor: pointer; transition: background-color 0.25s; }
.tkt-sw > i { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgb(0 0 0 / 0.4); transition: transform 0.3s cubic-bezier(0.34, 1.4, 0.64, 1); }
.tkt-sw[aria-checked="true"] { background: linear-gradient(90deg, #3fbf86, #5fe0a0); }
.tkt-sw[aria-checked="true"] > i { transform: translateX(18px); }
.tkt-br { display: grid; gap: 12px; }
.tkt-br[hidden] { display: none; }
.tkt-two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tkt-two label { display: grid; gap: 6px; min-width: 0; }
.tkt-two .tkt-f { padding-left: 10px; }
.tkt-two .tkt-b { width: 24px; }
.tkt-sum { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding-top: 12px; border-top: 1px solid rgb(255 255 255 / 0.07); color: #b4b8c0; font-size: 12.5px; }
.tkt-sum > span { display: grid; gap: 3px; min-width: 0; }
.tkt-sum > span:last-child { text-align: right; }
.tkt-sum b { font-size: 16px; font-weight: 600; color: #e9ebef; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tkt-neg { color: #ff6b6e !important; }
.tkt-pos { color: #5fe0a0 !important; }
.tkt-desc { padding-top: 12px; border-top: 1px solid rgb(255 255 255 / 0.07); font-weight: 500; }
.tkt-tick b { font-weight: 500; }
.tkt-calc { display: grid; gap: 6px; }
.tkt-calc[hidden] { display: none; }
.tkt-hint { font-size: 12px; color: #9aa3b4; }
.tkt button:focus-visible { outline: 2px solid #8fb6ff; outline-offset: 2px; }
.tkt .tkt-in:focus, .tkt .tkt-in:focus-visible { outline: none !important; box-shadow: none; }
/* top bar: product switch, Log in, Get funded */
.nav-products { position: relative; display: flex; align-items: center; gap: 1px; padding: 3px; border-radius: 999px; background: linear-gradient(180deg, rgb(255 255 255 / 0.055), rgb(255 255 255 / 0.025)); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1), inset 0 1px 0 rgb(255 255 255 / 0.06), 0 6px 20px -10px rgb(0 0 0 / 0.8); -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4); }
.np { display: inline-flex; align-items: center; height: 28px; padding: 0 13px; border-radius: 999px; font-size: 13px; font-weight: 500; letter-spacing: -0.006em; color: #a3a8af; text-decoration: none; white-space: nowrap; text-shadow: none; transition: color 0.2s, background-color 0.2s, box-shadow 0.2s; }
.np:hover { color: #f5f5f7; background: rgb(255 255 255 / 0.06); }
.np[aria-current] { color: #fff; background: linear-gradient(180deg, rgb(255 255 255 / 0.17), rgb(255 255 255 / 0.08)); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.13), inset 0 1px 0 rgb(255 255 255 / 0.22), 0 3px 10px -3px rgb(0 0 0 / 0.7); }
.np-tk:hover { color: #b9d2ff; background: rgb(110 160 255 / 0.1); }
.nav-login { display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 500; letter-spacing: -0.01em; color: #c9ccd2; text-decoration: none; white-space: nowrap; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0); transition: color 0.2s, box-shadow 0.2s, background-color 0.2s; }
.nav-login:hover { color: #fff; background: rgb(255 255 255 / 0.04); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16); }
.nav-cta { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 13px 0 16px; border-radius: 999px; background: linear-gradient(180deg, #ffffff, #e7e9eb); color: #050505; font-size: 14px; font-weight: 500; letter-spacing: -0.01em; text-decoration: none; white-space: nowrap; text-shadow: none; box-shadow: inset 0 -1px 0 rgb(0 0 0 / 0.1), inset 0 1px 0 #fff, 0 0 0 1px rgb(255 255 255 / 0.12), 0 6px 20px -8px rgb(143 232 210 / 0.6); transition: box-shadow 0.25s, transform 0.2s; }
.nav-cta svg { transition: transform 0.25s var(--e2); }
.nav-cta:hover { box-shadow: inset 0 -1px 0 rgb(0 0 0 / 0.1), inset 0 1px 0 #fff, 0 0 0 1px rgb(255 255 255 / 0.2), 0 8px 26px -6px rgb(143 232 210 / 0.85); }
.nav-cta:hover svg { transform: translateX(2px); }
.nav-cta:active { transform: scale(0.97); }
.np:focus-visible, .nav-login:focus-visible, .nav-cta:focus-visible { outline: 2px solid #8fe8d2; outline-offset: 2px; }
@media (max-width: 520px) { .nav-cta { height: 36px; padding: 0 12px 0 15px; } }
/* phones: the price card sits right under the plan list and holds every option, so you choose, configure and buy in one place */
.opts-m { display: none; }
@media (max-width: 900px) {
  .opts-desk { display: none; }
  .opts-m { display: block; margin-top: 16px; padding-top: 14px; border-top: 1px solid rgb(255 255 255 / 0.1); }
  .opts-m .pf-row { margin-top: 12px; }
  #choose .two-store { gap: 14px; }
}
@media (max-width: 560px) {
  [data-g="1"] #choose.gs { padding: 14px; border-radius: 26px; }
  #choose h2#st-h { font-size: 24px !important; }
  #choose .row { padding: 8px 12px !important; border-radius: 12px !important; }
  #choose .row b { font-size: 15px !important; }
  #choose .row small { font-size: 12px !important; }
  [data-g="1"] #choose .store-read { padding: 18px 16px !important; border-radius: 20px; }
  .store-read > p:first-child { font-size: 20px !important; }
  .rd-price { font-size: 56px !important; }
  .rd-was, .rd-sl { font-size: 20px; }
  .rd-save { margin-top: 10px; font-size: 13px; }
  .gl-i { padding: 9px 10px 9px 0; }
  .gl-v { font-size: 15.5px; }
  .gl-n { font-size: 11.5px; }
  .fp { padding: 9px 10px; gap: 10px; }
  .fp-ic { width: 26px; height: 26px; border-radius: 8px; }
  .fp-t b { font-size: 14px; }
  .fp-t small { font-size: 12px; }
  .rd-promo { margin-top: 14px; font-size: 13px; }
}
/* phones, compact: the whole picker (plans, setup, key rules, Buy) sits in about one screen */
@media (max-width: 560px) {
  #choose .two-store { gap: 10px; }
  #choose header { align-items: center !important; }
  #choose h2#st-h { font-size: 20px !important; }
  #choose h2#st-h br { display: none; }
  #choose .fam { height: 34px; }
  #choose [aria-label="Account size"] { margin-top: 10px !important; }
  #choose [aria-label="Account size"] button { height: 32px !important; font-size: 14px !important; }
  #choose .two-store > div:not(.store-read) > div[style*="gap: 6px"] { gap: 5px !important; margin-top: 8px !important; }
  #choose .row { padding: 9px 12px !important; }
  #choose .row small { display: none !important; }
  #choose .row b { font-size: 14.5px !important; }
  [data-g="1"] #choose .store-read { padding: 14px 14px 16px !important; }
  .store-read > p:first-child { display: none !important; }
  .rd-price { font-size: 42px !important; line-height: 1 !important; }
  .rd-was, .rd-sl { font-size: 17px; }
  .store-read > div:nth-child(3) { margin-top: 2px !important; font-size: 13.5px !important; gap: 4px 8px !important; }
  .store-read > div:nth-child(3) button { min-height: 24px !important; font-size: 12px !important; padding: 0 8px !important; }
  .opts-m { margin-top: 10px; padding-top: 10px; }
  .opts-m [data-seg] { margin-top: 0 !important; }
  .opts-m [data-seg] button { height: 30px !important; font-size: 13px !important; }
  .opts-m .pv-note { display: none; }
  .opts-m .fp { margin-top: 6px; padding: 7px 10px; }
  .opts-m .fp-t small { display: none; }
  .opts-m .fp-ic { width: 24px; height: 24px; }
  .opts-m .fp-sw { width: 40px; height: 24px; } .opts-m .fp-sw > i { width: 18px; height: 18px; } .opts-m .fp[aria-checked="true"] .fp-sw > i { transform: translateX(16px); }
  .opts-m .pf-row { margin-top: 10px; gap: 6px; }
  .opts-m .pf-row > span { font-size: 12.5px; }
  .opts-m .pf-row .pf-seg button { height: 46px !important; padding: 0 4px !important; font-size: 12.5px !important; }
  .opts-m .rd-fine { display: none; }
  .gl { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; margin-top: 10px; }
  .gl-i { padding: 7px 6px 7px 0 !important; gap: 1px; }
  .gl-i:nth-child(3n+2), .gl-i:nth-child(3n+3) { padding-left: 8px !important; border-left: 1px solid rgb(255 255 255 / 0.07) !important; }
  .gl-i:nth-child(2n) { padding-left: 8px; }
  .gl-i:nth-child(3n+1) { padding-left: 0 !important; border-left: 0 !important; }
  .gl-l { font-size: 11px; }
  .gl-v { font-size: 14.5px; }
  .gl-n { font-size: 10.5px; line-height: 1.25; }
  .store-read > div:nth-child(7) { margin-top: 12px !important; gap: 8px 16px !important; }
  .store-read > div:nth-child(7) a.pill { min-height: 44px !important; font-size: 15.5px !important; padding: 0 20px !important; }
  .store-read > div:nth-child(7) .rules-tog { font-size: 14px !important; }
  .rd-promo { margin-top: 10px; padding-top: 10px; font-size: 12px; gap: 6px 10px; }
  .rd-promo p { flex: 1 1 160px; }
  .rd-promo button { min-height: 28px !important; font-size: 12px !important; }
  .store-read::after { content: 'Struck prices are regular prices; the lower price applies with code FFONE at checkout. TruTik launch prices apply to your first 5 TruTik accounts. Offers and prices can change. All accounts are simulated.'; display: block; margin-top: 8px; font-size: 10.5px; line-height: 1.4; color: #8a9896; }
}
/* TruTik slides on phones: just the slide you're looking at, under the demo, with arrows */
.tk-mnav { display: none; }
@media (max-width: 560px) {
  .tk-tabs { margin-top: 16px !important; }
  .tk-tab[data-on="false"] { display: none !important; }
  .tk-tab { padding-top: 14px !important; }
  .tk-tab b { color: #f5f5f7 !important; }
  .tk-tab span { color: #c1c1c6 !important; }
  .tk-mnav { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; }
  .tk-mnav-b { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: rgb(255 255 255 / 0.08); color: #f5f5f7; cursor: pointer; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1); }
  .tk-mnav-b:active { transform: scale(0.94); }
  .tk-mnav-n { font-size: 13px; font-variant-numeric: tabular-nums; color: #9aa1ab; }
}
/* plans on phones, tighter still */
@media (max-width: 560px) {
  .store-read > div:nth-child(7) + p { display: none !important; }
  .gl-n { display: none; }
  .gl-i:nth-child(2) .gl-n { display: block; }
  .rd-promo { flex-wrap: nowrap !important; align-items: center !important; }
  .rd-promo p { font-size: 12px; line-height: 1.3; }
  .rd-promo button span { display: none; }
  #choose .row { padding: 8px 12px !important; }
}
/* plans readability: dim the ribbon behind the panel (the glass rim stays bright) and lift the small grey text */
[data-g="1"] #choose.gs { isolation: isolate; }
[data-g="1"] #choose.gs::before { content: ''; position: absolute; inset: 7px; z-index: -1; border-radius: 31px; background: rgb(3 5 7 / 0.16); pointer-events: none; }
#choose .row { background-color: rgb(0 0 0 / 0.38) !important; }
@media (hover: hover) and (pointer: fine) { #choose .row:hover { background-color: rgb(20 24 26 / 0.62) !important; } }
#choose .row small { color: #c6d0cd !important; }
.gl-l { color: #b6c2bf; }
.gl-n { color: #a9b5b2; }
.pv-note { color: #b6c2bf; }
.rd-fine { color: #aab7b4; }
.rd-promo { color: #dfe6e4; }
/* phones, finish: plans, slides, order pad and starter account */
.tk-try { display: none; }
@media (max-width: 560px) {
  /* plans */
  #choose h2#st-h { font-size: 18px !important; white-space: nowrap; }
  #choose .fam { height: 32px; padding: 3px; font-size: 13px; }
  #choose .fam-l { min-width: 50px; padding: 0 10px; }
  #choose .fam-knob { top: 3px; bottom: 3px; left: 3px; width: calc(50% - 3px); }
  #choose .row[aria-pressed="true"] { background-color: rgb(255 255 255 / 0.06) !important; box-shadow: inset 0 0 0 1.5px rgb(255 255 255 / 0.92) !important; }
  #choose .row b { letter-spacing: -0.012em; }
  [data-g="1"] #choose.gs::before { inset: 5px; border-radius: 21px; }
  .store-read::after { color: #a3afac !important; }

  /* slides: one at a time, same height for every slide so the arrows never jump */
  .tk-tabs { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; margin-top: 14px !important; }
  .tk-tab { grid-area: 1 / 1; }
  .tk-tab[data-on="false"] { display: block !important; visibility: hidden; opacity: 0; pointer-events: none; }
  .tk-tab[data-on="true"] { opacity: 1; transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); }
  .tk-tab b { font-size: 17px; }
  .tk-tab span { font-size: 15px; line-height: 1.45; }
  .tk-mnav { justify-content: flex-start; gap: 8px; margin-top: 16px; }
  .tk-mnav-n { order: -1; margin-right: auto; font-size: 13px; letter-spacing: 0.02em; }
  .tk-mnav-b { width: 38px; height: 38px; background: rgb(255 255 255 / 0.06); transition: background-color 0.15s, transform 0.15s; }

  /* order pad: heading first, then a labelled demo, then the extras */
  .two-risk { gap: 0 !important; margin-top: 64px !important; }
  .two-risk > div:not(.tk-card) { display: contents; }
  .two-risk h3 { order: 1; font-size: 28px !important; text-wrap: balance; }
  .two-risk h3 + p { order: 2; margin-top: 10px !important; font-size: 16px !important; }
  .tk-try { order: 3; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 24px; padding: 0 4px; font-size: 13px; color: #9aa3b4; }
  .tk-try b { font-weight: 600; color: #a9c8ff; }
  .two-risk > .tk-card { order: 4; max-width: none; margin-top: 10px; padding: 14px 14px 12px !important; border-radius: 18px; }
  .two-risk .tk-more { order: 5; margin-top: 28px; }
  .two-risk .tk-more + p { order: 6; margin-top: 18px !important; font-size: 12px !important; }
  .tkt { gap: 10px; }
  .tkt-f { height: 40px; }
  .tkt-big { height: 44px; }
  .tkt-seg button { height: 30px; }

  /* starter account */
  #launch .sec-h { font-size: 32px; }
  #launch .sec-p { font-size: 15.5px; }
  #launch .cd { flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 6px; margin-top: 16px; }
  #launch .cd-l { width: auto; margin: 0 8px 0 0; text-align: left; }
  #launch .cd-n b { font-size: 24px; }
  #launch .cd-n small { margin-top: 4px; font-size: 9.5px; }
  #launch .cd > i { font-size: 20px; }
  .launch-glass { margin-bottom: 72px; padding: 20px 18px 18px; border-radius: 24px; }
  .ln-top { gap: 16px; }
  .ln-h { margin-top: 10px; font-size: 26px; }
  .ln-sub { margin-top: 10px; font-size: 14.5px; }
  .ln-buy { grid-template-columns: auto minmax(0, 1fr); align-items: center; justify-items: stretch; gap: 10px 14px; padding: 14px; border-radius: 16px; background: rgb(0 0 0 / 0.3); box-shadow: inset 0 0 0 1px rgb(170 200 255 / 0.14); }
  .ln-price { font-size: 40px; }
  .ln-price small { margin-top: 5px; font-size: 12px; }
  .ln-buy .pill { justify-self: end; min-height: 46px !important; padding: 0 22px !important; font-size: 16px !important; }
  .ln-fine { grid-column: 1 / -1; max-width: none; font-size: 11.5px; }
  .ln-groups { gap: 16px; margin-top: 18px; padding-top: 0; border-top: 0; }
  .ln-groups .ln-specs { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 4px; }
  .ln-specs > div { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 7px 0; border-bottom: 1px solid rgb(170 200 255 / 0.1); }
  .ln-specs > div:last-child { border-bottom: 0; }
  .ln-specs dt { font-size: 13px; }
  .ln-specs dd { margin: 0; font-size: 14px; text-align: right; }
  .ln-nos { gap: 6px; margin-top: 12px; padding-top: 14px; font-size: 12.5px; }
  .ln-nos li { gap: 5px; padding: 5px 10px 5px 8px; border-radius: 999px; background: rgb(143 182 255 / 0.08); box-shadow: inset 0 0 0 1px rgb(143 182 255 / 0.16); }
  .ln-nos svg { width: 11px; height: 11px; }
  .launch-glass > p:last-child { margin-top: 12px !important; font-size: 11px !important; }
}
@media (max-width: 400px) {
  #choose h2#st-h { font-size: 16px !important; }
  #choose .fam-l { min-width: 42px; padding: 0 8px; }
  #choose header { gap: 10px !important; }
}
@media (max-width: 340px) { #choose h2#st-h { white-space: normal; } }
@media (max-width: 560px) and (hover: hover) and (pointer: fine) { .tk-mnav-b:hover { background: rgb(255 255 255 / 0.12); } }
/* Trade on, back under the plan list */
.pf-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; margin-top: 12px; font-size: 13px; color: #b4c1bd; }
.pf-row > span { white-space: nowrap; }
/* tiny brand mark before each platform name */
.pf-b { display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; }
.pf-ic { flex: none; display: block; height: 14px; background: center / contain no-repeat; }
.pf-b[data-pf="TruTik"] .pf-ic { width: 14px; background-image: url(../logos/platforms/trutik-mark.png); }
.pf-b[data-pf="Tradovate"] .pf-ic { width: 16px; background-image: url(../logos/platforms/tradovate-mark.png); }
.pf-b[data-pf="WealthCharts"] .pf-ic { width: 15px; background-image: url(../logos/platforms/wealthcharts-mark.svg); }
.pf-b[aria-pressed="false"] .pf-ic { opacity: 0.8; }
@media (max-width: 560px) { .pf-b { flex-direction: column; gap: 4px; } .pf-ic { height: 15px; } }
.pv-note { margin-top: 6px; font-size: 12.5px; line-height: 1.35; color: #9fadaa; }
.rd-launch { margin-top: 12px; font-size: 13.5px; line-height: 1.45; letter-spacing: -0.006em; color: #b9c6d8; text-wrap: pretty; }
.rd-launch b { font-weight: 500; color: #d6e4ff; }
@media (max-width: 560px) { .rd-launch { margin-top: 8px; font-size: 12.5px; } }
/* TruTik price line under the big price (removed in v75; styles kept for the rollback copy) */
.rd-save { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 14px; font-size: 14px; line-height: 1.4; color: #b9c6d8; }
.rd-save img { flex: none; display: block; height: 15px; width: auto; margin-right: 2px; }
.rd-save b { font-weight: 500; color: #f5f7fb; }
.tk-save-sw { padding: 0; border: 0; background: none; color: #a9c8ff; font: inherit; font-weight: 500; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; cursor: pointer; }
.tk-save-sw:hover { color: #d2e3ff; }
/* Fast Pass: a bolt, the fee, and a switch that lights up */
.fp { position: relative; overflow: hidden; width: 100%; display: flex; align-items: center; gap: 12px; margin-top: 8px; padding: 11px 12px; border: 0; border-radius: 14px; background: rgb(0 0 0 / 0.34); color: inherit; font: inherit; text-align: left; cursor: pointer; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1); transition: box-shadow 0.3s, background-color 0.3s; }
.fp::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgb(190 255 236 / 0.16) 50%, transparent 70%); transform: translateX(-100%); pointer-events: none; }
.fp[aria-checked="true"] { background: rgb(143 232 210 / 0.07); box-shadow: inset 0 0 0 1px rgb(143 232 210 / 0.55), 0 0 24px -8px rgb(143 232 210 / 0.5); }
.fp[aria-checked="true"]::after { transform: translateX(100%); transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1); }
.fp-ic { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: rgb(255 255 255 / 0.07); color: #9aa7a3; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08); transition: color 0.3s, background-color 0.3s, box-shadow 0.3s; }
.fp[aria-checked="true"] .fp-ic { color: #06221b; background: linear-gradient(160deg, #c6f6ea, #8fe8d2 55%, #5fd0b4); box-shadow: 0 0 16px rgb(143 232 210 / 0.55); }
.fp-t { flex: 1; min-width: 0; }
.fp-t b { display: block; font-size: 14.5px; font-weight: 600; letter-spacing: -0.012em; }
.fp-t small { display: block; margin-top: 1px; font-size: 12.5px; line-height: 1.3; color: #b4c1bd; }
.fp-r { flex: none; display: flex; align-items: center; gap: 12px; }
.fp-r em { font-style: normal; font-size: 14px; font-weight: 500; font-variant-numeric: tabular-nums; color: #d3dcd9; transition: color 0.3s; }
.fp[aria-checked="true"] .fp-r em { color: #c6f6ea; }
.fp-sw { position: relative; width: 46px; height: 26px; border-radius: 99px; background: rgb(255 255 255 / 0.12); box-shadow: inset 0 1px 2px rgb(0 0 0 / 0.5), inset 0 0 0 1px rgb(255 255 255 / 0.08); transition: background-color 0.3s, box-shadow 0.3s; }
.fp-sw > i { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(180deg, #ffffff, #d9dfe3); box-shadow: 0 2px 5px rgb(0 0 0 / 0.45), inset 0 -1px 0 rgb(0 0 0 / 0.08); transition: transform 0.35s cubic-bezier(0.34, 1.4, 0.64, 1); }
.fp[aria-checked="true"] .fp-sw { background: linear-gradient(90deg, #4fc8aa, #8fe8d2); box-shadow: inset 0 1px 2px rgb(0 0 0 / 0.2), 0 0 14px rgb(143 232 210 / 0.45); }
.fp[aria-checked="true"] .fp-sw > i { transform: translateX(20px); }
.fp:focus-visible { outline: 2px solid #8fe8d2; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .fp::after { display: none; } .fp-sw > i { transition-duration: 0.01s; } }
/* price: regular / code price */
.rd-line { display: flex; flex-wrap: wrap; align-items: baseline; font-variant-numeric: tabular-nums; margin-left: -0.02em; }
.rd-was { font-size: clamp(24px, 2.4vw, 36px); font-weight: 400; letter-spacing: -0.02em; color: #9aa7a3; text-decoration-thickness: 2px; }
.rd-sl { margin: 0 0.22em 0 0.16em; font-size: clamp(24px, 2.4vw, 36px); color: rgb(255 255 255 / 0.26); }
.rd-price { display: inline-block; font-size: clamp(80px, 9.4vw, 150px); font-weight: 500; line-height: 1.04; letter-spacing: -0.05em; }
.rd-price small { font-size: 0.42em; letter-spacing: -0.02em; margin-left: 0.03em; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* TruTik wordmark: writes itself on behind a beam of light, the glass arrow shoots up into place, then a slow glint keeps catching the glass */
.tkl { --eio: cubic-bezier(0.77, 0, 0.175, 1); position: relative; flex: none; height: clamp(58px, 6.2vw, 92px); aspect-ratio: 1214 / 293; container-type: size; }
.tkl > *, .tkl-aw > * { position: absolute; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
.tkl-glow { inset: auto; left: 52.4%; top: 61%; width: 150cqh; height: 150cqh; translate: -50% -50%; border-radius: 50%; background: radial-gradient(closest-side, rgb(84 146 255 / 0.42), rgb(60 112 255 / 0.12) 58%, transparent); opacity: 0.6; }
.tkl-shine, .tkl-sheen { overflow: hidden; -webkit-mask: url('../logos/trutik-logo-arrow.webp') 0 0 / 100% 100% no-repeat; mask: url('../logos/trutik-logo-arrow.webp') 0 0 / 100% 100% no-repeat; }
.tkl-sheen { -webkit-mask-image: url('../logos/trutik-logo-letters.webp'); mask-image: url('../logos/trutik-logo-letters.webp'); }
.tkl-shine i, .tkl-sheen i { position: absolute; top: -10%; bottom: -10%; left: 36%; width: 12%; background: linear-gradient(100deg, transparent 20%, rgb(236 245 255 / 0.95) 50%, transparent 80%); mix-blend-mode: screen; transform: translateX(-100%); }
.tkl-sheen i { left: 0; width: 13%; opacity: 0.4; }
.tkl-trail { inset: auto; left: 52.4%; top: 61%; width: 150cqh; height: 2.6cqh; translate: 0 -50%; rotate: 135deg; transform-origin: 0 50%; border-radius: 99px; background: linear-gradient(90deg, rgb(190 216 255 / 0.95), rgb(96 150 255 / 0.4) 32%, transparent); opacity: 0; }
.tkl-beam { inset: -22% auto -22% 0; width: 100%; transform: translateX(-100%); opacity: 0; background: linear-gradient(90deg, transparent calc(100% - 22cqh), rgb(90 150 255 / 0.10) calc(100% - 10cqh), rgb(150 196 255 / 0.55) calc(100% - 1.6cqh), #fff calc(100% - 0.7cqh), transparent); -webkit-mask: linear-gradient(transparent, #000 22%, #000 78%, transparent); mask: linear-gradient(transparent, #000 22%, #000 78%, transparent); }
.tkl.is-armed .tkl-l { clip-path: inset(0 100% 0 0); }
.tkl.is-armed .tkl-aw, .tkl.is-armed .tkl-glow { opacity: 0; }
.tkl.is-on .tkl-l { animation: tkl-write 1.25s var(--eio) both, tkl-hot 1.9s ease-out both; }
.tkl.is-on .tkl-beam { animation: tkl-scan 1.25s var(--eio) both, tkl-scan-o 1.25s linear both; }
.tkl.is-on .tkl-aw { animation: tkl-shoot 1.05s cubic-bezier(0.16, 1, 0.3, 1) 0.46s both; }
.tkl.is-on .tkl-trail { animation: tkl-trail 1s ease-out 0.46s both; }
.tkl.is-on .tkl-glow { animation: tkl-land 1.4s cubic-bezier(0.23, 1, 0.32, 1) 1.05s both, tkl-breathe 4.8s ease-in-out 2.45s infinite alternate; }
.tkl.is-on .tkl-shine i { animation: tkl-glint 6.5s cubic-bezier(0.23, 1, 0.32, 1) 1.1s infinite; }
.tkl.is-on .tkl-sheen i { animation: tkl-sweep 11s cubic-bezier(0.77, 0, 0.175, 1) 4.2s infinite; }
@keyframes tkl-write { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes tkl-hot { from { filter: drop-shadow(0 0 1.1cqh rgb(140 186 255 / 0.95)) brightness(1.18); } to { filter: drop-shadow(0 0 0 rgb(140 186 255 / 0)) brightness(1); } }
@keyframes tkl-scan { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@keyframes tkl-scan-o { 0% { opacity: 0; } 6% { opacity: 1; } 86% { opacity: 1; } 100% { opacity: 0; } }
@keyframes tkl-shoot { 0% { opacity: 0; transform: translate(-34cqh, 34cqh) scale(0.84); } 28% { opacity: 1; } 100% { opacity: 1; transform: none; } }
@keyframes tkl-trail { 0% { opacity: 0; scale: 0.3 1; } 14% { opacity: 1; scale: 1 1; } 100% { opacity: 0; scale: 0.2 1; } }
@keyframes tkl-land { 0% { opacity: 0; scale: 0.6; } 30% { opacity: 1; scale: 1.18; } 100% { opacity: 0.6; scale: 1; } }
@keyframes tkl-breathe { from { opacity: 0.6; scale: 1; } to { opacity: 0.95; scale: 1.1; } }
@keyframes tkl-glint { 0% { transform: translateX(-100%); } 20%, 100% { transform: translateX(260%); } }
@keyframes tkl-sweep { 0% { transform: translateX(-100%); } 16%, 100% { transform: translateX(780%); } }
.tkl-ring { inset: -8.19% -1.98%; width: auto; height: auto; overflow: hidden; -webkit-mask: url('../logos/trutik-logo-ring-mask.webp') 0 0 / 100% 100% no-repeat; mask: url('../logos/trutik-logo-ring-mask.webp') 0 0 / 100% 100% no-repeat; background: linear-gradient(100deg, rgb(130 172 255 / 0.22), rgb(186 214 255 / 0.55) 50%, rgb(130 172 255 / 0.22)); }
.tkl-ring i { position: absolute; top: 0; bottom: 0; left: 0; width: 16%; background: linear-gradient(90deg, transparent, rgb(228 240 255 / 0.95) 50%, transparent); transform: translateX(-120%); }
.tkl.is-armed .tkl-ring { opacity: 0; }
.tkl.is-on .tkl-ring { animation: tkl-ring-in 1.3s cubic-bezier(0.23, 1, 0.32, 1) 1.2s both; }
.tkl.is-on .tkl-ring i { animation: tkl-trace 8s cubic-bezier(0.77, 0, 0.175, 1) 1.35s infinite; }
@keyframes tkl-ring-in { from { opacity: 0; scale: 1.035; } to { opacity: 1; scale: 1; } }
@keyframes tkl-trace { 0% { transform: translateX(-120%); } 24%, 100% { transform: translateX(640%); } }
.tk-now { display: inline-flex; align-items: center; gap: 10px; font-size: 12.5px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: #a9c6ff; white-space: nowrap; }
.tk-now i { width: 28px; height: 1px; background: linear-gradient(90deg, rgb(143 182 255 / 0), rgb(143 182 255 / 0.9)); }
@media (prefers-reduced-motion: reduce) { .tkl-beam, .tkl-trail, .tkl-shine, .tkl-sheen, .tkl-ring i { display: none !important; } }
/* section intros: say what each glass panel is before you reach it */
.ln-sec, #our-plans { scroll-margin-top: 88px; }
.sec-intro { display: grid; justify-items: center; text-align: center; margin-bottom: clamp(28px, 3.2vw, 44px); }
.sec-h { font-family: 'Mona Display', -apple-system, 'Helvetica Neue', Arial, sans-serif; font-stretch: 125%; font-weight: 600; font-size: clamp(36px, 3.9vw, 56px); line-height: 1.05; letter-spacing: -0.03em; color: #fff; text-wrap: balance; }
.sec-p { margin-top: 12px; max-width: 34em; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.4; letter-spacing: -0.016em; color: #c7d0dc; text-wrap: balance; }
.li-mark { display: block; height: 22px; width: auto; margin-bottom: 18px; }
.sec-plans .sec-p { color: #c7d4d4; }
.cd { display: flex; align-items: flex-start; gap: 10px; margin-top: 26px; font-variant-numeric: tabular-nums; }
.cd-l { align-self: center; margin-right: 6px; font-size: 13px; letter-spacing: -0.004em; color: #9fb4d6; }
.cd-n { display: grid; justify-items: center; min-width: 2.4ch; }
.cd-n b { font-size: clamp(30px, 2.6vw, 38px); font-weight: 500; line-height: 1; letter-spacing: -0.03em; color: #fff; }
.cd-n small { margin-top: 7px; font-size: 11px; letter-spacing: 0.04em; text-transform: uppercase; color: #8796ab; }
.cd > i { font-style: normal; font-size: clamp(26px, 2.2vw, 32px); line-height: 1; color: rgb(169 200 255 / 0.45); }
.cd[data-over="true"] .cd-n, .cd[data-over="true"] > i { display: none; }
@media (max-width: 520px) { .cd-l { width: 100%; text-align: center; margin: 0 0 4px; } .cd { flex-wrap: wrap; justify-content: center; } }
/* launch strip: short, TruTik blue */
.launch-glass { --g1: rgb(80 140 255 / 0.95); --g2: rgb(160 200 255 / 0.75); }
.ln-top { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(24px, 4vw, 72px); align-items: end; }
.ln-eye2 { display: flex; align-items: center; gap: 12px; font-size: 13px; letter-spacing: -0.004em; color: #aac4ee; }
.ln-eye2 img { display: block; height: 17px; width: auto; }
.ln-eye2 i { width: 1px; height: 16px; background: rgb(255 255 255 / 0.28); }
.ln-h { margin-top: 16px; font-family: 'Mona Display', -apple-system, 'Helvetica Neue', Arial, sans-serif; font-stretch: 125%; font-weight: 600; font-size: clamp(28px, 2.9vw, 42px); line-height: 1.06; letter-spacing: -0.03em; color: #fff; text-wrap: balance; }
.ln-h .ln-h2 { display: block; color: #a9c8ff; }
.ln-sub { margin-top: 14px; max-width: 40em; font-size: 15.5px; line-height: 1.42; letter-spacing: -0.008em; color: #c3ccd9; }
.ln-buy { display: grid; justify-items: end; gap: 12px; text-align: right; }
.ln-price { font-size: clamp(48px, 4.6vw, 68px); font-weight: 500; line-height: 0.9; letter-spacing: -0.045em; font-variant-numeric: tabular-nums; color: #fff; }
.ln-price small { display: block; margin-top: 8px; font-size: 13px; letter-spacing: -0.004em; color: #aeb8c6; }
.ln-fine { font-size: 12.5px; line-height: 1.4; color: #aeb8c6; max-width: 17em; }
.ln-specs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 24px; margin-top: clamp(22px, 2.4vw, 30px); padding-top: 18px; border-top: 1px solid rgb(170 200 255 / 0.16); }
.ln-specs dt { font-size: 12.5px; color: #9fabbd; letter-spacing: -0.004em; }
.ln-specs dd { margin-top: 3px; font-size: 15.5px; font-weight: 500; letter-spacing: -0.014em; font-variant-numeric: tabular-nums; color: #f5f7fb; }
.ln-nos { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 18px; padding-top: 16px; border-top: 1px solid rgb(170 200 255 / 0.16); font-size: 13.5px; color: #dfe6f1; }
.ln-nos li { display: flex; align-items: center; gap: 7px; }
.ln-nos svg { flex: none; color: #8fb6ff; }
@media (max-width: 900px) { .ln-top { grid-template-columns: minmax(0, 1fr); align-items: start; } .ln-buy { justify-items: start; text-align: left; } .ln-specs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* rules grow out of the plans glass */
.rules-wrap { display: grid; transition: grid-template-rows 0.6s cubic-bezier(0.32, 0.72, 0, 1), visibility 0s; }
.rules-in { min-height: 0; overflow: hidden; }
.rules-body { margin-top: clamp(22px, 2.8vw, 36px); padding-top: clamp(22px, 2.8vw, 34px); border-top: 1px solid rgb(255 255 255 / 0.12); transition: opacity 0.35s var(--e), transform 0.5s var(--e); }
.rules-wrap[data-open="false"] .rules-body { opacity: 0; transform: translateY(-14px); transition-duration: 0.2s; }
.rules-wrap[data-open="true"] .rules-body { transition-delay: 0.12s; }
.rules-tog svg { transition: transform 0.45s var(--e); }
.rules-tog[aria-expanded="true"] svg { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .rules-wrap, .rules-body { transition: none !important; } }
/* primary buttons: glow in the platform's colours (mint and copper; TruTik blue) */
.cta { --g1: rgb(110 236 205 / 0.9); --g2: rgb(244 168 118 / 0.75); position: relative; gap: 10px; box-shadow: -18px 10px 36px -10px var(--g1), 18px 10px 36px -10px var(--g2), 0 0 0 1px rgb(255 255 255 / 0.6), 0 0 28px -4px rgb(255 255 255 / 0.35) !important; transition: background-color 0.2s, box-shadow 0.35s var(--e), transform 0.25s var(--e2) !important; }
.cta:hover { box-shadow: -22px 12px 46px -8px var(--g1), 22px 12px 46px -8px var(--g2), 0 0 0 1px rgb(255 255 255 / 0.8), 0 0 40px -2px rgb(255 255 255 / 0.45) !important; }
.tk-cta { --g1: rgb(80 140 255 / 0.95); --g2: rgb(160 200 255 / 0.75); }
.pf-seg [data-pf="TruTik"] { text-shadow: 0 0 10px rgb(112 166 255 / 0.9), 0 0 24px rgb(80 140 255 / 0.55) !important; }
.pf-seg[data-pfon="TruTik"] .seg-pill { box-shadow: inset 0 0 0 1px rgb(150 190 255 / 0.4), 0 0 18px -3px rgb(80 140 255 / 0.75), 0 0 34px -10px rgb(80 140 255 / 0.6) !important; background: rgb(60 110 220 / 0.32) !important; }
/* social tiles: the live site's 3D icons on small liquid-glass cards */
.soc { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; gap: 14px; min-height: 84px; padding: 12px 14px 12px 12px; border-radius: 20px; color: #f5f5f7; text-decoration: none; background: linear-gradient(155deg, rgb(255 255 255 / 0.085), rgb(255 255 255 / 0.02) 46%, rgb(255 255 255 / 0.045)); -webkit-backdrop-filter: blur(18px) saturate(1.5); backdrop-filter: blur(18px) saturate(1.5); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.16), inset 0 -1px 0 rgb(0 0 0 / 0.3), 0 26px 50px -30px rgb(0 0 0 / 0.95); text-shadow: none; transition: transform 0.4s var(--e), background-color 0.3s; }
.soc::before { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none; background: linear-gradient(135deg, rgb(255 255 255 / 0.38), rgb(255 255 255 / 0.08) 32%, rgb(255 255 255 / 0.04) 64%, rgb(255 255 255 / 0.2)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); }
.soc::after { content: ''; position: absolute; inset: -40% -60%; z-index: -1; pointer-events: none; background: linear-gradient(115deg, transparent 38%, rgb(255 255 255 / 0.11) 48%, rgb(255 255 255 / 0.03) 54%, transparent 62%); transform: translateX(-70%); transition: transform 1s var(--e); }
.soc-i { flex: none; width: 54px; height: 54px; filter: drop-shadow(0 10px 12px rgb(0 0 0 / 0.65)); transition: transform 0.55s cubic-bezier(0.34, 1.5, 0.5, 1); }
.soc-t { min-width: 0; }
.soc-row > li { display: flex; } .soc-row .soc { flex: 1; }
.soc-t b { display: block; font-size: clamp(22px, 1.1rem + 0.5vw, 28px); font-weight: 600; line-height: 1.05; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.soc-t small { display: block; margin-top: 3px; font-size: 13px; line-height: 1.3; color: #b4b4b9; }
.soc-ar { flex: none; align-self: flex-start; margin-left: auto; width: 26px; height: 26px; padding: 5px; border-radius: 50%; background: rgb(255 255 255 / 0.07); color: #c7c7cc; transition: background-color 0.25s, color 0.25s, transform 0.35s var(--e); }
.soc:hover { transform: translateY(-2px); }
.soc:hover::after { transform: translateX(70%); }
.soc:hover .soc-i { transform: translateY(-2px) rotate(-5deg) scale(1.06); }
.soc:hover .soc-ar { background: rgb(255 255 255 / 0.15); color: #fff; transform: translate(1px, -1px); }
.soc:focus-visible { outline: 2px solid #36d6c3; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .soc, .soc::after, .soc-i, .soc-ar { transition: none; } }
@media (max-width: 520px) { .soc-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .soc { gap: 10px; min-height: 72px; padding: 10px; border-radius: 18px; } .soc-i { width: 42px; height: 42px; } .soc-ar { display: none; } .soc-t b { font-size: 20px; } .soc-t small { font-size: 12px; } }
@media (max-width: 900px) { .two-launch { grid-template-columns: minmax(0, 1fr); } }
.fam { position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; align-items: center; height: 40px; padding: 4px; border: 0; border-radius: 999px; background: rgb(0 0 0 / 0.4); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1), inset 0 1px 3px rgb(0 0 0 / 0.55); cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; letter-spacing: -0.01em; -webkit-tap-highlight-color: transparent; }
.fam-l { position: relative; z-index: 1; min-width: 60px; padding: 0 14px; text-align: center; transition: color 0.35s var(--e); }
.fam-knob { --x: 0%; --sx: 1; position: absolute; top: 4px; bottom: 4px; left: 4px; width: calc(50% - 4px); border-radius: 999px; background: linear-gradient(180deg, #ffffff, #dfe3e5); box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgb(0 0 0 / 0.12), 0 8px 18px -6px rgb(0 0 0 / 0.7), 0 0 0 0.5px rgb(0 0 0 / 0.25); transform: translateX(var(--x)) scaleX(var(--sx)); transition: transform 0.6s cubic-bezier(0.34, 1.5, 0.5, 1), background 0.4s; }
.fam[data-labs="true"] .fam-knob { --x: 100%; overflow: hidden; background: linear-gradient(180deg, #dcfbf2, #9fe6d2); animation: fam-glow 3.2s ease-in-out 0.5s infinite; }
.fam[data-labs="true"] .fam-knob::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(105deg, transparent 32%, rgb(255 255 255 / 0.55) 44%, #ffffff 50%, rgb(255 255 255 / 0.55) 56%, transparent 68%); transform: translateX(-120%); mix-blend-mode: screen; animation: fam-sweep 3.2s cubic-bezier(0.77, 0, 0.175, 1) 0.35s infinite; }
@keyframes fam-glow { 0%, 100% { box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgb(0 0 0 / 0.12), 0 8px 18px -6px rgb(0 0 0 / 0.7), 0 0 0 0.5px rgb(143 232 210 / 0.5), 0 0 10px rgb(143 232 210 / 0.25); } 50% { box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgb(0 0 0 / 0.12), 0 8px 18px -6px rgb(0 0 0 / 0.7), 0 0 0 0.5px rgb(143 232 210 / 0.8), 0 0 22px rgb(143 232 210 / 0.55); } }
@keyframes fam-sweep { 0% { transform: translateX(-120%); } 45%, 100% { transform: translateX(120%); } }
@media (prefers-reduced-motion: reduce) { .fam[data-labs="true"] .fam-knob, .fam[data-labs="true"] .fam-knob::after { animation: none; } }
.fam:hover .fam-knob { filter: brightness(1.04); }
.fam:active .fam-knob { --sx: 1.1; transition-duration: 0.25s; }
.fam:focus-visible { outline: 2px solid #f5f5f7; outline-offset: 3px; }
.three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .four { grid-template-columns: repeat(2, minmax(0, 1fr)); } .three { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 520px) { .four { grid-template-columns: minmax(0, 1fr); } }
.nav-in { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; }
@media (max-width: 960px) {
  .foot-top { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .foot-wide { grid-column: 1 / -1; }
  .pa-line { display: none; }
}
@media (max-width: 900px) {
  .two-store, .two-faq, .two-traders, .two-story, .two-founder, .two-tk, .two-risk { grid-template-columns: minmax(0, 1fr); }
  .two-founder > img { position: static; }
  .tk-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tk-card { max-width: 320px; margin-inline: auto; }
  .store-read { order: 0; }
}
@media (max-width: 1080px) {
  .nav-links { display: none !important; }
  .nav-menu { display: inline-flex !important; }
}
@media (max-width: 1240px) { .bar-wide { display: none !important; } }
@media (max-width: 720px) {
  .nav-products { display: none !important; }
  .bar-wide { display: none !important; }
  .tk-tabs, .tk-more { grid-template-columns: minmax(0, 1fr); }
  .nav-login { padding: 0 6px !important; }
  .bar-long { display: none; } .bar-short { display: inline; }
  .hero-br { display: none; }
}
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }