/* /articles (News & events): hero with search, featured post, topic filters, card grid, book CTA.
   Markup: scripts/articles_page.py; filters, search and "show more": bin/js/fx-articles.js */

/* the old 100vh photo splash shrinks to a spacer under the fixed header */
.article_splash_fox { height: auto !important; min-height: 0 !important; background: #1b1b1b !important; }
.article_splash_fox td.vm, .article_splash_fox .scroll-down { display: none !important; }

.fx-ar { display: block; font-family: Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif; color: #1e1e1e; background: #f6f1ea; -webkit-font-smoothing: antialiased; }
.fx-ar *, .fx-ar *:before, .fx-ar *:after { box-sizing: border-box; }
.fx-ar-wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.fx-ar-pill { display: inline-block; margin: 0 0 18px; padding: 9px 20px; border-radius: 999px; background: #f08400; color: #1e1e1e; font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; transform: rotate(-2deg); }
.fx-ar .fx-ar-h2 { margin: 0; font: 700 38px/1.1 Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif; letter-spacing: -.02em; text-transform: none; color: inherit; }
.fx-ar svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

/* Hero */
.fx-ar-hero { padding: 64px 0 150px; background: radial-gradient(800px 420px at 85% 20%, rgba(240, 132, 0, .25), transparent 70%), #1b1b1b; color: #fff; text-align: center; }
.fx-ar .fx-ar-hero__title { max-width: 900px; margin: 0 auto 16px; font: 700 54px/1.05 Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif; letter-spacing: -.02em; text-transform: none; color: #fff; text-wrap: balance; }
.fx-ar-hero__title span { color: #f08400; }
.fx-ar-hero__lead { max-width: 640px; margin: 0 auto 30px; font-size: 18px; line-height: 1.55; color: rgba(255, 255, 255, .78); }
.fx-ar-search { display: flex; align-items: center; gap: 12px; max-width: 640px; margin: 0 auto; padding: 0 22px; border-radius: 999px; background: #fff; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); cursor: text; }
.fx-ar-search svg { flex: none; width: 22px; height: 22px; stroke: #f08400; }
.fx-ar-search input { flex: 1; min-width: 0; height: 60px; border: 0; outline: 0; background: none; color: #1e1e1e; font: 600 17px Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif; }
.fx-ar-search:focus-within { box-shadow: 0 0 0 3px #f08400, 0 10px 30px rgba(0, 0, 0, .35); }

/* Featured */
.fx-ar-feat-wrap { margin-top: -110px; }
html:not(#fx) .fx-ar-feat { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); overflow: hidden; border-radius: 28px; background: #fff; color: #1e1e1e; text-decoration: none; box-shadow: 0 18px 40px rgba(60, 30, 0, .14); }
.fx-ar-feat__img { display: block; min-height: 340px; background: #e8e2d9; }
.fx-ar-feat__img img, .fx-ar-card__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fx-ar-feat__body { display: flex; flex-direction: column; justify-content: center; gap: 12px; padding: 40px; }
.fx-ar-feat__body b { font-size: 30px; font-weight: 800; line-height: 1.15; letter-spacing: -.01em; transition: color .2s ease; }
.fx-ar-feat__lead { font-size: 17px; line-height: 1.55; color: #4a443e; }
.fx-ar-feat__more { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 15px; font-weight: 800; color: #c45f00; }
html:not(#fx) .fx-ar-feat:hover b, html:not(#fx) .fx-ar-card a:hover b { color: #c45f00; }

/* List */
.fx-ar-list { padding-top: 64px; padding-bottom: 80px; }
.fx-ar-list__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 24px; }
.fx-ar-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.fx-ar-chip { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border: 2px solid #e6dccf; border-radius: 999px; background: #fff; color: #1e1e1e; font: 700 15px Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif; cursor: pointer; transition: border-color .2s ease; }
.fx-ar-chip i { padding: 2px 8px; border-radius: 999px; background: #f6f1ea; font-size: 12px; font-style: normal; font-weight: 800; }
.fx-ar-chip:hover { border-color: #f08400; }
.fx-ar-chip[aria-pressed="true"] { border-color: #1e1e1e; background: #1e1e1e; color: #fff; }
.fx-ar-chip[aria-pressed="true"] i { background: #f08400; color: #1e1e1e; }
.fx-ar-status { min-height: 1px; margin: 0 0 12px; font-size: 14px; font-weight: 700; color: #6b635b; }
.fx-ar-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin: 0; padding: 0; list-style: none; }
.fx-ar-card[hidden] { display: none; }
.fx-ar-list:not(.is-filtering) .fx-ar-card:first-child { display: none; } /* shown as the featured card above */
html:not(#fx) .fx-ar-card a { display: flex; flex-direction: column; height: 100%; overflow: hidden; border-radius: 22px; background: #fff; color: #1e1e1e; text-decoration: none; box-shadow: 0 2px 0 rgba(0, 0, 0, .04); transition: box-shadow .2s ease; }
html:not(#fx) .fx-ar-card a:hover { box-shadow: 0 0 0 2px #f08400, 0 12px 28px rgba(60, 30, 0, .12); }
.fx-ar-card__img { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #e8e2d9; }
.fx-ar-card__body { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 24px; }
.fx-ar-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.fx-ar-card__meta i { padding: 4px 10px; border-radius: 999px; background: #f6f1ea; color: #1e1e1e; font-size: 12px; font-style: normal; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.fx-ar time { font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #c45f00; }
.fx-ar-card__body b { font-size: 19px; font-weight: 800; line-height: 1.3; transition: color .2s ease; }
.fx-ar-card__lead { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; font-size: 15px; line-height: 1.5; color: #4a443e; }
.fx-ar-none { margin: 24px 0 0; font-size: 17px; font-weight: 700; text-align: center; }
html:not(#fx) .fx-ar-none a { color: #c45f00; }
.fx-ar-moreWrap { margin-top: 36px; text-align: center; }
.fx-ar-more { padding: 16px 30px; border: 0; border-radius: 999px; background: #1e1e1e; color: #fff; font: 800 15px Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; transition: background-color .2s ease; }
.fx-ar-more:hover { background: #333; }

/* Book CTA */
.fx-ar-cta { padding: 60px 0; background: #f08400; }
.fx-ar-cta__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: center; }
.fx-ar-cta p { max-width: 600px; margin: 8px 0 0; font-size: 18px; font-weight: 700; line-height: 1.5; }
html:not(#fx) .fx-ar-btn { display: inline-flex; align-items: center; gap: 10px; padding: 17px 30px; border-radius: 999px; background: #1e1e1e; color: #fff; font-size: 15px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; box-shadow: 0 5px 0 rgba(0, 0, 0, .35); }
html:not(#fx) .fx-ar-btn:hover { background: #333; color: #fff; }

@media (max-width: 991px) {
  html:not(#fx) .fx-ar-feat { grid-template-columns: 1fr; }
  .fx-ar-feat__img { min-height: 0; aspect-ratio: 16 / 9; }
  .fx-ar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fx-ar-cta__inner { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .fx-ar-wrap { padding: 0 16px; }
  .fx-ar-hero { padding: 44px 0 120px; }
  .fx-ar .fx-ar-hero__title { font-size: 34px; }
  .fx-ar-hero__lead { font-size: 16px; }
  .fx-ar-search input { height: 54px; font-size: 16px; }
  .fx-ar-feat-wrap { margin-top: -90px; }
  .fx-ar-feat__body { padding: 22px; }
  .fx-ar-feat__body b { font-size: 22px; }
  .fx-ar .fx-ar-h2 { font-size: 30px; }
  .fx-ar-list { padding-top: 44px; padding-bottom: 56px; }
  .fx-ar-chips { flex-wrap: nowrap; margin: 0 -16px; padding: 0 16px 4px; overflow-x: auto; scrollbar-width: none; }
  .fx-ar-chip { flex: none; }
  .fx-ar-grid { grid-template-columns: 1fr; gap: 12px; }
  /* compact rows on phones: thumbnail left, title and date right */
  html:not(#fx) .fx-ar-card a { flex-direction: row; align-items: center; gap: 14px; padding: 10px; border-radius: 18px; }
  .fx-ar-card__img { flex: none; width: 104px; aspect-ratio: 1; border-radius: 12px; }
  .fx-ar-card__body { gap: 6px; padding: 0; min-width: 0; }
  .fx-ar-card__meta i, .fx-ar-card__lead { display: none; }
  .fx-ar-card__body b { font-size: 15px; }
  .fx-ar time { font-size: 12px; letter-spacing: .04em; }
  .fx-ar-cta { padding: 44px 0 52px; }
  html:not(#fx) .fx-ar-btn { justify-content: center; width: 100%; }
}
