/* /contact — one intro, one composer. Graphite fields, thin borders, orange only for focus / selection / the send action. */
.ob-contact { display: grid; gap: clamp(48px, 6vw, 72px); }
@media (min-width: 1000px) { .ob-contact { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: clamp(56px, 7vw, 128px); align-items: start; } .ob-cintro { position: sticky; top: 120px; } }
.ob-cintro .ob-lhead__l { margin-bottom: clamp(36px, 5vw, 56px); }
.ob-cintro__k { margin-bottom: 14px !important; }
.ob-cintro__for { margin: 14px 0 0; font-family: var(--ob-font); text-transform: uppercase; font-size: var(--type-label); letter-spacing: .12em; color: var(--t-faint); line-height: 1.6; }
.ob-csec { margin-top: clamp(36px, 5vw, 56px); padding-top: 18px; border-top: 1px solid var(--t-hair); }
.ob-csec .ob-tlab { margin-bottom: 8px; }
.ob-csec p:not(.ob-tlab), .ob-cintro__safe { margin: 0; font-family: var(--font-body-alt, monospace); font-size: var(--type-body-s); line-height: 1.6; color: var(--t-mute); max-width: 46ch; }
.ob-cintro__safe { margin-top: 14px; color: var(--t-faint); }
.ob-csec a, .ob-cprivacy a, .ob-alt a, .ob-handoff a, .ob-cother a { color: var(--t-white); text-decoration: underline; text-decoration-color: var(--t-faint); text-underline-offset: 3px; }
.ob-csec a:hover, .ob-cprivacy a:hover, .ob-alt a:hover, .ob-handoff a:hover, .ob-cother a:hover { color: var(--t-org); text-decoration-color: var(--t-org); }

