/**
 * FatTail category hubs (0.3.0). Layered on info-hub.css: same Apple-HIG foundation
 * (inherited system type, 8pt spacing, 16px radius, lift_1/2/3 materials, one clear hierarchy).
 * Category flair = one accent (--fth-cat), a tint, and a layout. Scoped to .fth-cat. No Flatsome classes.
 */
.fth.fth-cat { --fth-accent: var(--fth-cat); --fth-accent-ink: var(--fth-cat-ink); padding-top: .5rem; }
.fth-cat a { color: inherit; text-decoration: none; }
.fth-cat a:hover { color: var(--fth-cat-ink); }

/* Shared nav: back to hub + segmented switcher (translucent material, sticky). */
.fth-cat-nav { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem;
  margin: 0 -1rem 1.5rem; padding: .625rem 1rem; background: rgba(255,255,255,.78);
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); border-bottom: 1px solid var(--fth-border); }
.fth-cat .fth-cat-back { display: inline-flex; align-items: center; gap: .25rem; font-weight: 600; font-size: .9375rem; color: var(--fth-cat-ink); }
.fth-cat-switch { display: flex; gap: .25rem; padding: .25rem; background: var(--fth-surface); border-radius: 999px; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
.fth-cat-switch::-webkit-scrollbar { display: none; }
.fth-cat .fth-cat-pill { display: block; white-space: nowrap; padding: .375rem .875rem; border-radius: 999px; font-size: .875rem; font-weight: 500; color: var(--fth-muted); transition: background var(--fth-dur), color var(--fth-dur); }
.fth-cat .fth-cat-pill:hover { color: var(--fth-text); }
.fth-cat .fth-cat-pill.is-current { background: var(--fth-bg); color: var(--fth-cat-ink); font-weight: 600; box-shadow: var(--fth-lift-1); }

/* Header: large title hierarchy (h2; the page banner keeps the H1). */
.fth-cat-head { padding-bottom: 1.5rem; }
.fth-cat .fth-cat-eyebrow { color: var(--fth-cat-ink); }
.fth-cat-title { font-size: clamp(2rem, 1.6rem + 1.6cqi, 2.75rem); line-height: 1.08; font-weight: 700; letter-spacing: -.02em; margin-top: .25rem !important; }
.fth-cat-count { margin-top: .5rem !important; }
.fth-cat-sub { font-size: 1.25rem; font-weight: 700; margin: 2rem 0 1rem !important; }
.fth-cat-ex { color: var(--fth-muted); font-size: .9375rem; margin-top: .375rem !important; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.fth-cat img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Generic cards */
.fth-cat-grid { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@container (min-width: 600px) { .fth-cat-grid { grid-template-columns: repeat(2, 1fr); } }
@container (min-width: 900px) { .fth-cat-grid--feature { grid-template-columns: repeat(3, 1fr); } }
.fth-cat-card { background: var(--fth-bg); border: 1px solid var(--fth-border); border-radius: var(--fth-radius); overflow: hidden; display: flex; flex-direction: column; transition: transform var(--fth-dur), box-shadow var(--fth-dur); }
.fth-cat-card:hover { transform: translateY(-2px); box-shadow: var(--fth-lift-3); }
.fth-cat-card-media { aspect-ratio: 16/9; background: var(--fth-cat-tint); overflow: hidden; }
.fth-cat-card-body { padding: 1rem 1.25rem 1.25rem; display: flex; flex-direction: column; gap: .25rem; }
.fth-cat-card-body .fth-small { margin-top: auto !important; padding-top: .5rem; }
.fth-cat-more { text-align: center; margin-top: 1.5rem !important; }

/* Trading Options: featured article + topic chips */
.fth-cat-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.25rem; }
.fth-cat .fth-cat-chip { border: 1px solid var(--fth-border); background: var(--fth-bg); color: var(--fth-text); border-radius: 999px; padding: .375rem .875rem; font-size: .875rem; font-weight: 500; cursor: pointer; }
.fth-cat .fth-cat-chip.is-on { background: var(--fth-cat); border-color: var(--fth-cat); color: #fff; }
.fth-cat-feature { display: grid; border-radius: var(--fth-radius); overflow: hidden; background: var(--fth-cat-tint); margin-bottom: 1.5rem; }
@container (min-width: 760px) { .fth-cat-feature { grid-template-columns: 1.3fr 1fr; } }
.fth-cat-feature-media { aspect-ratio: 16/9; overflow: hidden; }
.fth-cat-feature-body { padding: 1.5rem; display: flex; flex-direction: column; justify-content: center; gap: .25rem; }
.fth-cat-feature-t { font-size: clamp(1.35rem, 1.1rem + 1cqi, 1.75rem); line-height: 1.2; font-weight: 700; letter-spacing: -.01em; }

/* Coach: comic strip gallery (wide panels, captions under). */
.fth-cat--strips .fth-cat-card { border: 0; background: transparent; box-shadow: none; }
.fth-cat--strips .fth-cat-card-media { aspect-ratio: auto; border-radius: var(--fth-radius); border: 1px solid var(--fth-border); box-shadow: var(--fth-lift-2); background: #fff; }
.fth-cat--strips .fth-cat-card-media img { height: auto; object-fit: contain; }
.fth-cat--strips .fth-cat-card-body { padding: .75rem .25rem 0; }
.fth-cat--strips .fth-cat-card.is-featured { grid-column: 1 / -1; }

/* FOMC: dark event card with countdown + meeting dots, then a vertical alert timeline. */
.fth-cat-event { display: grid; gap: 1.25rem; align-items: center; padding: 1.5rem; border-radius: var(--fth-radius); background: linear-gradient(135deg, #111827, #1e1b4b); color: #f5f5f7; margin-bottom: 1.5rem; }
@container (min-width: 700px) { .fth-cat-event { grid-template-columns: 1fr auto; padding: 2rem; } }
.fth-cat-event-k { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: #a5b4fc; }
.fth-cat-event-t { font-size: 1.5rem; font-weight: 700; margin-top: .25rem !important; color: #fff; }
.fth-cat-event-d { margin-top: .25rem !important; color: #c7d2fe; }
.fth-cat-event-b { display: inline-block; margin-top: .5rem !important; font-size: .8125rem; padding: .125rem .625rem; border-radius: 999px; background: rgba(165,180,252,.18); }
.fth-cat-days { text-align: center; min-width: 7rem; }
.fth-cat-days-n { display: block; font-size: 3.5rem; line-height: 1; font-weight: 700; letter-spacing: -.03em; font-variant-numeric: tabular-nums; color: #fff; }
.fth-cat-days-l { font-size: .875rem; color: #a5b4fc; }
.fth-cat-meetings { grid-column: 1 / -1; display: flex; gap: .5rem; flex-wrap: wrap; border-top: 1px solid rgba(255,255,255,.12); padding-top: 1rem !important; }
.fth-cat-meetings li { font-size: .8125rem; padding: .25rem .75rem; border-radius: 999px; background: rgba(255,255,255,.08); color: #c7d2fe; }
.fth-cat-meetings li.is-next { background: #6366f1; color: #fff; font-weight: 600; }
.fth-cat-timeline { position: relative; padding-left: 1.5rem !important; }
.fth-cat-timeline::before { content: ""; position: absolute; left: .4rem; top: .5rem; bottom: .5rem; width: 2px; background: var(--fth-cat-tint); border-radius: 2px; }
.fth-cat-tl { position: relative; padding-bottom: 1rem !important; }
.fth-cat-tl::before { content: ""; position: absolute; left: -1.38rem; top: .35rem; width: .75rem; height: .75rem; border-radius: 50%; background: var(--fth-cat); box-shadow: 0 0 0 3px #fff; }
.fth-cat-tl-d { font-size: .8125rem; font-weight: 600; color: var(--fth-cat-ink); }
.fth-cat-tl-card { margin-top: .375rem; padding: 1rem 1.25rem; border-radius: var(--fth-radius); border: 1px solid var(--fth-border); background: var(--fth-bg); }
.fth-cat-tl-t { font-size: 1.0625rem; font-weight: 600; line-height: 1.35; }

/* Live Show: featured latest + 3-up grid, red live accent */
.fth-cat-vfeature { display: grid; border-radius: var(--fth-radius); overflow: hidden; background: #000; color: #fff !important; margin-bottom: 1.5rem; }
@container (min-width: 760px) { .fth-cat-vfeature { grid-template-columns: 1.6fr 1fr; } }
.fth-cat-vmedia { position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; background: #111; }
.fth-cat-vbody { display: flex; flex-direction: column; justify-content: center; gap: .5rem; padding: 1.5rem; }
.fth-cat-vfeature .fth-cat-vtitle { font-size: 1.375rem; font-weight: 700; line-height: 1.25; }
.fth-cat-live { align-self: flex-start; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: .2rem .6rem; border-radius: 999px; background: var(--fth-cat); }
.fth-cat-play { position: absolute; left: 50%; top: 50%; width: 3.5rem; height: 3.5rem; margin: -1.75rem 0 0 -1.75rem; border-radius: 50%; background: rgba(0,0,0,.55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.fth-cat-play::after { content: ""; position: absolute; left: 1.4rem; top: 1.05rem; border-left: 1.1rem solid #fff; border-top: .7rem solid transparent; border-bottom: .7rem solid transparent; }
.fth-cat-vgrid { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@container (min-width: 600px) { .fth-cat-vgrid { grid-template-columns: repeat(2, 1fr); } }
@container (min-width: 900px) { .fth-cat-vgrid { grid-template-columns: repeat(3, 1fr); } }
.fth-cat-vcard { display: block; border-radius: var(--fth-radius); overflow: hidden; background: var(--fth-bg); border: 1px solid var(--fth-border); transition: transform var(--fth-dur), box-shadow var(--fth-dur); }
.fth-cat-vcard:hover { transform: translateY(-2px); box-shadow: var(--fth-lift-3); }
.fth-cat-vcard .fth-cat-vtitle { display: block; padding: .75rem 1rem 1rem; font-weight: 600; font-size: .9375rem; line-height: 1.35; }

/* Shorts: vertical 9:16 card rail with scroll snap */
.fth-cat-rail { display: grid; grid-auto-flow: column; grid-auto-columns: 44%; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: .25rem .25rem 1rem !important; scrollbar-width: thin; }
@container (min-width: 600px) { .fth-cat-rail { grid-auto-columns: 30%; } }
@container (min-width: 900px) { .fth-cat-rail { grid-auto-columns: 18.5%; } }
.fth-cat-rail li { scroll-snap-align: start; }
.fth-cat-short { position: relative; display: block; aspect-ratio: 9/16; border-radius: 20px; overflow: hidden; background: #111; color: #fff !important; transition: transform var(--fth-dur); }
.fth-cat-short:hover { transform: scale(1.02); }
.fth-cat-short::after { content: ""; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent, rgba(0,0,0,.85)); }
.fth-cat-short-t { position: absolute; z-index: 1; left: .75rem; right: .75rem; bottom: .75rem; font-size: .875rem; font-weight: 600; line-height: 1.3; }
.fth-cat--rail .fth-cat-head::after { content: ""; display: block; width: 3rem; height: 4px; border-radius: 2px; margin-top: 1rem; background: linear-gradient(90deg, var(--fth-cat), #ec4899); }

/* 0.3.1 newest short, set apart from the rail */
.fth-cat-sfeature { display: grid; grid-template-columns: minmax(150px, 38%) 1fr; gap: 1.25rem; align-items: center; padding: 1.25rem; border-radius: 24px; background: linear-gradient(135deg, #1e1033, #3b0764); color: #fff !important; margin-bottom: .5rem; }
.fth-cat-sfeature .fth-cat-vbody { padding: 0; }
.fth-cat-sfeature .fth-cat-vtitle { font-size: clamp(1.15rem, 1rem + 1cqi, 1.6rem); font-weight: 700; line-height: 1.25; }
.fth-cat-sfeature .fth-small { color: #d8b4fe; }
.fth-cat-short--big::after { inset: 60% 0 0; }
@container (max-width: 420px) { .fth-cat-sfeature { grid-template-columns: 1fr; } .fth-cat-short--big { max-width: 260px; margin: 0 auto; } }
.fth-cat--fomc .fth-cat-feature { background: var(--fth-cat-tint); }
/* 0.3.2 Coach: whole strip (image + caption) is one link to the full post */
.fth-cat .fth-cat-strip { display: flex; flex-direction: column; color: inherit; border-radius: var(--fth-radius); }
.fth-cat .fth-cat-strip .fth-cat-card-media { display: block; }
.fth-cat .fth-cat-strip .fth-h3 { display: block; }
.fth-cat .fth-cat-strip:hover .fth-h3 { color: var(--fth-cat-ink); text-decoration: underline; text-underline-offset: 2px; }
/* 0.3.1 pager + empty state */
.fth-cat-pager { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .5rem; margin-top: 2rem; }
.fth-cat-pg-list { display: flex; gap: .25rem; align-items: center; }
.fth-cat .fth-cat-pg { display: inline-flex; align-items: center; justify-content: center; min-width: 2.75rem; height: 2.75rem; padding: 0 .75rem; border-radius: 999px; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--fth-text); background: var(--fth-surface); }
.fth-cat .fth-cat-pg:hover { color: var(--fth-cat-ink); box-shadow: var(--fth-lift-1); }
.fth-cat .fth-cat-pg.is-current { background: var(--fth-cat); color: #fff; font-weight: 600; }
.fth-cat .fth-cat-pg--step { color: var(--fth-cat-ink); font-weight: 600; }
.fth-cat-empty { text-align: center; padding: 2rem 1.5rem; border-radius: var(--fth-radius); background: var(--fth-cat-tint); display: grid; gap: .5rem; }
@media (prefers-reduced-motion: reduce) { .fth-cat * { transition: none !important; } .fth-cat-rail { scroll-behavior: auto; } }

/* ===== 0.3.4 full-width layouts ([col span=12], ~1200px). Same HIG foundation; more room per category. ===== */
.fth.fth-cat { max-width: 1200px; }
/* Capsule nav = the primary nav, centered. Back link sits small above it. */
.fth-cat-nav { flex-direction: column; justify-content: center; gap: .625rem; margin: 0 0 2rem; padding: .75rem 0 1rem; background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; text-align: center; }
.fth-cat .fth-cat-back { font-size: .8125rem; font-weight: 500; color: var(--fth-muted); }
.fth-cat .fth-cat-back:hover { color: var(--fth-cat-ink); }
.fth-cat-switch { justify-content: flex-start; margin: 0 auto; padding: .3125rem; box-shadow: inset 0 0 0 1px var(--fth-border); }
.fth-cat .fth-cat-pill { padding: .5rem 1.125rem; font-size: .9375rem; min-height: 2.75rem; display: flex; align-items: center; }
.fth-cat .fth-cat-pill.is-current { background: var(--fth-cat); color: #fff; box-shadow: 0 2px 8px color-mix(in srgb, var(--fth-cat) 35%, transparent); }
.fth-cat-head { text-align: center; padding-bottom: 2rem; }
.fth-cat-head .fth-tagline { margin-left: auto; margin-right: auto; }
.fth-cat--rail .fth-cat-head::after { margin-left: auto; margin-right: auto; }
.fth-cat-chips { justify-content: center; }
.fth-cat-sub { font-size: 1.375rem; letter-spacing: -.01em; }
.fth-cat .fth-signup .fth-card, .fth-cat .fth-observer { max-width: 760px; margin-left: auto; margin-right: auto; }

/* Trading Options: big split hero + 3-col editorial grid */
.fth-cat--feature .fth-cat-feature { border-radius: 24px; }
@container (min-width: 900px) {
  .fth-cat--feature .fth-cat-feature { grid-template-columns: 1.45fr 1fr; min-height: 380px; }
  .fth-cat--feature .fth-cat-feature-media { aspect-ratio: auto; height: 100%; }
  .fth-cat--feature .fth-cat-feature-body { padding: 2.5rem; }
  .fth-cat--feature .fth-cat-feature-t { font-size: 2rem; }
  .fth-cat-grid--feature, .fth-cat-grid--strips { grid-template-columns: repeat(3, 1fr) !important; }
}
.fth-cat .fth-cat-readbtn { align-self: flex-start; margin-top: .75rem; background: var(--fth-cat); }

/* Coach: comic-book wall. Wide featured panel, then a 3-col strip wall with episode labels. */
.fth-cat--strips .fth-cat-strip { position: relative; }
.fth-cat-ep { display: inline-block; align-self: flex-start; margin: .625rem 0 0 .25rem; padding: .125rem .625rem; border-radius: 6px; font-size: .75rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; background: #fde68a; color: #78350f; transform: rotate(-1.5deg); box-shadow: 2px 2px 0 #b45309; }
.fth-cat--strips .fth-cat-card-media { border: 3px solid #111; box-shadow: 5px 5px 0 #111; border-radius: 10px; }
.fth-cat--strips .fth-cat-card.is-featured .fth-cat-card-media { box-shadow: 8px 8px 0 var(--fth-cat); }
.fth-cat--strips .fth-cat-card.is-featured .fth-h3 { font-size: 1.5rem; }
.fth-cat--strips .fth-cat-card.is-featured { margin-bottom: 1rem; }

/* FOMC: two-column hero (countdown + newest alert), wide timeline */
.fth-cat-hero2 { display: grid; gap: 1.25rem; margin-bottom: 2rem; }
.fth-cat-hero2 > * { margin-bottom: 0 !important; }
@container (min-width: 900px) { .fth-cat-hero2 { grid-template-columns: 1.1fr 1fr; align-items: stretch; } .fth-cat-hero2 .fth-cat-event { grid-template-columns: 1fr auto; } }
.fth-cat-feature--alert { border-radius: 24px; border-left: 6px solid var(--fth-cat); }
.fth-cat-feature--alert .fth-cat-feature-body { padding: 1.75rem 2rem; }
.fth-cat-feature--alert .fth-cat-ex { -webkit-line-clamp: 5; }
.fth-cat .fth-cat-readmore { font-weight: 600; color: var(--fth-cat-ink); }
@container (min-width: 900px) {
  .fth-cat-timeline { padding-left: 0 !important; }
  .fth-cat-timeline::before { left: 10.5rem; }
  .fth-cat-tl { display: grid; grid-template-columns: 9.5rem 1fr; gap: 2.25rem; align-items: start; }
  .fth-cat-tl::before { left: 10.1rem; top: 1.3rem; }
  .fth-cat-tl-d { text-align: right; padding-top: 1.05rem; }
  .fth-cat-tl-card { margin-top: 0; }
}

/* Live Show: cinematic 16:9 featured, next-show line, 3-4 col replays */
@container (min-width: 900px) {
  .fth-cat--video .fth-cat-vfeature { display: block; position: relative; border-radius: 24px; }
  .fth-cat--video .fth-cat-vfeature .fth-cat-vbody { position: absolute; left: 0; right: 0; bottom: 0; padding: 4rem 2.5rem 2rem; background: linear-gradient(transparent, rgba(0,0,0,.85)); }
  .fth-cat--video .fth-cat-vfeature .fth-cat-vtitle { font-size: 2rem; max-width: 30ch; }
  .fth-cat--video .fth-cat-vfeature .fth-cat-play { width: 5rem; height: 5rem; margin: -2.5rem 0 0 -2.5rem; }
  .fth-cat--video .fth-cat-vfeature .fth-cat-play::after { left: 2rem; top: 1.5rem; border-left-width: 1.5rem; border-top-width: 1rem; border-bottom-width: 1rem; }
}
@container (min-width: 1080px) { .fth-cat-vgrid { grid-template-columns: repeat(4, 1fr); } }
.fth-cat-next { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .375rem .625rem; margin: 1rem 0 0 !important; padding: .75rem 1rem; border-radius: 999px; background: var(--fth-cat-tint); color: var(--fth-cat-ink); font-weight: 600; text-align: center; }
.fth-cat-next a { color: var(--fth-cat-ink) !important; text-decoration: underline !important; text-underline-offset: 2px; font-weight: 500; }
.fth-cat-next-dot { width: .625rem; height: .625rem; border-radius: 50%; background: var(--fth-cat); box-shadow: 0 0 0 4px color-mix(in srgb, var(--fth-cat) 25%, transparent); }

/* Shorts: big 9:16 featured beside a 2x2 of the next four; rest as a grid (rail on phones) */
.fth-cat-shero { display: grid; gap: 1.25rem; margin-bottom: 1rem; }
.fth-cat-quad { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@container (min-width: 900px) {
  .fth-cat-shero { grid-template-columns: 1.15fr 1fr; align-items: stretch; }
  .fth-cat-sfeature { grid-template-columns: minmax(0, 300px) 1fr; margin-bottom: 0; padding: 1.5rem; }
  .fth-cat-quad .fth-cat-short { height: 100%; aspect-ratio: auto; min-height: 220px; }
  .fth-cat-rail { grid-auto-flow: row; grid-template-columns: repeat(4, 1fr); grid-auto-columns: auto; overflow: visible; }
}
@container (max-width: 520px) { .fth-cat-quad { grid-template-columns: repeat(2, 1fr); } .fth-cat-nav { margin-bottom: 1.25rem; } .fth-cat-switch { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .fth-cat-ep { transform: none; } }

/* 0.3.5: header block removed; content starts close under the capsule nav. */
.fth-cat .fth-cat-h1.fth-sr { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }
.fth-cat .fth-cat-nav { margin-bottom: 1rem !important; padding-bottom: 0 !important; }
.fth-cat .fth-cat-nav + .fth-cat-h1 + *, .fth-cat .fth-cat-nav + * { margin-top: 0 !important; }

/* 0.4.0: full-bleed category banner + hub search + tag chips. HIG: 17px body, >=4.5:1 contrast, 44px targets. */
/* Full-bleed uses 100vw; Flatsome sets body overflow-x:hidden, so no horizontal scroll. */
.fth-bn { position: relative; width: 100vw; margin: 0 0 1.5rem calc(50% - 50vw); background: var(--fth-cat-ink); color: #fff; }
.fth-bn-in { box-sizing: border-box; max-width: 1200px; min-height: 240px; margin: 0 auto; padding: 1.5rem 15px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 2rem; align-items: center; }
.fth-bn-text { min-width: 0; }
.fth .fth-bn-h1 { margin: 0 0 .25rem; font-size: 2.125rem; line-height: 1.15; font-weight: 700; letter-spacing: -.01em; color: #fff; }
.fth .fth-bn-promise { margin: 0 0 .75rem; font-size: 1.0625rem; line-height: 1.4; color: rgba(255,255,255,.92); }
.fth .fth-bn-facts { margin: 0 0 1rem; padding: 0; list-style: none; font-size: .9375rem; line-height: 1.4; color: #fff; }
.fth-bn-facts li { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fth .fth-bn-cd { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .5rem; margin: 0 0 .5rem; font-size: .9375rem; }
.fth-bn-cd-n { font-size: 2.5rem; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.fth-bn-cd-l { font-weight: 600; }
.fth-bn-pill, .fth-bn-badge { display: inline-flex; align-items: center; gap: .375rem; padding: .125rem .625rem; border-radius: 999px; background: rgba(255,255,255,.18); font-size: .8125rem; font-weight: 600; }
.fth-bn-badge { margin: 0 0 .5rem; background: #fff; color: var(--fth-cat-ink); }
.fth-bn-dot { width: 8px; height: 8px; border-radius: 50%; background: #dc2626; }
.fth-bn-art { align-self: stretch; min-height: 192px; }
.fth-bn-img { display: block; width: 100%; height: 100%; min-height: 192px; max-height: 240px; object-fit: cover; border-radius: 16px; }
.fth-bn-ph { height: 100%; min-height: 192px; border-radius: 16px; border: 2px dashed rgba(255,255,255,.55); background: repeating-linear-gradient(135deg, rgba(255,255,255,.08) 0 12px, rgba(255,255,255,.02) 12px 24px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; color: #fff; text-align: center; }
.fth-bn-ph span { font-weight: 700; letter-spacing: .08em; font-size: .9375rem; }
.fth-bn-ph small { font-size: .8125rem; opacity: .9; }
/* Search */
.fth-hs { position: relative; max-width: 520px; margin: 0; }
.fth .fth-hs-in { box-sizing: border-box; width: 100%; height: 44px; margin: 0; padding: 0 1rem 0 2.5rem; border: 0; border-radius: 12px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat .875rem 50%; color: #1d1d1f; font-size: 1.0625rem; box-shadow: 0 1px 2px rgba(0,0,0,.15); }
.fth .fth-hs-in:focus { outline: 3px solid rgba(255,255,255,.7); outline-offset: 2px; }
.fth .fth-hs-lb { position: absolute; z-index: 50; left: 0; right: 0; top: calc(100% + 6px); margin: 0; padding: .375rem; list-style: none; background: #fff; color: #1d1d1f; border-radius: 14px; box-shadow: 0 12px 32px rgba(0,0,0,.22); max-height: 70vh; overflow: auto; }
.fth-hs-lb li { margin: 0; }
.fth .fth-hs-g { padding: .375rem .625rem .125rem; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: #6e6e73; }
.fth .fth-hs-o { display: flex; align-items: center; gap: .75rem; min-height: 44px; padding: .375rem .625rem; border-radius: 10px; cursor: pointer; }
.fth-hs-o[aria-selected="true"], .fth-hs-o:hover { background: var(--fth-cat-tint); }
.fth-hs-o img, .fth-hs-o .fth-hs-ni { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 8px; object-fit: cover; background: #f5f5f7; }
.fth-hs-o b { display: block; font-size: .9375rem; font-weight: 600; line-height: 1.3; }
.fth-hs-o small { color: #6e6e73; font-size: .8125rem; }
.fth-hs-o--tag b::before { content: "#"; color: var(--fth-cat-ink); margin-right: 2px; }
.fth-hs-all { color: var(--fth-cat-ink); font-weight: 600; }
/* Tag chips: ~8 on desktop, one scrolling row on phones */
.fth-bn-tags ul { display: flex; flex-wrap: wrap; gap: .5rem; margin: .75rem 0 0; padding: 0; list-style: none; }
.fth-bn-tags li { margin: 0; }
.fth-bn-tag { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1rem; border-radius: 999px; background: rgba(255,255,255,.16); color: #fff; font-size: .9375rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.fth-bn-tag:hover { background: rgba(255,255,255,.28); color: #fff; }
.fth-bn-tag.is-on { background: #fff; color: var(--fth-cat-ink); }
/* Content column under the banner */
.fth-cat-col { box-sizing: border-box; max-width: 1200px; margin: 0 auto; }
.fth-hs-results { margin-bottom: 2rem; }
.fth-hs-rl { margin: 0; padding: 0; list-style: none; display: grid; gap: .5rem; }
.fth-hs-rl a { display: flex; gap: .875rem; align-items: center; min-height: 64px; padding: .5rem; border-radius: 12px; text-decoration: none; color: inherit; }
.fth-hs-rl a:hover { background: var(--fth-cat-tint); }
.fth-hs-rl img { width: 64px; height: 64px; border-radius: 10px; object-fit: cover; }
.fth-hs-rl .fth-h3 { display: block; }
.fth-hs-tagline { margin: 0 0 1rem; padding: .75rem 1rem; border-radius: 12px; background: var(--fth-cat-tint); }
.fth-hs-tagline a { display: inline-flex; min-height: 44px; align-items: center; color: var(--fth-cat-ink); font-weight: 600; }
p.fth-was-h1 { font-size: inherit; }
@media (max-width: 849px) {
	.fth-bn-in { grid-template-columns: 1fr; min-height: 0; gap: 1rem; padding: 1.25rem 16px; }
	.fth-bn-art { order: -1; min-height: 0; }
	.fth-bn-img { min-height: 0; height: auto; max-height: 160px; aspect-ratio: 32 / 15; }
	.fth-bn-ph { min-height: 72px; flex-direction: row; gap: .5rem; }
	.fth .fth-bn-h1 { font-size: 1.75rem; }
	.fth-bn-cd-n { font-size: 2rem; }
	.fth-bn-facts li { white-space: normal; }
	.fth-bn-tags ul { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x proximity; margin-right: -16px; padding-right: 16px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
	.fth-bn-tags li { scroll-snap-align: start; }
}
@media (prefers-reduced-motion: no-preference) { .fth-bn-dot { animation: fth-pulse 1.6s infinite; } }
@keyframes fth-pulse { 50% { opacity: .35; } }

/* 0.4.1: banner lifted to the top of the page; clear Flatsome's transparent header (overlays #main). */
.fth.fth-bn-top { max-width: none; width: auto; margin: 0; padding: 0; }
.has-transparent + #main .fth-bn-top > .fth-bn { padding-top: var(--fth-hdr, 90px); }
@media (max-width: 549px) { .has-transparent + #main .fth-bn-top > .fth-bn { padding-top: var(--fth-hdr, 70px); } }

/* 0.4.2: large Try FatTail button under the search/tags (HIG: 52px target, 17px bold, accent-ink on white >= 4.5:1). Full width on phones. */
.fth .fth-bn-cta, .fth .fth-bn-cta:visited { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 240px; min-height: 52px; margin-top: 1rem; padding: 0 2rem; border-radius: 14px; background: #fff; color: var(--fth-cat-ink); font-size: 1.0625rem; font-weight: 700; letter-spacing: .01em; text-decoration: none; box-shadow: 0 2px 8px rgba(0,0,0,.25); transition: transform .15s, box-shadow .15s; }
.fth .fth-bn-cta:hover { color: var(--fth-cat-ink); transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,.3); }
.fth .fth-bn-cta:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 849px) { .fth .fth-bn-cta { display: flex; width: 100%; min-width: 0; } }
@media (prefers-reduced-motion: reduce) { .fth .fth-bn-cta { transition: none; } }

/* 0.4.2: Latest alert fills the row; text left, image right; image on top on phones. */
.fth-cat-hero2 > :only-child { grid-column: 1 / -1; }
.fth-cat-feature--alert.has-media { display: grid; grid-template-columns: 1fr; padding: 0; }
.fth-cat-feature--alert.has-media .fth-alert-media { display: block; aspect-ratio: 16 / 9; overflow: hidden; }
.fth-alert-media .fth-alert-img { display: block; width: 100%; height: 100%; object-fit: cover; }
@container (min-width: 760px) {
	.fth-cat-feature--alert.has-media { grid-template-columns: 1.1fr 1fr; min-height: 320px; }
	.fth-cat-feature--alert.has-media .fth-alert-media { order: 2; aspect-ratio: auto; height: 100%; }
}