/* X section pages (/x, /alyxa). Shares tokens with section.css. */
.hero{text-align:center;padding:44px 8px 26px}
.hero h1{font-size:clamp(34px,9vw,72px);letter-spacing:.1em;line-height:1.05;margin:0;font-weight:700;text-transform:none;background:linear-gradient(100deg,var(--t-hot,#ff5c8a),var(--t-violet,#b44fff),var(--t-cyan,#7df9ff),var(--t-hot,#ff5c8a));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 9s linear infinite}
@keyframes shine{to{background-position:300% 0}}
.hero .tag{color:var(--dim);letter-spacing:.14em;text-transform:uppercase;margin:12px 0 6px}
.hero .lede{margin:8px auto 18px;text-align:center}
.sec{margin:30px 0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--t-r3,8px);padding:16px}
.card h3{margin:0 0 6px;font-size:18px;font-weight:400;letter-spacing:.05em}
.card p{margin:0;color:var(--dim)}
.card .k{color:var(--v);font-size:11px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:4px}
.pills{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.muted{color:var(--mute)}
.notice{border:1px solid var(--line2);border-left:3px solid var(--amber);border-radius:var(--t-r1,4px);padding:8px 12px;color:var(--dim);font-size:12px;margin:18px 0}
[hidden]{display:none!important}