/* The contact desk uses the same reading rails as About, not a boxed dashboard. */
.contact-editorial { --contact-error: #ff6b8a; --contact-success: #b7f58b; --contact-gap: clamp(2rem, 6vw, 7rem); padding: var(--s13-section-hero-inset) var(--s13-gutter) clamp(4rem, 7vw, 7rem); color: var(--s13-reading); font: 400 clamp(1.02rem, 1.18vw, 1.16rem)/1.72 var(--s13-body); }
.contact-editorial :is(h1,h2,p) { margin: 0; }
.contact-editorial :is(header,section,div,label) { min-width: 0; }
.contact-editorial :is(h1,h2) { color: var(--s13-ink); font-family: var(--s13-display); font-weight: var(--s13-display-weight); letter-spacing: var(--s13-display-tracking); text-transform: uppercase; }
.contact-label { display: block; color: var(--s13-muted); font: 400 var(--s13-type-meta)/1.5 var(--s13-body); letter-spacing: .12em; text-transform: uppercase; }
.contact-editorial-hero { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); align-items: end; gap: 1.8rem var(--contact-gap); padding-bottom: clamp(2.5rem,5vw,5rem); border-bottom: 1px solid var(--s13-line); }
.contact-editorial-hero > .contact-label { grid-column: 1 / -1; }
.contact-editorial-hero h1 { font-size: var(--s13-section-title-size); line-height: 1; }
.contact-editorial-hero > p { max-width: 38ch; padding-bottom: .2rem; color: var(--s13-secondary); font-size: clamp(1.1rem,1.55vw,1.38rem); line-height: 1.5; }
.contact-editorial-body { display: grid; grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr); gap: var(--contact-gap); padding-top: clamp(3.5rem,6vw,6.5rem); }
.contact-editorial-guide h2 { max-width: 100%; margin: 0 0 1.5rem; font-size: clamp(2rem,3.1vw,3.45rem); line-height: 1.08; text-wrap: balance; }
.contact-editorial-guide > p { max-width: 36ch; }
.contact-editorial-guide > p + p { margin-top: 1.25em; }
.contact-editorial-guide > .contact-promo-link { margin-top: 1.35rem; }
.contact-editorial-guide .contact-field-note { margin-top: 2rem; color: var(--s13-muted); font-size: .78rem; line-height: 1.6; }
.contact-message-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.75rem 2rem; }
.contact-field { display: flex; flex-direction: column; gap: .55rem; }
.contact-field--wide { grid-column: 1 / -1; }
.contact-field > span:first-child { display: flex; justify-content: space-between; align-items: baseline; gap: .75rem; color: var(--s13-secondary); font: 500 .65rem/1.5 var(--s13-body); letter-spacing: .1em; text-transform: uppercase; }
.contact-field > span > small { color: var(--s13-muted); font: inherit; letter-spacing: .03em; text-transform: none; }
.contact-field :is(input,select,textarea) { display: block; width: 100%; min-width: 0; min-height: 48px; padding: .6rem .25rem; border: 0; border-bottom: 1px solid var(--s13-field-line); border-radius: 0; background: var(--s13-bg); color: var(--s13-ink); font: 400 max(16px,1rem)/1.5 var(--s13-body); color-scheme: dark; outline: 0; transition: border-color .2s ease; }
.contact-field :is(input,select,textarea):hover { border-bottom-color: var(--s13-muted); }
.contact-field :is(input,select,textarea):focus-visible { border-bottom-color: var(--s13-ink); box-shadow: 0 1px 0 var(--s13-ink); }
.contact-field :is(input,textarea)::placeholder { color: var(--s13-muted); opacity: 1; }
.contact-field, .contact-field :is(input,select,textarea,.s13-select-trigger) { scroll-margin-top: calc(var(--s13-header-row) + 1.5rem); scroll-margin-bottom: calc(var(--s13-listening-obstruction, 0px) + 1.5rem); }
.contact-field textarea { min-height: 12rem; resize: vertical; }
.contact-select-wrap { position: relative; display: block; }
.contact-select-wrap select { appearance: none; padding-right: 2rem; cursor: pointer; }
.contact-select-wrap::after { position: absolute; right: .35rem; top: 1.1rem; width: .45rem; height: .45rem; border-right: 1px solid var(--s13-secondary); border-bottom: 1px solid var(--s13-secondary); transform: rotate(45deg); content: ''; pointer-events: none; }
.contact-input-error { color: var(--contact-error); font: 400 .72rem/1.55 var(--s13-body); }
.contact-field :is(input,select,textarea)[aria-invalid="true"] { border-bottom-color: var(--contact-error); }
.contact-field :is(input,select,textarea)[aria-invalid="true"]:focus-visible { box-shadow: 0 1px 0 var(--contact-error); }
.contact-editorial .s13-select-trigger[aria-invalid="true"] { border-bottom-color: var(--contact-error); }
.contact-editorial .s13-select-trigger[aria-invalid="true"]:focus-visible { box-shadow: 0 1px 0 var(--contact-error); }
.contact-editorial .s13-select-error { color: var(--contact-error); }
.contact-field .contact-input-note { color: var(--s13-muted); font: 400 .72rem/1.55 var(--s13-body); }
.contact-field .contact-message-meta { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; }
.contact-message-meta .contact-input-note { min-width: 0; }
.contact-message-count { flex: 0 0 auto; margin-left: auto; color: var(--s13-muted); font: 400 .72rem/1.55 var(--s13-body); font-variant-numeric: tabular-nums; white-space: nowrap; }
.contact-letter-consent { display: flex; align-items: flex-start; gap: .75rem; cursor: pointer; color: var(--s13-secondary); font: 400 .78rem/1.6 var(--s13-body); }
.contact-letter-consent input { flex: 0 0 18px; width: 18px; height: 18px; margin: .15rem 0 0; accent-color: var(--s13-ink); color-scheme: dark; cursor: pointer; }
.contact-letter-consent input:focus-visible { outline: 1px solid var(--s13-ink); outline-offset: 4px; }
.contact-letter > p { margin: .4rem 0 0 1.875rem; color: var(--s13-muted); font: 400 .72rem/1.6 var(--s13-body); }
.contact-editorial-submit { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 1rem 2rem; padding-top: .25rem; }
.contact-editorial-submit p { flex: 1 1 auto; min-width: 0; max-width: none; color: var(--s13-muted); font-size: .72rem; line-height: 1.6; }
.contact-editorial-submit p a { color: inherit; text-decoration: underline; text-decoration-color: var(--s13-field-line); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.contact-editorial-submit p a:is(:hover,:focus-visible) { color: var(--s13-ink); text-decoration-color: currentColor; }
.contact-editorial-submit p a:focus-visible { outline: 1px solid currentColor; outline-offset: 3px; }
.contact-editorial-submit .s13-action-button { flex-shrink: 0; }
.contact-form-notice { margin: 0; padding: 1rem 0; border-block: 1px solid var(--s13-field-line); scroll-margin-top: calc(var(--s13-header-row) + 1.5rem); scroll-margin-bottom: calc(var(--s13-listening-obstruction, 0px) + 1.5rem); }
.contact-form-notice strong { display: block; color: var(--s13-ink); font: 600 .85rem/1.5 var(--s13-body); }
.contact-form-notice p { max-width: 60ch; margin-top: .5rem; color: var(--s13-secondary); font-size: .92rem; }
.contact-form-notice:focus { outline: none; }
.contact-form-notice[data-contact-success="true"] { border-color: var(--contact-success); }
.contact-form-notice[data-contact-success="true"] :is(strong,p) { color: var(--contact-success); }
.contact-form-notice[data-contact-error="true"] { border-color: var(--contact-error); }
.contact-form-notice[data-contact-error="true"] :is(strong,p) { color: var(--contact-error); }
@media(max-width:840px) {
  .contact-editorial-hero { grid-template-columns: 1fr; align-items: start; gap: 1.2rem; }
  .contact-editorial-hero > p { max-width: 48ch; margin-top: .5rem; }
  .contact-editorial-body { grid-template-columns: 1fr; gap: 2.5rem; }
  .contact-editorial-guide > p { max-width: 60ch; }
  .contact-editorial-guide h2 { max-width: none; font-size: clamp(1.85rem,5vw,2.6rem); }
  .contact-editorial-guide .contact-field-note { margin-top: 1.25rem; }
}
@media(max-width:620px) {
  .contact-editorial-guide > .contact-promo-link { width: 100%; justify-content: space-between; }
  .contact-message-form { grid-template-columns: 1fr; gap: 1.5rem; }
  .contact-editorial-submit { align-items: stretch; flex-direction: column; }
  .contact-editorial-submit button { width: 100%; }
}
@media(prefers-reduced-motion:reduce) { .contact-field :is(input,select,textarea), .contact-editorial-submit button { transition: none; } }

/* Invisible verification reserves no grid row; a requested checkbox enters the form flow. */
.contact-message-form { position: relative; }
.contact-message-form > .s13-newsletter-challenge { grid-column: 1 / -1; }
.contact-message-form > .s13-newsletter-challenge:not([data-s13-challenge-active]) { position: absolute; inset-inline: 0; height: 0; overflow: hidden; }