.contact-studio { padding-block: 72px; }
.contact-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(36px, 6%, 88px); align-items: start; }
.contact-intro .eyebrow { color: #b8c9c1; }
.contact-intro h2 { margin: 24px 0 18px; font-size: 58px; line-height: 1.04; letter-spacing: 0; }
.contact-intro > p { max-width: 36ch; line-height: 1.65; color: #d2dfd9; }
.studio-channels { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 28px; }
.studio-channels a { display: inline-flex; align-items: center; gap: 8px; padding-block: 10px; font-size: 14px; border-bottom: 1px solid #688278; }
.studio-channels a:hover, .studio-channels a:focus-visible { color: var(--lime); }
.contact-studio .project-brief { grid-template-columns: minmax(0, 1fr); gap: 28px; border: 0; margin: 0; padding: 0; }
.contact-studio fieldset { min-width: 0; display: block; }
.contact-studio legend, .contact-studio .brief-message > label { font-size: 18px; font-weight: 500; margin: 0 0 14px; padding: 0; }
.brief-index { color: var(--lime); font-size: 12px; margin-right: 9px; vertical-align: middle; font-variant-numeric: tabular-nums; }
.service-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.contact-studio .service-options label { gap: 10px; min-height: 46px; border: 1px solid #567369; border-radius: 5px; padding: 10px 13px; margin: 0; font-size: 14px; line-height: 1.35; }
.contact-studio .service-options input { margin: 0; width: 16px; height: 16px; accent-color: var(--lime); color-scheme: dark; }
.service-options label:hover { background: #193b32; }
.contact-studio .service-options label:has(:checked) { background: #243f32; border-color: var(--lime); }
.service-options label:has(:focus-visible), .contact-studio textarea:focus-visible, .contact-studio button:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.contact-studio .brief-message { gap: 0; }
.contact-studio textarea { background: #132e27; border-color: #567369; min-height: 108px; }
.contact-studio button { align-self: flex-end; gap: 24px; margin-top: 14px; font-weight: 600; }
.contact-studio button:hover { background: #e3ff90; }
@media (max-width: 850px) {
  .contact-studio { padding-block: 44px; }
  .contact-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .contact-intro h2 { font-size: 42px; margin-top: 16px; }
  .studio-channels { margin-top: 12px; }
  .contact-studio .project-brief { border-top: 1px solid #476259; padding-top: 24px; }
}
@media (max-width: 520px) {
  .contact-studio .service-options label { padding: 8px; gap: 7px; }
  .contact-studio button { align-self: stretch; }
}
