/* Fixed Trade-in editorial composition using Content V2 primitives. */
.cd-trade-page figure { margin: 0; min-width: 0; }
.cd-trade-page .cd-trade-hero { grid-template-columns: minmax(0,1fr); gap: var(--cd-space-8); }
.cd-trade-page .cd-trade-hero .cd-content-headline { font-size: calc(var(--cd-font-xl) * 1.5); line-height: var(--cd-line-height-heading); max-width: 18ch; }
.cd-trade-time { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--cd-space-2); }
.cd-trade-time strong { font-size: var(--cd-font-xl); }
.cd-trade-time span, .cd-trade-eyebrow { font-size: var(--cd-font-sm); color: var(--cd-color-muted); }
.cd-trade-trust { display: flex; flex-wrap: wrap; gap: var(--cd-space-2) var(--cd-space-4); list-style: none; padding: 0; margin: var(--cd-space-2) 0 0; font-size: var(--cd-font-sm); }
.cd-trade-trust li { border-inline-start: 1px solid var(--cd-color-border); padding-inline-start: var(--cd-space-2); }
.cd-trade-accepted { box-shadow: var(--cd-shadow-raised-soft); }
.cd-trade-accepted ul { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--cd-space-6); list-style: none; margin: 0 0 var(--cd-space-6); padding: 0; }
.cd-trade-accepted li { display: flex; align-items: center; gap: var(--cd-space-3); min-width: 0; overflow-wrap: anywhere; }
.cd-trade-accepted .cd-content-step-node { flex-shrink: 0; }
.cd-trade-accepted p + p { margin-top: var(--cd-space-3); }
.cd-trade-fork { margin-top: var(--cd-space-8); }
.cd-trade-fork-origin { display: block; text-align: center; font-size: var(--cd-font-sm); color: var(--cd-color-muted); margin-bottom: var(--cd-space-4); }
.cd-trade-fork > div { position: relative; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--cd-space-6); }
.cd-trade-fork > div > div { position: relative; padding: var(--cd-space-4); }
.cd-trade-fork > div > div::before { content: ''; position: absolute; width: 1px; height: var(--cd-space-4); bottom: 100%; left: 50%; background: var(--cd-color-border); }
.cd-trade-fork p { margin-top: var(--cd-space-2); }
.cd-trade-editorial { display: grid; gap: var(--cd-space-8); align-items: center; }
.cd-trade-editorial h2 + p { margin-top: var(--cd-space-3); }
.cd-trade-factors { margin: var(--cd-space-6) 0 0; }
.cd-trade-factors > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: var(--cd-space-4); padding-block: var(--cd-space-3); border-bottom: 1px solid var(--cd-border-soft); }
.cd-trade-factors dt { font-weight: var(--cd-weight-semibold); }
.cd-trade-factors dd { margin: 0; color: var(--cd-color-muted); }
.cd-trade-comparison { box-shadow: var(--cd-shadow-raised-soft); }
.cd-trade-comparison > div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--cd-space-8); }
.cd-trade-comparison > div > div:last-child { border-inline-start: 1px solid var(--cd-color-border); padding-inline-start: var(--cd-space-6); }
.cd-trade-comparison p { margin-top: var(--cd-space-3); }
.cd-trade-comparison > p { margin-top: var(--cd-space-6); }
.cd-trade-estimate { scroll-margin-top: var(--cd-space-8); }
.cd-trade-estimate > header { max-width: var(--cd-container-narrow); margin-bottom: var(--cd-space-6); }
.cd-trade-estimate > header p { margin-top: var(--cd-space-3); }
.cd-trade-estimate .cd-trade-form { max-width: var(--cd-container-narrow); margin-inline: auto; }
@media (min-width: 64.001rem) {
 .cd-trade-page .cd-trade-editorial--photo { grid-template-columns: minmax(0,1fr) minmax(0,1.1fr); }
}
@media (max-width: 64rem) {
 .cd-trade-accepted ul { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 40rem) {
 .cd-trade-page .cd-trade-hero .cd-content-headline { font-size: var(--cd-font-xl); }
 .cd-trade-accepted ul, .cd-trade-fork > div, .cd-trade-comparison > div { grid-template-columns: minmax(0,1fr); gap: var(--cd-space-4); }
 .cd-trade-comparison > div > div:last-child { border-inline-start: 0; border-top: 1px solid var(--cd-color-border); padding-inline-start: 0; padding-top: var(--cd-space-4); }
 .cd-trade-fork-origin { text-align: left; }
 .cd-trade-fork > div > div::before { display: none; }
}

/* One continuous branch, ending at the upper edge of each information surface. */
@media (min-width: 40.001rem) {
 .cd-trade-fork > div::before { content: ''; position: absolute; left: calc(25% - var(--cd-space-6) / 4); right: calc(25% - var(--cd-space-6) / 4); top: calc(-1 * var(--cd-space-4)); height: 1px; background: var(--cd-color-border); }
 .cd-trade-fork-origin { position: relative; margin-bottom: var(--cd-space-6); }
 .cd-trade-fork-origin::after { content: ''; position: absolute; top: 100%; left: 50%; width: 1px; height: var(--cd-space-2); background: var(--cd-color-border); }
}
