.transaction-page { background: var(--paper); }
.transaction-page .site-header { position: relative; }
.transaction-page section[id] { scroll-margin-top: 24px; }

.transaction-hero { padding: 22px 0 0; }
.transaction-hero-grid { min-height: 590px; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(380px, .68fr); border: 1px solid var(--line); background: var(--white); }
.transaction-hero-copy { padding: 72px 64px; display: flex; flex-direction: column; justify-content: center; }
.transaction-hero-copy h1 { max-width: 920px; margin: 22px 0 28px; color: var(--ink); font-size: clamp(3.4rem, 6vw, 6.6rem); font-weight: 600; letter-spacing: -.06em; line-height: .94; }
.transaction-hero-copy h1 em { color: var(--blue); font-style: normal; }
.transaction-hero-copy > p:not(.eyebrow, .rate-review) { max-width: 760px; color: var(--muted); font-size: 1.16rem; line-height: 1.68; }
.rate-review { margin-top: 20px; color: var(--muted-light); font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
.role-card { padding: 34px 38px; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid var(--line); background: #f8faff; }
.role-card-label { padding-bottom: 24px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .78rem; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; }
.role-card > div { padding: 26px 0; display: grid; grid-template-columns: 38px 1fr; border-bottom: 1px solid var(--line); }
.role-card > div > span { color: var(--blue); font-size: .72rem; font-weight: 700; letter-spacing: .08em; }
.role-card > div p { display: grid; gap: 5px; }
.role-card strong { color: var(--ink); font-size: 1.08rem; font-weight: 600; }
.role-card small { color: var(--muted); font-size: .86rem; }
.role-limit { margin-top: 26px; padding: 17px 18px; border-left: 3px solid var(--green); color: var(--muted); background: var(--white); font-size: .84rem; }
.role-limit strong { color: var(--ink); font-size: inherit; }

.provider-logos { padding: 24px 0 30px; }
.provider-logos-heading { margin-bottom: 13px; display: flex; justify-content: space-between; gap: 24px; color: var(--muted); }
.provider-logos-heading p { color: var(--ink-soft); font-size: .78rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }
.provider-logos-heading small { font-size: .78rem; }
.provider-logo-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.provider-logo-card { min-height: 118px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; border: 1px solid var(--line); color: var(--ink); background: var(--white); text-decoration: none; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.provider-logo-card:hover { border-color: #a8c5ee; box-shadow: 0 12px 28px rgba(32, 75, 135, .08); transform: translateY(-2px); }
.provider-logo-visual { height: 34px; display: flex; align-items: center; }
.provider-logo-visual img { width: auto; max-width: 158px; max-height: 32px; object-fit: contain; object-position: left center; }
.provider-logo-afternic { gap: 10px; }
.provider-logo-afternic img { width: 30px; height: 30px; }
.provider-logo-afternic strong { font-size: 1.45rem; font-weight: 600; letter-spacing: -.035em; }
.provider-logo-rate { padding-top: 12px; display: flex; justify-content: space-between; gap: 12px; align-items: end; border-top: 1px solid var(--line); }
.provider-logo-rate b { color: var(--blue); font-size: 1rem; font-weight: 600; }
.provider-logo-rate small { color: var(--muted); font-size: .72rem; text-align: right; }

.trade-section { padding: 100px 0; }
.trade-heading { display: grid; grid-template-columns: .55fr 1.35fr .85fr; gap: 36px; align-items: end; margin-bottom: 48px; }
.trade-heading h2, .safety-grid h2, .trade-closing h2 { color: var(--ink); font-size: clamp(2.55rem, 4.25vw, 4.25rem); font-weight: 600; letter-spacing: -.048em; line-height: 1.03; }
.trade-heading > p:last-child { color: var(--muted); font-size: 1.02rem; }

.process-list { list-style: none; border-top: 1px solid var(--line-strong); }
.process-list li { min-height: 145px; padding: 28px 10px; display: grid; grid-template-columns: 80px minmax(0, 1fr) 180px; gap: 26px; align-items: center; border-bottom: 1px solid var(--line); }
.process-list li > span { color: var(--blue); font-size: .78rem; font-weight: 700; letter-spacing: .1em; }
.process-list li > div { display: grid; grid-template-columns: minmax(220px, .55fr) minmax(0, 1fr); gap: 30px; align-items: baseline; }
.process-list h3 { color: var(--ink); font-size: 1.35rem; font-weight: 600; }
.process-list p { color: var(--muted); font-size: .95rem; }
.process-list li > small { justify-self: end; padding: 7px 11px; border: 1px solid #bcd0e7; border-radius: 100px; color: var(--blue-dark); background: #eef5ff; font-size: .72rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }

.fees-section { color: var(--ink); background: #0d1730; }
.light-heading h2 { color: var(--white); }
.light-heading > p:last-child { color: #9eabc0; }
.table-scroll-note { display: none; color: #8fa0b9; font-size: .78rem; }
.fee-table-wrap { overflow: hidden; border: 1px solid #34425c; background: #14203a; }
.fee-table { width: 100%; border-collapse: collapse; }
.fee-table th, .fee-table td { padding: 26px 28px; border-right: 1px solid #34425c; border-bottom: 1px solid #34425c; color: #bdc7d8; font-size: .91rem; text-align: left; vertical-align: top; }
.fee-table th:last-child, .fee-table td:last-child { border-right: 0; }
.fee-table tbody tr:last-child th, .fee-table tbody tr:last-child td { border-bottom: 0; }
.fee-table thead th { color: #8fa0b9; background: #101b32; font-size: .7rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.fee-table thead th:nth-child(1) { width: 21%; }
.fee-table thead th:nth-child(2) { width: 21%; }
.fee-table thead th:nth-child(3) { width: 34%; }
.fee-table tbody th strong, .fee-table tbody th span, .fee-table td b, .fee-table td span { display: block; }
.fee-table tbody th strong { color: var(--white); font-size: 1.08rem; font-weight: 600; }
.fee-table tbody th span, .fee-table td span { margin-top: 4px; color: #8392a9; font-size: .78rem; font-weight: 400; }
.fee-table td b { color: #76a9ff; font-size: 1.35rem; font-weight: 600; }
.example-strip { margin-top: 20px; padding: 32px; display: grid; grid-template-columns: .8fr 1.5fr; gap: 24px 45px; align-items: center; border: 1px solid #34425c; background: #14203a; }
.example-strip h3 { margin-top: 7px; color: var(--white); font-size: 1.4rem; font-weight: 600; }
.example-strip dl { display: grid; grid-template-columns: repeat(4, 1fr); }
.example-strip dl div { padding: 5px 22px; border-left: 1px solid #34425c; }
.example-strip dt { color: #8fa0b9; font-size: .75rem; }
.example-strip dd { margin-top: 4px; color: #76a9ff; font-size: 1.35rem; font-weight: 600; }
.example-strip > p { grid-column: 1 / -1; color: #7d8ca4; font-size: .76rem; }

.provider-section { background: #f7f9fc; }
.provider-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.provider-card { padding: 34px; display: flex; flex-direction: column; scroll-margin-top: 24px; border: 1px solid var(--line); background: var(--white); }
.provider-card header { padding-bottom: 26px; display: grid; grid-template-columns: 38px 1fr auto; gap: 14px; align-items: center; border-bottom: 1px solid var(--line); }
.provider-index { color: var(--blue); font-size: .72rem; font-weight: 700; letter-spacing: .08em; }
.provider-card header div { display: grid; }
.provider-card header > .provider-card-title { gap: 5px; min-width: 0; }
.provider-card h3 { color: var(--ink); font-size: 1.48rem; font-weight: 600; }
.provider-card .provider-brand-heading { min-height: 30px; display: flex; align-items: center; }
.provider-card .provider-brand-heading img { width: auto; max-width: 150px; max-height: 28px; object-fit: contain; object-position: left center; }
.provider-card .provider-brand-afternic { gap: 9px; }
.provider-card .provider-brand-afternic img { width: 27px; height: 27px; }
.provider-card .provider-brand-afternic span { font-size: 1.4rem; font-weight: 600; letter-spacing: -.035em; }
.provider-card header p { color: var(--muted); font-size: .8rem; }
.provider-card header > strong { color: var(--blue); font-size: 1.6rem; font-weight: 600; letter-spacing: -.04em; }
.provider-card ol { margin: 26px 0 0 20px; color: var(--muted); }
.provider-card li { padding: 0 0 14px 8px; font-size: .94rem; }
.provider-card li::marker { color: var(--blue); font-weight: 600; }
.provider-card em { color: var(--ink-soft); font-style: normal; font-weight: 600; }
.provider-note { margin-top: auto; padding: 18px; border-left: 3px solid #a8c5ee; color: var(--muted); background: #f5f8fc; font-size: .82rem; }
.source-links { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 16px; }
.source-links a { color: var(--blue-dark); font-size: .82rem; font-weight: 600; text-decoration: none; }
.source-links a:hover { text-decoration: underline; }

.safety-section { padding-top: 0; background: #f7f9fc; }
.safety-grid { padding: 58px 60px; display: grid; grid-template-columns: .76fr 1.24fr; gap: 80px; border: 1px solid #c7d9ef; background: #eaf2ff; }
.safety-grid h2 { margin: 18px 0 22px; }
.safety-grid > div > p:last-child { max-width: 520px; color: var(--muted); font-size: 1.05rem; }
.term-checklist { list-style: none; border-top: 1px solid #c5d8ee; }
.term-checklist li { padding: 18px 0; display: grid; grid-template-columns: 30px 1fr; gap: 12px; border-bottom: 1px solid #c5d8ee; }
.term-checklist li > span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--white); background: var(--blue); font-size: .72rem; }
.term-checklist p { display: grid; gap: 3px; }
.term-checklist strong { color: var(--ink); font-size: .95rem; font-weight: 600; }
.term-checklist small { color: var(--muted); font-size: .82rem; }

.trade-closing { padding: 0 0 80px; background: #f7f9fc; }
.trade-closing-panel { min-height: 320px; padding: 58px 60px; display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; align-items: center; border: 1px solid var(--line); background: var(--white); }
.trade-closing h2 { max-width: 850px; margin: 17px 0; }
.trade-closing p:not(.section-kicker) { max-width: 760px; color: var(--muted); }
.trade-closing-panel > div:last-child { display: grid; gap: 12px; }
.source-disclaimer { padding: 24px 0; border-top: 1px solid var(--line); background: #edf1f6; }
.source-disclaimer p { max-width: 1160px; color: var(--muted); font-size: .77rem; }
.source-disclaimer strong { color: var(--ink-soft); }

@media (max-width: 1180px) {
    .transaction-hero-grid { grid-template-columns: 1fr .74fr; }
    .transaction-hero-copy { padding-inline: 46px; }
    .trade-heading { grid-template-columns: .45fr 1.2fr; }
    .trade-heading > p:last-child { grid-column: 2; }
    .process-list li > div { grid-template-columns: 1fr; gap: 8px; }
    .example-strip { grid-template-columns: 1fr; }
    .example-strip dl { grid-column: 1; }
}

@media (max-width: 920px) {
    .transaction-hero-grid { grid-template-columns: 1fr; }
    .role-card { border-top: 1px solid var(--line); border-left: 0; }
    .provider-logo-grid { grid-template-columns: 1fr 1fr; }
    .trade-section { padding: 80px 0; }
    .process-list li { grid-template-columns: 60px 1fr; }
    .process-list li > small { grid-column: 2; justify-self: start; }
    .table-scroll-note { margin-bottom: 10px; display: block; }
    .fee-table-wrap { overflow-x: auto; }
    .fee-table { min-width: 920px; }
    .provider-grid { grid-template-columns: 1fr; }
    .safety-grid { grid-template-columns: 1fr; gap: 42px; }
    .trade-closing-panel { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
    .transaction-hero { padding-top: 14px; }
    .transaction-hero-copy, .role-card { padding: 38px 24px; }
    .transaction-hero-copy h1 { font-size: clamp(2.75rem, 13vw, 4rem); }
    .transaction-hero-copy > p:not(.eyebrow, .rate-review) { font-size: 1rem; }
    .transaction-hero-copy .hero-actions, .transaction-hero-copy .button { width: 100%; }
    .provider-logos { padding-bottom: 18px; }
    .provider-logos-heading { display: grid; gap: 4px; }
    .provider-logo-grid { grid-template-columns: 1fr; }
    .provider-logo-card { min-height: 104px; }
    .trade-heading { grid-template-columns: 1fr; gap: 16px; }
    .trade-heading > p:last-child { grid-column: auto; }
    .trade-heading h2, .safety-grid h2, .trade-closing h2 { font-size: 2.55rem; }
    .process-list li { padding: 24px 0; grid-template-columns: 42px 1fr; gap: 12px; align-items: start; }
    .process-list li > div { gap: 8px; }
    .process-list h3 { font-size: 1.2rem; }
    .example-strip { padding: 24px; }
    .example-strip dl { grid-template-columns: 1fr 1fr; gap: 22px 0; }
    .example-strip dl div:nth-child(odd) { border-left: 0; }
    .provider-card { padding: 25px; }
    .provider-card header { grid-template-columns: 32px 1fr; }
    .provider-card header > strong { grid-column: 2; font-size: 1.4rem; }
    .safety-grid, .trade-closing-panel { width: 100%; padding: 38px 24px; }
    .trade-closing-panel > div:last-child, .trade-closing-panel .button { width: 100%; }
}