/* Features page (pages/features.html). Class selectors only: WebDNA reads square brackets. */
.fx-wrap{max-width:1040px;margin:0 auto;padding:0 0 60px;font-family:var(--font-body)}
.fx-eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--tx-dim)}
.fx-h1{font-family:var(--font-display);font-size:clamp(30px,5vw,54px);line-height:1.05;margin:8px 0 14px;color:var(--h1-color);text-shadow:var(--h1-shadow);text-transform:uppercase}
.fx-lede{max-width:760px;font-size:19px;line-height:1.55;color:var(--tx-mid)}
.fx-lede b{color:var(--tx-bright)}
.fx-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:26px 0 8px}
.fx-stat{border:1px solid var(--pre-border);background:var(--bg-code);padding:14px 14px 12px;position:relative}
.fx-stat::before{content:"";position:absolute;left:-1px;top:-1px;width:12px;height:12px;border-left:2px solid var(--h2-color);border-top:2px solid var(--h2-color)}
.fx-stat b{display:block;font-family:var(--font-display);font-size:32px;line-height:1;color:var(--h1-color)}
.fx-stat span{display:block;margin-top:6px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-dim)}
.fx-sec{margin-top:46px}
.fx-sec h2{font-family:var(--font-display);font-size:22px;letter-spacing:.08em;text-transform:uppercase;color:var(--h2-color);margin:6px 0 4px}
.fx-sub{color:var(--tx-mid);font-size:16px;margin:0 0 16px;max-width:760px}
.fx-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}
.fx-card{border:1px solid var(--pre-border);background:var(--bg-code);padding:18px 20px;position:relative}
.fx-card::before{content:"";position:absolute;left:-1px;top:-1px;width:14px;height:14px;border-left:2px solid var(--h2-color);border-top:2px solid var(--h2-color)}
.fx-card.wide{grid-column:1/-1}
.fx-k{font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--tx-dim)}
.fx-card h3{font-family:var(--font-display);font-size:17px;letter-spacing:.05em;text-transform:uppercase;margin:6px 0 8px;color:var(--tx-bright)}
.fx-card p{margin:0 0 8px;font-size:16px;line-height:1.5;color:var(--tx-mid)}
.fx-card ul{margin:6px 0 0;padding-left:18px;color:var(--tx-mid);font-size:15px;line-height:1.5}
.fx-card li{margin:3px 0}
.fx-card li::marker{color:var(--h2-color)}
.fx-try{margin-top:10px;font-family:var(--font-mono);font-size:12px;line-height:1.5;color:var(--h2-color)}
.fx-card code,.fx-lede code{font-family:var(--font-mono);font-size:.9em;color:var(--code-color);background:var(--code-bg);border:1px solid var(--code-border);padding:1px 6px}
.fx-spoil{margin-top:10px;border-top:1px dashed var(--pre-border);padding-top:8px}
.fx-spoil summary{cursor:pointer;font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;color:var(--h2-color);list-style:none}
.fx-spoil summary::-webkit-details-marker{display:none}
.fx-spoil summary::before{content:"+ "}
.fx-spoil div{margin-top:8px;font-size:15px;color:var(--tx-bright)}
.fx-honest{margin-top:46px;border:1px solid var(--warn-border);border-left:3px solid var(--warn-border-l);background:var(--warn-bg);padding:18px 22px}
.fx-honest h2{margin:0 0 8px;color:var(--warn-label)}
.fx-honest ul{margin:6px 0 0;padding-left:18px;color:var(--tx-mid);font-size:15px;line-height:1.55}
.fx-foot{margin-top:40px;padding-top:14px;border-top:1px solid var(--pre-border);font-family:var(--font-mono);font-size:12px;color:var(--tx-dim);letter-spacing:.06em}
.fx-direct{display:none;margin-bottom:18px;font-family:var(--font-mono);font-size:13px}
.fx-direct a{color:var(--link);border-bottom:1px solid var(--link-bd);text-decoration:none}
.fx-direct.show{display:block}
.fx-toc{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;font-family:var(--font-mono);font-size:12px}
.fx-toc a{border:1px solid var(--pre-border);color:var(--tx-mid);padding:5px 11px;text-decoration:none;letter-spacing:.06em;text-transform:uppercase}
.fx-toc a:hover{border-color:var(--h2-color);color:var(--tx-bright)}
@media print{.fx-toc,.fx-direct{display:none!important}.fx-spoil div{display:block}}
@media(max-width:700px){.fx-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.fx-grid{grid-template-columns:1fr}}
