/* FXTalim page component: all styles are scoped to .brokers-page. */
.brokers-page {
    --brokers-page-text: #07224a;
    --brokers-page-muted: #53739c;
    --brokers-page-green: #007d67;
    --brokers-page-green-hover: #006553;
    --brokers-page-green-soft: #e8f4f1;
    --brokers-page-border: #dce7ef;
    --brokers-page-focus: #075dab;
    container: brokers-page / inline-size;
    width: 100%;
    min-width: 0;
    color: var(--brokers-page-text);
    font: 400 14px/1.5 Arial, Helvetica, sans-serif;
    text-align: left;
    isolation: isolate;
}

.brokers-page,
.brokers-page :where(section, div, article, figure, figcaption, h1, h2, h3, p, ul, li, a, span, img, svg):not(:where(.brokers-hero, .brokers-hero *)) { box-sizing: border-box; }
.brokers-page :where(h1, h2, h3, p, ul, figure):not(:where(.brokers-hero, .brokers-hero *)) { margin: 0; }
.brokers-page :where(ul):not(:where(.brokers-hero, .brokers-hero *)) { padding: 0; list-style: none; }
.brokers-page :where(a):not(:where(.brokers-hero, .brokers-hero *)) { text-decoration: none; }
.brokers-page :where(img):not(:where(.brokers-hero, .brokers-hero *)) { border: 0; }

.brokers-page__catalog-title,
.brokers-page__card-title,
.brokers-page__guides-title,
.brokers-page__guide-title { color: var(--brokers-page-text); font-family: inherit; }

.brokers-page__inner { width: 100%; max-width: 1400px; margin-inline: auto; }
.brokers-page__icon { display: block; flex: 0 0 auto; width: 20px; height: 20px; fill: none; stroke: currentColor; }



