.contact-page{background:#f5f5f6;flex-shrink:0;justify-content:center;align-items:center;min-height:100svh;padding:64px 24px;display:flex}.contact-page[data-template=dark]{background:#0c0d10}.contact-design{width:100%;max-width:880px;font-family:var(--font-geist-sans),Arial,sans-serif;color:#1b1c20;container:hop-contact/inline-size}.contact-design[data-template=minimal],.contact-design[data-template=spotlight]{max-width:560px}.contact-design *,.contact-design :before,.contact-design :after{box-sizing:border-box}.contact-sheet{--contact-ink:#1b1c20;--contact-muted:#676b73;--contact-rule:#e4e5e8;--contact-surface:#fff;--contact-soft:#f6f6f7;border:1px solid var(--contact-rule);background:var(--contact-surface);color:var(--contact-ink);border-radius:24px;overflow:hidden;box-shadow:0 8px 40px #14151a06}.contact-sheet[data-variant=dark]{--contact-ink:#f4f4f6;--contact-muted:#a4a7b0;--contact-rule:#2c2e35;--contact-surface:#16171b;--contact-soft:#1f2026}.contact-banner{background:var(--contact-accent);height:5px}.contact-grid{gap:32px;padding:36px;display:grid}.contact-identity{min-width:0}.contact-avatar{object-fit:cover;border:1px solid var(--contact-rule);background:var(--contact-soft);border-radius:24px;width:96px;height:96px;display:block}.contact-monogram{color:var(--contact-ink);letter-spacing:-.04em;place-items:center;font-size:30px;font-weight:500;display:grid}.contact-design h1{color:var(--contact-ink);letter-spacing:-.045em;overflow-wrap:anywhere;text-wrap:balance;margin:26px 0 0;font-family:inherit;font-size:36px;font-weight:600;line-height:1.12}.contact-title{letter-spacing:-.015em;color:var(--contact-ink);margin:14px 0 0;font-size:15px;line-height:1.5}.contact-organization{color:var(--contact-muted);margin:4px 0 0;font-size:14px;line-height:1.6}.contact-location{color:var(--contact-muted);align-items:flex-start;gap:7px;margin:16px 0 0;font-size:12px;line-height:1.5;display:flex}.contact-location svg{flex-shrink:0;width:15px;height:18px}.contact-note{color:var(--contact-muted);white-space:pre-line;margin:24px 0 0;font-size:14px;line-height:1.7}.contact-design p{overflow-wrap:anywhere}.contact-socials{color:var(--contact-muted);flex-wrap:wrap;gap:6px;margin-top:22px;display:flex}.contact-socials a{border:1px solid var(--contact-rule);border-radius:12px;place-items:center;width:44px;min-height:44px;display:grid}.contact-content{flex-direction:column;gap:28px;min-width:0;display:flex}.contact-save{background:var(--contact-accent);min-height:52px;color:var(--contact-on-accent);letter-spacing:-.015em;border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:14px 20px;font-size:14px;font-weight:600;display:flex}.contact-save svg{flex-shrink:0;width:19px;height:19px}.contact-save-block p{text-align:center;color:var(--contact-muted);margin:10px 0 0;font-size:11px;line-height:1.5}.contact-details h2{color:var(--contact-muted);letter-spacing:0;margin:0 0 10px;font-family:inherit;font-size:12px;font-weight:500}.contact-detail{border-bottom:1px solid var(--contact-rule);align-items:center;gap:12px;min-height:72px;padding:14px 0;display:flex}.contact-detail:last-child{border-bottom:0}.contact-detail-icon{border:1px solid var(--contact-rule);width:36px;height:36px;color:var(--contact-muted);border-radius:10px;flex-shrink:0;place-items:center;display:grid}.contact-detail-icon svg{width:17px;height:17px}.contact-detail-text{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.contact-detail-label{color:var(--contact-muted);font-size:11px}.contact-detail-value{color:var(--contact-ink);overflow-wrap:anywhere;font-size:13px;line-height:1.5}.contact-detail>svg,.contact-related svg{width:18px;height:18px;color:var(--contact-muted);flex-shrink:0}.contact-related{border-top:1px solid var(--contact-rule);flex-direction:column;padding-top:12px;display:flex}.contact-related a{min-height:48px;color:var(--contact-ink);justify-content:space-between;align-items:center;gap:12px;padding:12px 0;font-size:13px;font-weight:500;display:flex}.contact-design a{text-decoration:none;transition:background-color .15s,opacity .15s}.contact-design a:focus-visible{outline:2px solid var(--contact-ink);outline-offset:4px}.contact-detail:hover,.contact-related a:hover,.contact-socials a:hover{background:var(--contact-soft)}.contact-save:hover{opacity:.9}.contact-sheet[data-variant=minimal]{box-shadow:none;border-radius:20px}.contact-sheet[data-variant=minimal] .contact-banner,.contact-sheet[data-variant=spotlight] .contact-banner{display:none}.contact-sheet[data-variant=minimal] .contact-avatar{border-radius:50%;width:80px;height:80px}.contact-sheet[data-variant=minimal] .contact-save{background:var(--contact-ink);color:var(--contact-surface)}.contact-sheet[data-variant=gradient] .contact-banner{background:linear-gradient(115deg,var(--contact-accent),color-mix(in srgb,var(--contact-accent) 12%,white));height:88px}.contact-sheet[data-variant=gradient] .contact-avatar{border:5px solid var(--contact-surface);margin-top:-68px;position:relative}.contact-sheet[data-variant=spotlight]{box-shadow:none;background:0 0;border:none}.contact-sheet[data-variant=spotlight] .contact-identity{text-align:center}.contact-sheet[data-variant=spotlight] .contact-avatar{width:112px;height:112px;box-shadow:0 0 0 5px var(--contact-surface),0 0 0 6px var(--contact-rule);border-radius:50%;margin:0 auto}.contact-sheet[data-variant=spotlight] :is(.contact-socials,.contact-location){justify-content:center}@container hop-contact (min-width:700px){.contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;padding:48px}.contact-content{border-left:1px solid var(--contact-rule);padding-left:40px}.contact-design h1{font-size:40px}.contact-sheet[data-variant=gradient] .contact-avatar{margin-top:-80px}}@container hop-contact (max-width:380px){.contact-grid{gap:28px;padding:26px 22px}.contact-design h1{font-size:30px}.contact-avatar{border-radius:20px;width:80px;height:80px}.contact-detail{gap:10px}.contact-detail-icon{width:30px;height:34px}}@media (max-width:600px){.contact-page{align-items:flex-start;padding:24px 14px}}@media (prefers-reduced-motion:reduce){.contact-design *,.contact-design :before,.contact-design :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
