/* Free short list form. Lives inside .contact sections (dark panel in light
   mode, surface panel in dark mode), so colours come from local --c-* vars. */
.contact{--c-fg:var(--ground);--c-dim:color-mix(in srgb,var(--ground) 72%,transparent);--c-field:color-mix(in srgb,var(--ground) 7%,transparent);--c-line:color-mix(in srgb,var(--ground) 34%,transparent);--c-line-hi:color-mix(in srgb,var(--ground) 70%,transparent);--c-bad:#FFB4A2}
:root[data-theme="dark"] .contact{--c-fg:var(--ink);--c-dim:var(--muted);--c-field:var(--ground);--c-line:var(--rule);--c-line-hi:var(--muted);--c-bad:#FF9F87}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .contact{--c-fg:var(--ink);--c-dim:var(--muted);--c-field:var(--ground);--c-line:var(--rule);--c-line-hi:var(--muted);--c-bad:#FF9F87}}

.sl-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:36px 48px;align-items:start;margin-top:6px}
.sl-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;color:var(--c-fg)}
.sl-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.sl-field.full{grid-column:1 / -1}
.sl-field label,.sl-field .sl-lab{font:500 .72rem/1.2 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase;color:var(--c-fg);display:flex;justify-content:space-between;gap:10px}
.sl-field .opt{color:var(--c-dim);letter-spacing:.04em;text-transform:none}
.sl-form input,.sl-form select,.sl-form textarea{width:100%;font:400 1rem/1.4 "Public Sans",system-ui,sans-serif;color:var(--c-fg);background:var(--c-field);border:1px solid var(--c-line);border-radius:3px;padding:12px 13px;min-height:48px;transition:border-color .15s,box-shadow .15s}
.sl-form textarea{min-height:84px;resize:vertical}
.sl-form select{appearance:none;-webkit-appearance:none;padding-right:38px;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 19px) 52%,calc(100% - 14px) 52%;background-size:5px 5px;background-repeat:no-repeat}
.sl-form select option{color:#13231D;background:#FBFCFA}
.sl-form ::placeholder{color:var(--c-dim);opacity:.85}
.sl-form input:hover,.sl-form select:hover,.sl-form textarea:hover{border-color:var(--c-line-hi)}
.sl-form input:focus,.sl-form select:focus,.sl-form textarea:focus{outline:none;border-color:var(--mark);box-shadow:0 0 0 3px color-mix(in srgb,var(--mark) 40%,transparent)}
.sl-form [aria-invalid="true"]{border-color:var(--c-bad)}
.sl-err{font-size:.84rem;color:var(--c-bad);min-height:0}
.sl-err:empty{display:none}
.sl-count{font:400 .75rem "IBM Plex Mono",ui-monospace,monospace;color:var(--c-dim);font-variant-numeric:tabular-nums;letter-spacing:0;text-transform:none}
.sl-count.near{color:var(--mark)}

.sl-more{grid-column:1 / -1;border-top:1px dashed var(--c-line);padding-top:14px}
.sl-more summary{cursor:pointer;list-style:none;font-size:.95rem;color:var(--c-fg);display:inline-flex;gap:8px;align-items:center}
.sl-more summary::-webkit-details-marker{display:none}
.sl-more summary::before{content:"+";font-family:"IBM Plex Mono",monospace;color:var(--mark)}
.sl-more[open] summary::before{content:"\2212"}
.sl-more summary:focus-visible{outline:3px solid var(--mark);outline-offset:3px}
.sl-more .sl-more-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;margin-top:16px}

.sl-form[hidden]{display:none}
.sl-hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}

.sl-actions{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-top:4px}
.sl-submit{background:var(--mark);color:var(--mark-ink);border:0;border-radius:3px;font:600 1.02rem "Public Sans",system-ui,sans-serif;padding:14px 24px;min-height:50px;cursor:pointer;display:inline-flex;align-items:center;gap:10px}
.sl-submit:hover{filter:brightness(1.07)}
.sl-submit:focus-visible{outline:3px solid var(--c-fg);outline-offset:3px}
.sl-submit[disabled]{cursor:progress;opacity:.75}
.sl-submit .spin{width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;display:none;animation:sl-spin .7s linear infinite}
.sl-submit[disabled] .spin{display:inline-block}
@keyframes sl-spin{to{transform:rotate(1turn)}}
@media (prefers-reduced-motion: reduce){.sl-submit .spin{animation:none}}
.sl-fine{font-size:.86rem;color:var(--c-dim);max-width:44ch}
.sl-fine a{color:var(--mark)}

.sl-alert{grid-column:1 / -1;border:1px solid var(--c-bad);border-left-width:4px;padding:12px 14px;font-size:.95rem;color:var(--c-fg)}
.sl-alert a{color:var(--mark)}
.sl-alert[hidden]{display:none}

.sl-done{border:1px solid var(--c-line);border-left:4px solid var(--mark);padding:24px 24px 22px;display:flex;flex-direction:column;gap:12px;color:var(--c-fg)}
.sl-done[hidden]{display:none}
.sl-done h3{font-size:1.4rem;color:var(--c-fg)}
.sl-done p{color:var(--c-fg);opacity:.92}
.sl-done:focus{outline:none}

.sl-next{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;border-top:1px solid var(--c-line)}
.sl-next li{display:grid;grid-template-columns:2.2em minmax(0,1fr);gap:4px 10px;padding:14px 0;border-bottom:1px dashed var(--c-line);color:var(--c-fg);font-size:.95rem;line-height:1.5}
.sl-next li b{display:block;font-weight:600}
.sl-next li span.d{color:var(--c-dim)}
.sl-next .k{font:500 .78rem "IBM Plex Mono",ui-monospace,monospace;color:var(--mark-ink);background:var(--mark);width:1.9em;height:1.9em;border-radius:50%;display:grid;place-items:center;margin-top:1px}
.sl-aside{display:flex;flex-direction:column;gap:14px}
.sl-aside .label{color:var(--c-dim)}
.sl-aside .sl-direct{font-size:.9rem;color:var(--c-dim)}
.sl-aside .sl-direct a{color:var(--mark);overflow-wrap:anywhere}

@media (max-width:820px){
  .sl-layout{grid-template-columns:minmax(0,1fr)}

}
@media (max-width:560px){
  .sl-form,.sl-more .sl-more-body{grid-template-columns:minmax(0,1fr)}
  .sl-submit{width:100%;justify-content:center}
  .contact{padding:30px 20px}
}