/* composer */
.ob-cform { display: grid; gap: 26px; padding-top: 6px; }
.ob-cform__src { margin: 0; font-family: var(--ob-font); font-size: var(--type-label); letter-spacing: .14em; color: var(--t-faint); } .ob-cform__src b { font-weight: 400; color: var(--t-white); margin-left: 10px; }
.ob-cf { display: grid; gap: 8px; min-width: 0; border: 0; margin: 0; padding: 0; }
.ob-cf[hidden] { display: none; }
.ob-cf label, .ob-cf legend, .ob-cf__lab { display: flex; justify-content: space-between; gap: 12px; padding: 0; margin: 0 0 2px; font-family: var(--ob-font); text-transform: uppercase; font-size: var(--type-label); letter-spacing: .14em; color: var(--t-white); }
.ob-cf legend { width: 100%; margin-bottom: 10px; }
.ob-cf em { font-style: normal; font-size: var(--type-label); letter-spacing: .12em; color: var(--t-faint); text-align: right; }
.ob-cf input, .ob-cf textarea { width: 100%; box-sizing: border-box; background: #121110; border: 1px solid var(--t-hair2); border-radius: 0; color: var(--t-white); font-family: var(--font-body-alt, monospace); font-size: 16px; line-height: 1.5; padding: 13px 14px; text-transform: none; letter-spacing: 0; transition: border-color .15s; -webkit-appearance: none; appearance: none; }
.ob-cf textarea { min-height: 184px; resize: vertical; }
.ob-cf input::placeholder, .ob-cf textarea::placeholder { color: var(--t-faint); opacity: 1; }
.ob-cf input:hover, .ob-cf textarea:hover { border-color: #4a443d; }
.ob-cf input:focus, .ob-cf textarea:focus { outline: none; border-color: var(--t-org); box-shadow: 0 0 0 1px var(--t-org); }
.ob-cf [aria-invalid="true"] { border-color: #e0584c; }
.ob-cf__hint { margin: 0; font-family: var(--font-body-alt, monospace); font-size: var(--type-body-s); line-height: 1.5; color: var(--t-faint); }
.ob-cf__err { margin: 0; font-family: var(--font-body-alt, monospace); font-size: var(--type-body-s); color: #ff8a7a; } .ob-cf__err::before { content: "! "; font-family: var(--ob-font); }
.ob-cf__count { margin: 0; justify-self: end; font-family: var(--ob-font); font-size: var(--type-label); letter-spacing: .1em; color: var(--t-mute); }
.ob-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ob-chip { position: relative; cursor: var(--cursor-hover); }
.ob-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ob-chip span { display: inline-block; padding: 9px 11px; border: 1px solid var(--t-hair2); font-family: var(--ob-font); font-size: var(--type-label); letter-spacing: .1em; color: var(--t-mute); transition: color .15s, border-color .15s; }
.ob-chip:hover span { color: var(--t-white); border-color: #4a443d; }
.ob-chip input:checked + span { color: var(--t-org); border-color: var(--t-org); }
.ob-chip input:focus-visible + span { outline: 2px solid var(--t-org); outline-offset: 2px; }
.ob-cnote { margin: -10px 0 0; padding-left: 14px; border-left: 1px solid var(--t-org); font-family: var(--font-body-alt, monospace); font-size: var(--type-body-s); line-height: 1.5; color: var(--t-body); }
.ob-reacts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ob-react { display: inline-grid; place-items: center; width: 44px; height: 40px; background: none; border: 1px solid var(--t-hair2); color: var(--t-mute); cursor: var(--cursor-hover); transition: color .15s, border-color .15s; }
.ob-react:hover { color: var(--t-white); border-color: #4a443d; }
.ob-react[aria-pressed="true"] { color: var(--t-org); border-color: var(--t-org); }
.ob-react:focus-visible, .ob-send:focus-visible, .ob-handoff button:focus-visible { outline: 2px solid var(--t-org); outline-offset: 2px; }
.ob-reacts__v { margin-left: 8px; font-family: var(--ob-font); font-size: var(--type-label); letter-spacing: .12em; text-transform: uppercase; color: var(--t-org); }
.ob-hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.ob-cform__go { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; padding-top: 6px; }
.ob-send { display: inline-flex; align-items: center; gap: 12px; padding: 15px 22px; background: var(--t-org); border: 0; color: #0a0a0a; cursor: var(--cursor-hover); font-family: var(--ob-font); font-size: var(--type-body-s); letter-spacing: .12em; transition: background .15s; }
.ob-send i { font-style: normal; transition: transform .2s steps(3); } .ob-send:hover { background: #ff7a24; } .ob-send:hover i { transform: translateX(4px); }
.ob-alt { margin: 0; font-family: var(--font-body-alt, monospace); font-size: var(--type-body-s); color: var(--t-mute); }
.ob-handoff { display: grid; gap: 8px; padding: 16px 0 16px 16px; border-left: 2px solid var(--t-org); outline: none; }
.ob-handoff[hidden] { display: none; }
.ob-handoff p { margin: 0; font-family: var(--font-body-alt, monospace); font-size: var(--type-body-s); line-height: 1.55; color: var(--t-body); } .ob-handoff b { font-weight: 400; color: var(--t-white); }
.ob-handoff .ob-handoff__t { font-family: var(--ob-font); font-size: var(--type-label); letter-spacing: .14em; color: var(--t-org); }
.ob-handoff__alt { color: var(--t-mute) !important; font-size: var(--type-body-s) !important; }
.ob-handoff button { background: none; border: 0; padding: 0; cursor: var(--cursor-hover); font-family: var(--ob-font); font-size: var(--type-label); letter-spacing: .12em; color: var(--t-white); text-decoration: underline; text-underline-offset: 3px; }
.ob-human { margin: 8px 0 0; font-family: var(--font-heading, serif); font-size-adjust: var(--fsa-heading); font-size: clamp(20px, 1.8vw, 24px); line-height: 1.2; color: var(--t-white); }
.ob-cprivacy { margin: -8px 0 0; font-family: var(--font-body-alt, monospace); font-size: var(--type-body-s); line-height: 1.55; color: var(--t-faint); max-width: 56ch; }
.ob-cprivacy a { font-family: var(--ob-font); font-size: var(--type-label); letter-spacing: .12em; }
.ob-cother { display: grid; gap: 0; margin: clamp(72px, 9vw, 128px) 0 0; border-top: 1px solid var(--t-hair); }
.ob-cother > div { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 6px 24px; padding: 16px 0; border-bottom: 1px solid var(--t-hair); }
.ob-cother dt { font-family: var(--ob-font); font-size: var(--type-label); letter-spacing: .14em; color: var(--t-faint); padding-top: 3px; }
.ob-cother dd { margin: 0; font-family: var(--font-body-alt, monospace); font-size: var(--type-body-s); color: var(--t-body); }
@media (max-width: 640px) { .ob-cother > div { grid-template-columns: 1fr; } .ob-send { width: 100%; justify-content: center; } .ob-cf textarea { min-height: 200px; } }