:root {
    --about-ink: #101828;
    --about-muted: #5d6879;
    --about-blue: #2563eb;
    --about-cyan: #38bdf8;
    --about-surface: #f5f8fc;
    --about-line: #e3e9f2;
    --about-radius: 22px;
    --about-shadow: 0 20px 55px rgba(15, 23, 42, .1);
}
html { scroll-behavior: smooth; }
body { color: var(--about-ink); background: #fff; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--about-cyan); outline-offset: 4px; }
.header.headerbg { border-bottom: 1px solid rgba(255, 255, 255, .1); }
.header .wrapper { min-height: 76px; }
.brandlogo img { max-height: 44px; width: auto; }
.menu > ul > li > a { font-weight: 600; }

.about-hero { position: relative; overflow: hidden; isolation: isolate; padding: 170px 0 105px; background: #071126; color: #fff; }
.about-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(5, 13, 32, .98), rgba(5, 13, 32, .74)), url('/images/brokers/about-brokers.jpg') center/cover no-repeat; }
.about-hero::after { content: ""; position: absolute; z-index: -1; width: 520px; height: 520px; right: -160px; bottom: -360px; border-radius: 50%; background: #2563eb; filter: blur(90px); opacity: .42; }
.about-breadcrumbs { display: flex; gap: 9px; margin: 0 0 28px; padding: 0; list-style: none; color: #94a3b8; font-size: .88rem; }
.about-breadcrumbs li + li::before { content: "/"; margin-right: 9px; }
.about-breadcrumbs a { color: #cbd5e1; }
.about-hero__content { max-width: 840px; }
.about-eyebrow { display: inline-block; margin-bottom: 18px; color: #7dd3fc; font-size: .78rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.about-hero h1 { margin-bottom: 22px; color: #fff; font-size: clamp(2.8rem, 6vw, 5.2rem); line-height: 1.02; letter-spacing: -.055em; }
.about-hero h1 span { color: #7dd3fc; }
.about-hero p { max-width: 760px; margin: 0; color: #d7e0ee; font-size: clamp(1.05rem, 2vw, 1.25rem); line-height: 1.75; }
.about-hero__actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 32px; }
.about-btn { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; gap: 9px; padding: 0 23px; border: 1px solid transparent; border-radius: 12px; font-weight: 800; transition: transform .2s ease, box-shadow .2s ease; }
.about-btn:hover { transform: translateY(-2px); }
.about-btn--light { background: #fff; color: #1745a4; box-shadow: 0 13px 30px rgba(0, 0, 0, .2); }
.about-btn--light:hover { color: #1745a4; }
.about-btn--outline { border-color: rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .07); color: #fff; }
.about-btn--outline:hover { color: #fff; }

.about-stats { position: relative; z-index: 2; margin-top: -42px; }
.about-stats__grid { display: grid; grid-template-columns: repeat(6, 1fr); overflow: hidden; border: 1px solid var(--about-line); border-radius: 20px; background: #fff; box-shadow: var(--about-shadow); }
.about-stat { padding: 26px 16px; border-right: 1px solid var(--about-line); text-align: center; }
.about-stat:last-child { border: 0; }
.about-stat strong { display: block; color: var(--about-ink); font-size: 1.7rem; letter-spacing: -.04em; }
.about-stat span { color: var(--about-muted); font-size: .78rem; }

.about-section { padding: 100px 0; }
.about-section--soft { background: var(--about-surface); }
.about-section--dark { background: #071126; color: #d9e2ef; }
.about-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, .86fr); align-items: center; gap: 70px; }
.about-kicker { display: block; margin-bottom: 12px; color: var(--about-blue); font-size: .78rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.about-section--dark .about-kicker { color: #7dd3fc; }
.about-copy h2, .about-heading h2 { margin-bottom: 20px; color: var(--about-ink); font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.12; letter-spacing: -.045em; }
.about-section--dark h2 { color: #fff; }
.about-copy h3 { margin: 30px 0 12px; color: var(--about-ink); font-size: 1.35rem; }
.about-copy p, .about-heading p { color: var(--about-muted); line-height: 1.8; }
.about-section--dark .about-copy p, .about-section--dark .about-heading p { color: #bac7d9; }
.about-copy p + p { margin-top: 15px; }
.about-media { position: relative; }
.about-media img { width: 100%; border-radius: 24px; box-shadow: var(--about-shadow); }
.about-media__label { position: absolute; left: 20px; bottom: 20px; padding: 11px 15px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 12px; background: rgba(7, 17, 38, .87); color: #fff; font-size: .82rem; font-weight: 700; backdrop-filter: blur(10px); }
.about-heading { max-width: 790px; margin: 0 auto 45px; text-align: center; }

.ai-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.ai-card { display: flex; min-height: 100%; flex-direction: column; padding: 30px; border: 1px solid var(--about-line); border-radius: var(--about-radius); background: #fff; box-shadow: 0 9px 30px rgba(15, 23, 42, .06); }
.ai-card--primary { border-color: #93c5fd; background: linear-gradient(145deg, #fff, #eff6ff); box-shadow: 0 14px 38px rgba(37, 99, 235, .14); }
.ai-card__icon { display: grid; width: 52px; height: 52px; margin-bottom: 22px; place-items: center; border-radius: 15px; background: #eaf2ff; color: var(--about-blue); font-size: 1.25rem; }
.ai-card h3 { margin-bottom: 11px; font-size: 1.42rem; }
.ai-card p { color: var(--about-muted); line-height: 1.7; }
.ai-card a { margin-top: auto; padding-top: 21px; color: var(--about-blue); font-weight: 800; }

.xen-list, .value-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 27px 0 0; padding: 0; list-style: none; }
.xen-list li, .value-list li { position: relative; padding: 14px 15px 14px 40px; border: 1px solid rgba(148, 163, 184, .2); border-radius: 12px; background: rgba(255, 255, 255, .05); color: #e1e9f4; font-size: .9rem; }
.xen-list li::before, .value-list li::before { content: "\2713"; position: absolute; left: 15px; color: #67e8f9; font-weight: 900; }

.mission-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.mission-card { padding: 35px; border: 1px solid var(--about-line); border-radius: var(--about-radius); background: #fff; }
.mission-card h3 { margin-bottom: 14px; font-size: 1.5rem; }
.mission-card p { color: var(--about-muted); line-height: 1.8; }
.mission-card p + p { margin-top: 14px; }

.support-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.support-card { padding: 26px; border: 1px solid var(--about-line); border-radius: 18px; background: #fff; }
.support-card i { margin-bottom: 18px; color: var(--about-blue); font-size: 1.5rem; }
.support-card h3 { margin-bottom: 9px; font-size: 1.15rem; }
.support-card p { color: var(--about-muted); font-size: .92rem; line-height: 1.65; }
.support-card a { display: inline-block; margin-top: 14px; color: var(--about-blue); font-weight: 800; }

.about-disclosure { padding: 38px 0; background: #eaf2ff; }
.about-disclosure__inner { display: flex; align-items: flex-start; gap: 18px; max-width: 950px; margin: auto; }
.about-disclosure i { color: var(--about-blue); font-size: 1.4rem; }
.about-disclosure h2 { margin-bottom: 7px; font-size: 1.25rem; }
.about-disclosure p { margin: 0; color: var(--about-muted); line-height: 1.7; }

@media (max-width: 1100px) { .about-stats__grid { grid-template-columns: repeat(3, 1fr); } .about-stat:nth-child(3) { border-right: 0; } .about-stat:nth-child(-n+3) { border-bottom: 1px solid var(--about-line); } .support-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 991px) { .about-grid { grid-template-columns: 1fr; gap: 45px; } .ai-grid { grid-template-columns: 1fr; } .mission-grid { grid-template-columns: 1fr; } }
@media (max-width: 575px) { .about-hero { padding: 140px 0 88px; } .about-hero__actions { flex-direction: column; } .about-btn { width: 100%; } .about-stats { margin-top: -28px; } .about-stats__grid { grid-template-columns: repeat(2, 1fr); } .about-stat, .about-stat:nth-child(3) { border-right: 1px solid var(--about-line); border-bottom: 1px solid var(--about-line); } .about-stat:nth-child(2n) { border-right: 0; } .about-stat:nth-last-child(-n+2) { border-bottom: 0; } .about-section { padding: 75px 0; } .xen-list, .value-list, .support-grid { grid-template-columns: 1fr; } .about-disclosure__inner { display: block; } .about-disclosure i { margin-bottom: 12px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }
