/* Contact intake: a sheet of the same paper, laid over a warm dim. */
.contact-card{width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:1px solid #aaa58f;border-radius:24px;background:var(--paper) url('/assets/paper-scan.png') repeat;background-size:760px;background-blend-mode:multiply;color:var(--ink);box-shadow:0 24px 70px #272a2338;overflow:auto;overscroll-behavior:contain}
.contact-card::backdrop{background:#34392c47}
.contact-card[open]{animation:contact-in .26s cubic-bezier(.23,1,.32,1)}
.contact-card[open]::backdrop{animation:contact-dim .26s cubic-bezier(.23,1,.32,1)}
@keyframes contact-in{from{opacity:0;transform:translateY(10px) scale(.98)}}
@keyframes contact-dim{from{opacity:0}}
.contact-form{display:flex;flex-direction:column;gap:18px;padding:22px 28px 26px;font:13px Arial,Helvetica,sans-serif}
.contact-top{display:flex;justify-content:space-between;align-items:center}
.contact-eyebrow{font-size:10px;letter-spacing:1.2px}
.contact-close{width:40px;height:40px;border-radius:50%;border:1px solid #8e997e66;background:transparent;color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
.contact-card h2{margin:0;font-size:clamp(34px,6vw,46px);font-weight:500;letter-spacing:-1.6px;line-height:1}
.contact-lede{margin:-6px 0 0;font-size:14px;line-height:1.55;color:var(--muted)}
.contact-topics{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;border:0}
.contact-topics legend{width:100%;margin-bottom:8px;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.contact-topics label{position:relative}
.contact-topics input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.contact-topics span{display:inline-flex;align-items:center;min-height:36px;padding:8px 13px;border:1px solid #8e997e66;border-radius:22px;font-size:11px;transition:background .15s,border-color .15s}
.contact-topics input:checked+span{background:#d0dcb0;border-color:#6d7d4b66}
.contact-topics input:focus-visible+span{outline:3px solid var(--accent);outline-offset:3px}
.contact-field{display:flex;flex-direction:column;gap:6px}
.contact-field>span{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.contact-field input,.contact-field textarea{width:100%;padding:9px 2px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:15px/1.45 Arial,Helvetica,sans-serif;resize:vertical}
.contact-field input:focus,.contact-field textarea:focus{outline:none;border-bottom-color:var(--ink);box-shadow:0 1px 0 var(--ink)}
.contact-field input:user-invalid,.contact-field textarea:user-invalid{border-bottom-color:var(--accent);box-shadow:0 1px 0 var(--accent)}
.contact-trap{position:absolute;left:-9999px;width:1px;height:1px}
.contact-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:4px}
.contact-send{margin:0;min-height:44px;padding:10px 20px;border:1px solid #6d7d4b66;background:#d7dfb9;color:var(--ink);font:12px Arial,Helvetica,sans-serif;letter-spacing:.6px;cursor:pointer}
.contact-send:disabled{opacity:.6;cursor:progress}
.contact-direct{font-size:11px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.contact-status{min-height:1em;margin:0;font-size:12px;color:var(--muted)}
.contact-status a{text-decoration:underline}
.contact-card.is-sent .contact-topics,.contact-card.is-sent .contact-field,.contact-card.is-sent .contact-actions{display:none}
.contact-card.is-sent .contact-lede{margin:0 0 6px;color:var(--ink);font-size:16px}
@media(hover:hover) and (pointer:fine){.contact-close:hover,.contact-send:hover:not(:disabled){background:#c5d394}.contact-topics label:hover span{border-color:var(--line)}}
@media(max-width:800px){.contact-form{padding:18px 20px 22px;gap:15px}}

/* The contact entry reads as a button at the same weight as ALL WORK. */
.header-right [data-contact]{margin:-10px -4px;padding:10px 18px;border:1px solid #8e997e80;font:700 12px Arial,Helvetica,sans-serif;letter-spacing:.8px}
@media(max-width:800px){.header-right [data-contact]{margin:-8px 0;padding:8px 13px;font-size:10px;letter-spacing:.6px}}
@media(max-width:359px){.header-right [data-contact]{padding:8px 10px;font-size:9px}}

/* Footer switch: the standing way to opt out of, or back into, Google Analytics. */
.analytics-toggle{padding:4px 0;border:0;background:none;color:var(--muted);font:inherit;letter-spacing:inherit;cursor:pointer;text-decoration:underline;text-decoration-color:#8c8d7c80;text-underline-offset:3px}
@media(hover:hover) and (pointer:fine){.analytics-toggle:hover{color:var(--ink)}}