:root { color-scheme:light; --ink:#152b27; --muted:#53675f; --green:#09674c; --line:#dbe7df; background:#fafbf8; color:var(--ink); font-family:Onest,Arial,sans-serif; }
* { box-sizing:border-box; }
body { margin:0; min-height:100svh; display:flex; flex-direction:column; }
[hidden] { display:none !important; }
::selection { background:#cce6d4; color:#163d2d; }
a { color:var(--green); text-underline-offset:3px; }
a:hover { text-decoration-thickness:2px; }
button,input,textarea { font:inherit; }
input,textarea { caret-color:var(--green); }
:focus-visible { outline:2px solid var(--green); outline-offset:4px; }
.support-header,.support-footer { width:calc(100% - 96px); max-width:1440px; margin:0 auto; }
.support-header { min-height:86px; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:14px; }
.brand { display:inline-flex; align-items:center; gap:10px; color:var(--ink); font-size:25px; font-weight:600; letter-spacing:-.03em; text-decoration:none; }
.support-layout { display:grid; grid-template-columns:minmax(220px,.8fr) minmax(0,1.3fr); gap:80px; width:calc(100% - 96px); max-width:1100px; margin:48px auto 72px; flex:1; align-items:start; }
h1 { font-size:42px; font-weight:600; line-height:1.15; letter-spacing:-.035em; margin:0 0 24px; }
.lead { font-size:17px; line-height:1.65; max-width:31ch; margin:0; }
.support-guidance { border-top:1px solid var(--line); padding-top:24px; margin-top:34px; }
.support-guidance h2 { font-size:15px; font-weight:600; margin:0 0 10px; }
.support-guidance p,.direct-mail { font-size:14px; line-height:1.65; color:var(--muted); margin:0 0 14px; max-width:38ch; }
.direct-mail { margin-top:32px; }.direct-mail a { display:inline-block; margin-top:5px; }
.support-content { background:white; padding:32px; border:1px solid var(--line); border-radius:12px; min-width:0; }
#support-form { display:grid; gap:20px; }
.field { min-width:0; }.field label { display:block; margin-bottom:8px; font-size:14px; font-weight:600; }
.field input,.field textarea { display:block; width:100%; border:1px solid #a8b9af; border-radius:7px; background:#fff; color:var(--ink); padding:11px 12px; font-size:15px; line-height:1.5; }
.field textarea { resize:vertical; min-height:160px; }
.field input::placeholder,.field textarea::placeholder { color:#627269; opacity:1; }
.field input:hover,.field textarea:hover { border-color:#667e70; }
.field input:focus,.field textarea:focus { border-color:var(--green); }
.field-hint { font-size:12px; line-height:1.5; color:var(--muted); margin:8px 0 0; }
.count { text-align:right; font-variant-numeric:tabular-nums; }
.consent { display:flex; gap:10px; align-items:flex-start; font-size:12px; line-height:1.6; color:var(--muted); cursor:pointer; }
.consent input { width:18px; height:18px; flex-shrink:0; margin:1px 0 0; accent-color:var(--green); }
.primary { display:inline-flex; justify-content:center; align-items:center; min-height:46px; padding:12px 20px; border:0; border-radius:8px; background:var(--green); color:white; text-decoration:none; font-size:14px; font-weight:600; cursor:pointer; }
.primary:hover { background:#07513c; }.primary:disabled { opacity:.65; cursor:wait; }
.form-error { font-size:14px; line-height:1.6; margin:0; color:#a32f25; }
.support-success { padding:14px 0; }.support-success svg { fill:#edf6ef; stroke:var(--green); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.support-success h2 { font-size:28px; letter-spacing:-.025em; margin:18px 0 12px; }.support-success p { line-height:1.6; overflow-wrap:anywhere; }
.ticket-number { font-size:14px; margin:4px 0 8px; }.support-success .field-hint { margin-top:32px; }
.text-button { background:none; border:0; color:var(--green); text-decoration:underline; text-underline-offset:3px; font:inherit; font-size:14px; padding:8px 0; cursor:pointer; }
#copy-status { display:block; font-size:12px; color:var(--muted); }.success-actions { margin-top:38px; display:flex; flex-wrap:wrap; gap:20px; align-items:center; }
.support-footer { border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:20px; padding:22px 0; color:var(--muted); font-size:12px; line-height:1.7; }.support-footer nav { display:flex; flex-wrap:wrap; gap:10px 24px; }
@media(max-width:900px) { .support-layout { gap:32px; grid-template-columns:minmax(200px,.8fr) minmax(0,1.3fr); }.support-content { padding:24px; }h1 { font-size:35px; }.support-header,.support-footer,.support-layout { width:calc(100% - 48px); } }
@media(max-width:650px) { .support-header { min-height:72px; }.brand { font-size:22px; }.support-layout { display:flex; flex-direction:column; margin:26px auto 40px; gap:26px; }.support-intro { width:100%; }h1 { font-size:32px; margin-bottom:12px; }h1 br { display:none; }h1 br::after { content:' '; }.lead { max-width:45ch; font-size:15px; }.support-guidance { display:none; }.direct-mail { margin:16px 0 0; font-size:13px; }.direct-mail br { display:none; }.direct-mail a { margin:0 0 0 4px; }.support-content { width:100%; padding:22px 18px; }.field input,.field textarea { font-size:16px; }.support-footer { flex-direction:column; gap:8px; }.support-footer nav { gap:8px 18px; } }
