/* FutureAI Tools Directory — built on theme tokens (Dark/Light + RTL/LTR aware). */
.fat-breadcrumb{ display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:13px;color:var(--fa-text-faint);
  font-family:var(--fa-font-mono);margin:20px 0 8px }
.fat-breadcrumb a{ color:var(--fa-text-muted) } .fat-breadcrumb a:hover{ color:var(--fa-primary) }

.fat-arc-head{ margin-bottom:20px }

/* filters bar */
.fat-filters{ display:flex;flex-direction:column;gap:12px;background:var(--fa-surface);border:1px solid var(--fa-border);
  border-radius:16px;padding:16px;margin-bottom:24px }
.fat-search input{ width:100%;background:var(--fa-surface-2);border:1px solid var(--fa-border-strong);border-radius:12px;
  padding:12px 16px;color:var(--fa-text);font-family:var(--fa-font-sans);font-size:15px }
.fat-search input:focus{ outline:none;border-color:var(--fa-primary);box-shadow:0 0 0 3px rgba(79,125,255,.25) }
.fat-controls{ display:flex;gap:10px;flex-wrap:wrap }
.fat-controls select{ flex:1;min-width:140px;background:var(--fa-surface-2);border:1px solid var(--fa-border-strong);
  border-radius:12px;padding:11px 14px;color:var(--fa-text);font-family:var(--fa-font-sans);font-size:14px }
.fat-controls select:focus{ outline:none;border-color:var(--fa-primary) }
.fat-controls .fa-btn{ white-space:nowrap }

/* grid + cards */
.fat-grid{ display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px }
.fat-card{ padding:0 }
.fat-card-link{ display:flex;flex-direction:column;gap:12px;padding:20px;height:100%;color:inherit }
.fat-card-top{ display:flex;align-items:center;gap:12px }
.fat-logo{ width:48px;height:48px;border-radius:12px;background:var(--fa-surface-2);border:1px solid var(--fa-border);
  display:grid;place-items:center;font-family:var(--fa-font-mono);color:var(--fa-accent);font-size:20px;flex:none;overflow:hidden }
.fat-logo img{ width:100%;height:100%;object-fit:cover }
.fat-card-h h3{ margin:0;font-size:1.05rem;font-weight:600;color:var(--fa-text) }
.fat-stars{ color:var(--fa-warning);letter-spacing:1px;font-size:14px }
.fat-stars span{ color:var(--fa-text-muted);font-family:var(--fa-font-sans);font-size:13px }
.fat-desc{ color:var(--fa-text-muted);font-size:.9rem;margin:0;flex:1 }
.fat-card-foot{ display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:12px;border-top:1px solid var(--fa-border) }
.fat-badges{ display:flex;gap:6px;flex-wrap:wrap }
.fat-more{ color:var(--fa-primary);font-size:13px;font-weight:600;white-space:nowrap }

/* pagination */
.fat-pagination{ display:flex;justify-content:center;gap:6px;margin:32px 0 }
.fat-pagination .page-numbers{ min-width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--fa-border-strong);
  border-radius:10px;color:var(--fa-text-muted);text-decoration:none;font-family:var(--fa-font-mono);padding:0 8px }
.fat-pagination .page-numbers.current{ background:var(--fa-primary);color:#fff;border-color:var(--fa-primary) }
.fat-pagination a.page-numbers:hover{ border-color:var(--fa-primary);color:var(--fa-text) }

/* single hero */
.fat-single{ padding-bottom:32px }
.fat-hero{ display:flex;gap:20px;align-items:flex-start;background:var(--fa-surface);border:1px solid var(--fa-border);
  border-radius:24px;padding:clamp(20px,4vw,32px);margin:16px 0 24px }
.fat-hero-logo{ width:88px;height:88px;border-radius:18px;background:var(--fa-surface-2);border:1px solid var(--fa-border);
  display:grid;place-items:center;font-family:var(--fa-font-mono);color:var(--fa-accent);font-size:36px;flex:none;overflow:hidden }
.fat-hero-logo img{ width:100%;height:100%;object-fit:cover }
.fat-hero-body{ flex:1;min-width:0 }
.fat-hero-badges{ display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px }
.fat-hero-body h1{ font-size:clamp(1.6rem,4.5vw,2.3rem);margin:0 0 8px;line-height:1.25 }
.fat-stars-lg{ font-size:18px }
.fat-hero-desc{ color:var(--fa-text-muted);font-size:1.05rem;margin:10px 0 18px }
.fat-hero-cta{ display:flex;gap:14px;align-items:center;flex-wrap:wrap }
.fat-price{ font-family:var(--fa-font-mono);color:var(--fa-text-muted);font-size:14px }

/* blocks */
.fat-block{ margin:28px 0 }
.fat-block h2{ font-size:1.4rem;margin:0 0 14px }
.fat-features{ list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px }
.fat-features li{ background:var(--fa-surface);border:1px solid var(--fa-border);border-radius:12px;padding:12px 14px;color:var(--fa-text) }
.fat-features li::before{ content:"◈ ";color:var(--fa-accent) }
.fat-proscons{ display:grid;grid-template-columns:1fr 1fr;gap:16px }
.fat-pros,.fat-cons{ background:var(--fa-surface);border:1px solid var(--fa-border);border-radius:16px;padding:18px }
.fat-pros h3{ color:var(--fa-success);margin:0 0 10px } .fat-cons h3{ color:var(--fa-danger);margin:0 0 10px }
.fat-pros ul,.fat-cons ul{ margin:0;padding-inline-start:18px } .fat-pros li,.fat-cons li{ margin:6px 0;color:var(--fa-text-muted) }

/* AI System Profile — spec row */
.fat-spec{ display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--fa-border);border:1px solid var(--fa-border);
  border-radius:16px;overflow:hidden;margin:8px 0 24px }
.fat-spec-cell{ background:var(--fa-surface);padding:14px 16px;display:flex;flex-direction:column;gap:6px }
.fat-spec-k{ font-family:var(--fa-font-mono);font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--fa-text-faint) }
.fat-spec-v{ font-size:14px;font-weight:600;color:var(--fa-text) }
.fat-spec-rate{ color:var(--fa-warning);font-family:var(--fa-font-mono) }
.fat-status{ display:inline-flex;align-items:center;gap:7px;color:var(--fa-success) }
.fat-hero .fa-eyebrow-label{ margin-bottom:10px }

@media (max-width:640px){
  .fat-hero{ flex-direction:column }
  .fat-proscons{ grid-template-columns:1fr }
  .fat-controls select{ min-width:0;flex-basis:calc(50% - 5px) }
  .fat-spec{ grid-template-columns:repeat(2,1fr) }
}