/* Contact surfaces use the site's existing CSS, fonts and gold/glass palette. */
.contact-page { --contact-gold: var(--gold, #fbd95e); --contact-light: var(--gold-light, #fff4c8); }
.contact-page h1, .contact-page h2, .contact-email-title { text-wrap: balance; }
.contact-page p, .contact-email-dialog p { text-wrap: pretty; }
.contact-intro .lead { max-width: 680px; }
.contact-main { padding-top: 32px; }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 5vw, 78px); align-items: start; }
.contact-kicker { color: var(--gold-light, #fff4c8); font: 650 10px/1.5 Manrope, Arial, sans-serif; letter-spacing: .16em; text-transform: uppercase; margin: 0 0 15px; }
.contact-page-title { max-width: 760px; }
.contact-channels { display: grid; gap: 0; margin-top: 8px; }
.contact-channel { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; padding: 25px 0; min-height: 95px; border-bottom: 1px solid rgba(255,255,255,.16); }
.contact-channel:first-child { border-top: 1px solid rgba(255,255,255,.16); }
.contact-channel-label { color: #bcb6a9; font: 500 11px/1.5 Manrope, Arial, sans-serif; }
.contact-phone { color: var(--contact-light); font: 600 clamp(21px, 2.3vw, 31px)/1.35 Unbounded, Arial, sans-serif; letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.contact-channel strong { color: #f7f1e5; font-size: 20px; line-height: 1.4; font-weight: 650; }
.contact-channel-note { color: #bcb6a9; font-size: 12px; line-height: 1.55; }
.contact-channel a { display: inline-flex; align-items: center; min-height: 44px; transition: color 150ms ease; }
.contact-messenger-links { display: flex; flex-wrap: wrap; align-items: center; gap: 0 24px; max-width: 100%; }
.contact-profile-links { display: flex; gap: 12px 23px; flex-wrap: wrap; margin-top: 20px; }
.contact-profile-links a { display: inline-flex; align-items: center; min-height: 44px; color: #ede4cf; font-size: 12px; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: rgba(255,244,200,.34); }
.contact-page .contact-profile-links a { font-size: 15px; }
.contact-note { max-width: 480px; margin-top: 21px; color: #bcb6a9; font-size: 13px; line-height: 1.65; }
.contact-draft-card { padding: clamp(25px, 3.2vw, 40px); border-radius: 22px; border: 1px solid rgba(255,255,255,.16); border-top-color: rgba(255,255,255,.3); background: linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.015)), rgba(8,8,8,.45); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: inset 0 1px 0 rgba(255,255,255,.055); }
.contact-draft-card h2 { font-size: clamp(26px, 2.8vw, 37px); line-height: 1.25; }
.contact-draft-card > p:not(.contact-kicker) { color: #c8c1b4; font-size: 14px; line-height: 1.7; margin-top: 20px; }
.contact-brief { margin: 23px 0 28px; padding-left: 19px; color: #e7decb; font-size: 13px; line-height: 1.7; }
.contact-brief li + li { margin-top: 7px; }
.contact-draft-card .button { width: 100%; min-height: 52px; }
.contact-draft-card .contact-draft-footnote { font-size: 11px; line-height: 1.65; color: #bcb6a9; }
.contact-page .contact-faq { max-width: 850px; margin-inline: auto; }
.contact-page .button:active, .contact-email-dialog .button:active { transform: scale(.96); }
.contact-page :focus-visible, .contact-email-dialog :focus-visible { outline: 2px solid #fff4c8; outline-offset: 5px; }
body.contact-dialog-open { overflow: hidden; }
.contact-email-dialog { width: min(610px, calc(100% - 28px)); max-height: calc(100dvh - 28px); margin: auto; padding: 0; color: #f6f2e9; border: 1px solid rgba(255,255,255,.2); border-top-color: rgba(255,255,255,.38); border-radius: 22px; background: rgba(12,11,9,.95); box-shadow: 0 22px 85px rgba(0,0,0,.5); overflow: auto; }
.contact-email-dialog:not([open]) { display: none; }
.contact-email-dialog::backdrop { background: rgba(0,0,0,.72); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.contact-email-panel { position: relative; padding: 36px; opacity: 1; transform: translateY(0); transition: opacity 180ms cubic-bezier(.2,0,0,1), transform 180ms cubic-bezier(.2,0,0,1); }
.contact-email-dialog[data-keyboard-open] .contact-email-panel { transition: none; }
.contact-email-close { position: absolute; top: 11px; right: 11px; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.16); border-radius: 12px; color: #f6f2e9; background: rgba(255,255,255,.035); font-size: 23px; line-height: 1; transition: background 150ms ease, transform 150ms ease; }
.contact-email-close:active { transform: scale(.96); }
.contact-email-title { margin: 0; padding-right: 15px; color: #fff4c8; font: 650 clamp(24px, 3vw, 31px)/1.3 Unbounded, Arial, sans-serif; letter-spacing: -.045em; }
.contact-email-title:focus { outline: none; }
.contact-email-intro { color: #c8c1b4; font-size: 13px; line-height: 1.7; margin: 17px 0 0; }
.contact-email-availability { padding-left: 13px; border-left: 1px solid rgba(251,217,94,.5); color: #e8dcb8; font-size: 12px; line-height: 1.65; margin: 18px 0 23px; overflow-wrap: anywhere; }
.contact-email-form { display: grid; gap: 18px; }
.contact-field { display: grid; gap: 8px; color: #eee6d5; font: 600 12px/1.5 Manrope, Arial, sans-serif; }
.contact-field input, .contact-field textarea { width: 100%; min-width: 0; border: 1px solid rgba(255,255,255,.19); border-radius: 10px; color: #f6f2e9; background: rgba(255,255,255,.035); padding: 13px 14px; font: 450 15px/1.55 Manrope, Arial, sans-serif; caret-color: #fbd95e; transition: border-color 150ms ease; }
.contact-field input { min-height: 48px; }
.contact-field textarea { min-height: 142px; resize: vertical; }
.contact-field input::placeholder, .contact-field textarea::placeholder { color: #a9a397; opacity: 1; }
.contact-field input:focus, .contact-field textarea:focus { border-color: #fbd95e; }
.contact-email-actions { display: flex; flex-wrap: wrap; gap: 11px; }
.contact-email-dialog .button { min-height: 48px; padding: 13px 18px; font-size: 11px; transition: transform 150ms cubic-bezier(.2,0,0,1), background 150ms ease, border-color 150ms ease; }
.contact-email-dialog [hidden] { display: none !important; }
.contact-email-status { color: #e4d7b2; font-size: 12px; line-height: 1.65; margin: 0; }
.contact-email-status:empty { display: none; }
.contact-email-status.is-error { color: #f0c6ae; }
.contact-email-manual { padding: 15px; border: 1px solid rgba(255,255,255,.14); border-radius: 15px; background: rgba(255,255,255,.025); }
.contact-email-manual textarea { font-size: 13px; }
.contact-email-direct { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 23px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.13); }
.contact-email-direct a { display: inline-flex; align-items: center; min-height: 44px; color: #fff4c8; font-size: 12px; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: rgba(255,244,200,.34); font-variant-numeric: tabular-nums; }
.contact-email-privacy { margin-top: 13px; color: #b1aa9d; font-size: 10px; line-height: 1.65; }
.contact-email-copy-buffer { position: fixed; top: 0; left: -10000px; width: 1px; height: 1px; padding: 0; border: 0; }
.contact-email-dialog[data-email-fallback][open] { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; width: 100%; height: 100dvh; max-width: none; max-height: none; padding: 14px; margin: 0; border: 0; border-radius: 0; background: rgba(0,0,0,.8); }
.contact-email-dialog[data-email-fallback] .contact-email-panel { width: min(610px, 100%); max-height: calc(100dvh - 28px); overflow: auto; border: 1px solid rgba(255,255,255,.2); border-radius: 22px; background: #0c0b09; }
@starting-style { .contact-email-dialog[open]:not([data-keyboard-open]) .contact-email-panel { opacity: 0; transform: translateY(6px); } }
@media (hover: hover) and (pointer: fine) { .contact-channel a:hover, .contact-profile-links a:hover, .contact-email-direct a:hover { color: #fbd95e; } .contact-email-close:hover { background: rgba(255,255,255,.09); } }
@media (max-width: 850px) { .contact-layout { grid-template-columns: 1fr; gap: 36px; } .contact-draft-card { max-width: 610px; } }
@media (max-width: 540px) { .contact-main { padding-top: 12px; } .contact-phone { font-size: clamp(20px, 5.9vw, 28px); } .contact-channel { min-height: 88px; padding: 20px 0; } .contact-draft-card { padding: 24px; } .contact-email-panel { padding: 32px 22px 24px; } .contact-email-title { font-size: 24px; padding-right: 20px; } .contact-email-close { top: 8px; right: 8px; } .contact-email-dialog .contact-kicker { padding-right: 35px; } .contact-email-actions { flex-direction: column; } .contact-email-actions .button { width: 100%; } .contact-field input, .contact-field textarea { font-size: 16px; } .contact-email-direct { gap: 4px 20px; } }
@media (prefers-reduced-motion: reduce) { .contact-page .button, .contact-email-panel, .contact-email-dialog .button, .contact-email-close { transition: none !important; transform: none !important; } }