/* LSS.works v5 - Contact page layer. Loaded after styles-v5.css and case-v5.css.
   Every authored px value is an even integer; fonts are 16px so phones do not zoom on focus. */
.contact-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:64px;align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;gap:40px}}
.cform{display:grid;gap:22px;max-width:640px}
.cform-note{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.field{display:grid;gap:8px}
.field label{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.field input[type="text"],.field input[type="email"],.field select,.field textarea{
  width:100%;font:inherit;font-size:16px;line-height:1.5;color:var(--ink);background:var(--surface);
  border:1px solid var(--line-2);border-radius:6px;padding:14px 16px;transition:border-color .18s var(--ease),box-shadow .18s var(--ease)}
.field textarea{min-height:176px;resize:vertical}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:2px solid var(--p-brand);outline-offset:2px;border-color:var(--p-brand)}
.field input:user-invalid,.field select:user-invalid,.field textarea:user-invalid{border-color:var(--p-brand)}
.field-check{display:flex;align-items:flex-start;gap:12px}
.field-check input{width:24px;height:24px;flex:none;margin:0;accent-color:var(--cta-brand)}
.field-check label{font-size:14px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--muted);line-height:1.5;padding-top:2px}
.hp{position:absolute;left:-9999px;width:2px;height:2px;overflow:hidden}
.cform-send{justify-self:start;margin-top:8px;border:0;cursor:pointer;min-height:48px}
.cform-hint{margin:0;font-size:14px;line-height:1.6;color:var(--muted);max-width:56ch}
.cform-status{margin:0;min-height:24px;font-size:15px;line-height:1.6;color:var(--ink)}
.cform-status[data-state="error"]{color:var(--p-brand)}
.cside{padding-top:4px}
.cside p{margin:0 0 14px}
.cside-link{font-size:clamp(18px,2.2vw,24px);font-weight:500;letter-spacing:-.01em;border-bottom:1px solid var(--line-2);padding-bottom:2px;transition:border-color .18s,color .18s}
.cside-link:hover{border-color:var(--p-brand)}
.cside-link:focus-visible{outline:2px solid var(--cta-brand);outline-offset:4px}
@media (prefers-reduced-motion:reduce){.field input,.field select,.field textarea{transition:none}}

/* select: our own chevron, centred and inset, instead of the browser's edge-hugging one */
.field select{appearance:none;-webkit-appearance:none;padding-right:48px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B6B70' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:16px 16px}
:root[data-theme="dark"] .field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A0A0A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}

/* topic dropdown: themed combobox over the native select (contact-v5.js) */
.sel{position:relative}
.sel-ready .sel-native{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.sel-btn{width:100%;display:flex;align-items:center;text-align:left;font:inherit;font-size:16px;line-height:1.5;color:var(--ink);
  background:var(--surface);border:1px solid var(--line-2);border-radius:6px;padding:14px 48px 14px 16px;cursor:pointer;
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B6B70' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:16px 16px}
:root[data-theme="dark"] .sel-btn{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A0A0A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}
.sel-btn:hover{border-color:var(--muted)}
.sel-btn:focus-visible,.sel.is-open .sel-btn{outline:2px solid var(--p-brand);outline-offset:2px;border-color:var(--p-brand)}
.sel-list{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 8px);margin:0;padding:8px;list-style:none;max-height:320px;overflow:auto;
  background:var(--surface);border:1px solid var(--line-2);border-radius:6px;box-shadow:0 16px 40px rgba(0,0,0,.28)}
.sel-list[hidden]{display:none}
.sel-opt{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;border-radius:4px;font-size:16px;line-height:1.5;color:var(--muted);cursor:pointer}
.sel-opt.is-active{background:var(--surface-2);color:var(--ink)}
.sel-opt[aria-selected="true"]{color:var(--ink);font-weight:600}
.sel-check{flex:none;fill:none;stroke:var(--p-brand);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.sel-opt[aria-selected="true"] .sel-check{opacity:1}
@media (prefers-reduced-motion:reduce){.sel-btn{transition:none}}
