/* Color compatibility for editorial sections. The shared surface stylesheet
   owns the palette and section backgrounds; content keeps its local contrast. */

.ed-page-content [data-surface]{color:var(--ink)}
.ed-page-content [data-surface] :is(h1,h2,h3,strong){color:var(--ink)}
.ed-page-content [data-surface] :is(.ed-lead,.ed-body-copy,.ed-caption,.ed-tech-summary,.ed-form-intro,.ed-form-note){color:var(--muted)}
.ed-page-content [data-surface] .text-link{color:var(--ink);border-color:var(--ink)}
.ed-page-content [data-surface] .button.primary{background:var(--brand-red,#b9231b);border-color:var(--brand-red,#b9231b);color:#fff}
.ed-page-content [data-surface] .button.primary:hover{background:var(--brand-red-hover,#941c16);border-color:var(--brand-red-hover,#941c16)}

/* Preserve readable labels, dividers and links against graphite panels. */
.ed-page-content [data-surface="graphite"] :is(.eyebrow,.ed-index,.section-side,.ed-values article>span){color:var(--ink)}
.ed-page-content [data-surface="graphite"] :is(.ed-row p,.ed-values p,.ed-question-list p,.ed-oem-grid p,.ed-notebook p){color:var(--muted)}
.ed-page-content [data-surface="graphite"] :is(.ed-row,.ed-values article,.ed-question-list li,.ed-oem-grid article,.ed-related .text-link){border-color:var(--line)}
.ed-page-content [data-surface="graphite"] .text-link:hover{color:#fff;border-color:#fff}
.ed-page-content [data-surface="graphite"] .text-link:focus-visible{outline-color:#fff}
.ed-page-content .ed-film-figure[data-surface="graphite"] figcaption{color:var(--muted)}
.ed-page-content .ed-film-figure[data-surface="graphite"] .ed-film-still{background:var(--soft)}

/* The closing section has a red surface and a white, clearly bounded CTA. */
.ed-page-content .ed-closing[data-surface="red"]{border-top-color:transparent}
.ed-page-content .ed-closing[data-surface="red"] :is(.section-side,h2){color:var(--ink)}
.ed-page-content .ed-closing[data-surface="red"] p:not(.section-side){color:var(--muted)}
.ed-page-content .ed-closing[data-surface="red"] .button.primary{background:#fff;border-color:#fff;color:var(--brand-red,#b9231b)}
.ed-page-content .ed-closing[data-surface="red"] .button.primary:hover{background:#f1f2f2;border-color:#f1f2f2;color:var(--brand-red,#b9231b)}
.ed-page-content .ed-closing[data-surface="red"] .button.primary:focus-visible{outline-color:#fff}

/* Contact fields always sit on the explicit white section, independent of
   the animated page background. Existing form names and behavior are kept. */
.ed-page-content .ed-contact-layout[data-surface="white"]{color-scheme:light}
.ed-contact-layout[data-surface="white"] :is(.ed-contact-aside,.ed-contact-form-area){color:var(--ink)}
.ed-contact-layout[data-surface="white"] .ed-contact-form :is(input,select,textarea){background:#fff;color:var(--ink);border-color:var(--line)}
.ed-contact-layout[data-surface="white"] .ed-contact-form :is(input,textarea)::placeholder{color:var(--muted);opacity:1}
.ed-contact-layout[data-surface="white"] .ed-contact-form :is(input,select,textarea):focus{outline-color:var(--brand-red,#b9231b)}
.ed-contact-layout[data-surface="white"] :is(.ed-contact-form label>span,.ed-form-status,.ed-copy-status){color:var(--brand-red,#b9231b)}
.ed-contact-layout[data-surface="white"] .ed-contact-aside dd>a{color:var(--brand-red,#b9231b)}
.ed-service-nav[data-surface="white"] .ed-service-number{color:var(--brand-red,#b9231b)}
.ed-service-nav[data-surface="white"]>a:hover,.ed-service-nav[data-surface="white"]>a:hover .ed-service-arrow{color:var(--brand-red,#b9231b)}