.brokers-page__catalog { container: brokers-page-catalog / inline-size; min-width: 0; margin-top: 0; scroll-margin-top: 24px; }
.brokers-page__catalog-header { margin-bottom: 20px; }
.brokers-page__catalog-title,
.brokers-page__guides-title { font-size: 24px; font-weight: 700; line-height: 1.3; letter-spacing: -.025em; overflow-wrap: break-word; }
.brokers-page__catalog-description,
.brokers-page__guides-description { max-width: 700px; margin-top: 7px; color: var(--brokers-page-muted); font-size: 13px; line-height: 1.65; }
.brokers-page__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.brokers-page__card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--brokers-page-border); border-radius: 22px; background: #fff; }
.brokers-page__card--featured { border-color: #afcec0; box-shadow: 0 6px 20px rgb(7 34 74 / 3%); }
.brokers-page__card-preview { position: relative; display: flex; flex-direction: column; flex-shrink: 0; justify-content: space-between; gap: 26px; min-width: 0; min-height: 258px; overflow: hidden; padding: 22px; background: #091e33; color: #fff; isolation: isolate; }
.brokers-page__cover-image { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; }
.brokers-page__card-preview::after { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(140deg, rgb(7 27 46 / 91%), rgb(8 30 49 / 55%) 65%, rgb(4 26 40 / 92%)); }
.brokers-page__cover-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.brokers-page__cover-label { color: #cadfe8; font-size: 10px; font-weight: 700; line-height: 1.4; letter-spacing: .1em; }
.brokers-page__cover-label--choice { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; border: 1px solid #bde5d3; border-radius: 20px; padding: 7px 10px; background: var(--brokers-page-green-soft); color: var(--brokers-page-green); font-size: 12px; letter-spacing: 0; }
.brokers-page__cover-label--choice .brokers-page__icon { width: 17px; height: 17px; }
.brokers-page__rank { display: inline-flex; align-items: center; justify-content: center; width: 30px; min-height: 30px; border: 1px solid #447a6c; border-radius: 8px; background: #153e39; color: #a4e7cc; font-size: 12px; font-weight: 700; line-height: 1.4; }
.brokers-page__cover-brand { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 240px; min-height: 80px; margin-inline: auto; border: 1px solid rgb(255 255 255 / 80%); border-radius: 14px; padding: 16px 22px; background: #fff; }
.brokers-page__cover-logo { display: block; width: 100%; max-width: 185px; max-height: 52px; object-fit: contain; }
.brokers-page__brand-text { display: block; max-width: 100%; color: var(--brokers-page-text); font: 700 27px/1.2 Arial, Helvetica, sans-serif; letter-spacing: -.04em; text-align: center; overflow-wrap: anywhere; }
.brokers-page__brand-text--compact { font-size: 23px; }
.brokers-page__cover-caption { color: #c6dce5; font-size: 11px; line-height: 1.6; }
.brokers-page__cover-caption-strong { display: block; margin-bottom: 3px; color: #fff; font-size: 16px; font-weight: 700; line-height: 1.4; }

.brokers-page__card-body { display: flex; flex: 1 1 auto; flex-direction: column; align-items: stretch; min-width: 0; padding: 22px 20px; }
.brokers-page__card-top { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
.brokers-page__logo-box { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 64px; height: 48px; border: 1px solid var(--brokers-page-border); border-radius: 10px; padding: 8px; background: #fff; }
.brokers-page__logo { display: block; width: 100%; max-height: 30px; object-fit: contain; }
.brokers-page__logo-box .brokers-page__brand-text { font-size: 10px; letter-spacing: -.05em; }
.brokers-page__logo-box .brokers-page__brand-text--compact { font-size: 8px; letter-spacing: -.06em; }
.brokers-page__card-heading { min-width: 0; }
.brokers-page__card-title { font-size: 23px; font-weight: 700; line-height: 1.25; letter-spacing: -.025em; overflow-wrap: anywhere; }
.brokers-page__card-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.brokers-page__card-badge { border: 1px solid #dce7ef; border-radius: 6px; padding: 4px 7px; background: #f5f8fa; color: var(--brokers-page-muted); font-size: 10px; line-height: 1.4; }
.brokers-page__card-badge--choice { border-color: #bdddd0; background: var(--brokers-page-green-soft); color: var(--brokers-page-green); font-weight: 700; }
.brokers-page__card-description { margin-top: 16px; color: var(--brokers-page-muted); font-size: 13px; line-height: 1.7; }
.brokers-page__info-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin-top: 18px; }
.brokers-page__info { display: flex; align-items: center; gap: 10px; min-width: 0; border: 1px solid #e1ebf2; border-radius: 10px; padding: 12px; background: #f8fafc; }
.brokers-page__info .brokers-page__icon { width: 19px; height: 19px; color: #267fc2; }
.brokers-page__info-title { display: block; color: var(--brokers-page-text); font-size: 11px; font-weight: 700; line-height: 1.45; }
.brokers-page__info-value { display: block; margin-top: 3px; color: var(--brokers-page-muted); font-size: 10px; line-height: 1.5; }
.brokers-page__card-actions { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.brokers-page__card-link { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; max-width: 100%; border: 1px solid var(--brokers-page-green); border-radius: 11px; padding: 10px 17px; background: var(--brokers-page-green); color: #fff; font-size: 12px; font-weight: 700; line-height: 1.5; text-align: center; transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease; }
.brokers-page__card-link--secondary { border-color: var(--brokers-page-border); background: #fff; color: var(--brokers-page-text); }
.brokers-page__card-link .brokers-page__icon { width: 17px; height: 17px; }

.brokers-page__guides { min-width: 0; margin-top: 36px; scroll-margin-top: 24px; }
.brokers-page__guides-header { margin-bottom: 20px; }
.brokers-page__guide-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.brokers-page__guide-link { display: flex; align-items: center; gap: 14px; min-width: 0; min-height: 106px; border: 1px solid var(--brokers-page-border); border-radius: 16px; padding: 18px; background: #fff; color: var(--brokers-page-text); transition: border-color 160ms ease, background-color 160ms ease; }
.brokers-page__guide-icon { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; background: var(--brokers-page-green-soft); color: var(--brokers-page-green); }
.brokers-page__guide-content { flex: 1 1 auto; min-width: 0; }
.brokers-page__guide-title { font-size: 13px; font-weight: 700; line-height: 1.5; overflow-wrap: break-word; }
.brokers-page__guide-description { margin-top: 4px; color: var(--brokers-page-muted); font-size: 11px; line-height: 1.6; }
.brokers-page__guide-arrow { flex: 0 0 auto; width: 16px; height: 16px; fill: none; stroke: currentColor; color: var(--brokers-page-green); }

.brokers-page a:focus-visible { outline: 3px solid var(--brokers-page-focus); outline-offset: 4px; }
.brokers-page__card-link:active { border-color: #005a4a; background: #005a4a; }
.brokers-page__card-link--secondary:active { border-color: #a8ccc0; background: #dfede8; }
.brokers-page__guide-link:active { border-color: #a8ccc0; background: #edf7f1; }

@media (hover: hover) {
    .brokers-page__card-link:hover { border-color: var(--brokers-page-green-hover); background: var(--brokers-page-green-hover); }
    .brokers-page__card-link--secondary:hover { border-color: #afcfc1; background: #e8f4ee; }
    .brokers-page__guide-link:hover { border-color: #aacdbc; background: #f6fbf8; }
}

@container brokers-page (min-width: 480px) {
    
    .brokers-page__card-preview { min-height: 280px; padding: 28px; }
}

@container brokers-page (min-width: 650px) {
    .brokers-page__guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}



@container brokers-page (min-width: 1120px) {
    .brokers-page__inner {  }
    .brokers-page__catalog-title,
    .brokers-page__guides-title { font-size: 26px; }
    .brokers-page__guide-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .brokers-page__guide-link { min-height: 112px; padding: 20px; }
}

@container brokers-page-catalog (min-width: 520px) {
    .brokers-page__card-body { padding: 26px; }
    .brokers-page__card-title { font-size: 26px; }
    .brokers-page__logo-box { width: 76px; height: 54px; padding: 10px; }
    .brokers-page__info-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .brokers-page__info { display: block; }
    .brokers-page__info .brokers-page__icon { margin-bottom: 8px; }
    .brokers-page__card-actions { flex-direction: row; flex-wrap: wrap; }
}

@container brokers-page-catalog (min-width: 820px) {
    .brokers-page__card { flex-direction: row; }
    .brokers-page__card-preview { width: 34%; max-width: 420px; min-height: 330px; padding: 28px; }
    .brokers-page__card-body { padding: 28px; }
}

@media (prefers-reduced-motion: reduce) {
    .brokers-page__card-link,
    .brokers-page__guide-link { transition: none; }
}
