/* Touch Review site: page parts on top of the shared Touch-The-Game product style (style.css). */

.hero-stat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 46px;max-width:760px}
.hero-stat .s .l{font-size:15px;line-height:1.5;margin-top:7px;max-width:36ch}
@media(max-width:620px){.hero-stat{grid-template-columns:1fr;gap:22px}}

/* product shots */
.frame{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0b0b0b;box-shadow:0 18px 50px -20px #0009}
.frame img,.frame video{display:block;width:100%;height:auto}
.frame .bar{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid #ffffff14;background:#171717}
.frame .bar i{width:11px;height:11px;border-radius:50%;background:#ffffff26;display:inline-block}
.frame .bar .ttl{margin-left:8px;font-size:12.5px;color:#a3a3a3;font-family:var(--mono)}
.caption{font-size:13.5px;color:var(--slate-dim);margin:12px 2px 0;line-height:1.5}

/* demo video */
.demo{max-width:1040px;margin:0 auto}
.demo video{aspect-ratio:16/9;background:#0b0b0b}
.demo-points{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 26px;margin:26px 0 0;padding:0;list-style:none;counter-reset:dp}
.demo-points li{font-size:14.5px;color:var(--slate);line-height:1.5;padding-left:34px;position:relative}
.demo-points li::before{counter-increment:dp;content:counter(dp);position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;background:var(--accent-dim);color:var(--accent);font:700 12px var(--mono);display:grid;place-items:center}
.demo-points b{color:var(--ink)}

/* pillars with screenshots */
.pillars{display:flex;flex-direction:column;gap:64px}
.pillar{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}
.pillar.rev .p-txt{order:2}
@media(max-width:860px){.pillar{grid-template-columns:1fr;gap:22px}.pillar.rev .p-txt{order:0}}
.p-txt .k{font-family:var(--mono);font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);font-weight:600}
.p-txt h2{font-size:clamp(24px,3.2vw,34px);font-weight:780;margin:8px 0 12px}
.p-txt p{color:var(--slate);font-size:16px;line-height:1.6;max-width:48ch;margin:0 0 12px}
.p-txt ul{margin:6px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.p-txt li{font-size:14.5px;color:var(--slate);padding-left:20px;position:relative}
.p-txt li::before{content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:50%;border:2px solid var(--accent)}
.p-txt li b{color:var(--ink);font-weight:600}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.duo{grid-template-columns:1fr}}

/* asset coverage */
.cover td:first-child{font-weight:650;color:var(--ink);white-space:nowrap}
.cover td{color:var(--slate);vertical-align:top}
.cover td.st{white-space:nowrap;text-align:right}
.pill{display:inline-block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border-radius:100px;padding:2px 9px;white-space:nowrap}
.pill.ok{color:var(--good);background:color-mix(in srgb,var(--good) 14%,transparent)}
.pill.wip{color:var(--accent);border:1px solid var(--accent)}

/* Unreal editor panel mock */
.ue-split{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center}
@media(max-width:860px){.ue-split{grid-template-columns:1fr}}
.ue{border:1px solid #2c2c2c;border-radius:10px;overflow:hidden;background:#151515;color:#c8c8c8;font-size:13px;box-shadow:0 18px 50px -20px #000a}
.ue .tabs{display:flex;background:#0f0f0f;border-bottom:1px solid #2c2c2c}
.ue .tab{padding:8px 14px;font-size:12.5px;color:#8a8a8a;border-right:1px solid #2c2c2c;display:flex;align-items:center;gap:7px}
.ue .tab.on{background:#151515;color:#e6e6e6;box-shadow:inset 0 2px 0 var(--accent)}
.ue .tab svg{width:14px;height:14px}
.ue .body{display:grid;grid-template-columns:1fr 1.15fr;min-height:290px}
.ue .list{border-right:1px solid #2c2c2c;padding:8px}
.ue .item{padding:8px 10px;border-radius:5px;margin-bottom:3px}
.ue .item.on{background:#242424}
.ue .item .t{color:#e6e6e6;font-weight:600;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ue .item .m{color:#7d7d7d;font-size:11.5px;margin-top:2px;display:flex;gap:8px;align-items:center}
.ue .st{font-size:10px;font-weight:700;padding:1px 7px;border-radius:100px}
.ue .st.nr{color:#e0b341;background:#e0b34122}.ue .st.ap{color:#43b96f;background:#43b96f22}
.ue .detail{padding:12px 14px;display:flex;flex-direction:column;gap:9px}
.ue .file{display:flex;align-items:center;gap:8px;min-width:0;font-family:var(--mono);font-size:11.5px;color:#bdbdbd}
.ue .file .ty{font-size:9.5px;padding:1px 6px;border-radius:4px;background:#2a2a2a;color:#9a9a9a}
.ue .file .btn-ue{margin-left:auto;font-family:var(--sans);font-size:11px;color:#e6e6e6;background:#2f2f2f;border:1px solid #3a3a3a;border-radius:4px;padding:2px 8px;white-space:nowrap}
.ue .file .btn-ue.hot{background:var(--accent);border-color:var(--accent);color:#fff}
.ue .cmt{border-top:1px solid #2c2c2c;padding-top:9px;font-size:12px;line-height:1.45}
.ue .cmt b{color:#e6e6e6}.ue .cmt .pr{font-size:9.5px;padding:1px 6px;border-radius:100px;color:#5aa0ff;background:#5aa0ff1f;margin-left:6px}
@media(max-width:560px){.ue .body{grid-template-columns:1fr}.ue .list{border-right:none;border-bottom:1px solid #2c2c2c}}
.points{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:16px}
.points li{font-size:15px;color:var(--slate);line-height:1.55}
.points b{color:var(--ink)}

/* closing band */
.band{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.band .b{border-left:3px solid var(--accent);padding:4px 0 4px 16px}
.band .b h3{margin:0 0 6px;font-size:16px}
.band .b p{margin:0;color:var(--slate);font-size:14.5px}
section[id],header{scroll-margin-top:64px}