.contact { padding: clamp(80px, 14vh, 160px) var(--g); max-width: 1200px; margin: 0 auto; }
.contact__title { margin: 12px 0 clamp(28px, 5vh, 56px); }
.contact__form { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 24px; }
.contact__form label { display: grid; gap: 8px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: #8d847d; font-family: var(--mono); }
.contact__form input, .contact__form select, .contact__form textarea { width: 100%; font: 400 18px/1.4 var(--sans); letter-spacing: 0; text-transform: none; color: #ece8e1; background: #0e0f12; border: 1px solid #2a2523; border-radius: 0; padding: 14px 16px; min-height: 48px; transition: border-color .2s, background .2s; }
.contact__form textarea { resize: vertical; min-height: 140px; }
.contact__form input:focus, .contact__form select:focus, .contact__form textarea:focus { outline: none; border-color: var(--accent); background: #131216; box-shadow: 0 0 0 3px rgba(255,106,31,.2); }
.contact__form select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--accent) 50%), linear-gradient(135deg, var(--accent) 50%, transparent 50%); background-position: calc(100% - 20px) 55%, calc(100% - 14px) 55%; background-size: 6px 6px; background-repeat: no-repeat; padding-inline-end: 40px; }
.contact__wide, .contact__row { grid-column: 1 / -1; }
.contact__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.contact__row { display: flex; align-items: center; gap: 20px 28px; flex-wrap: wrap; }
.contact__send { display: inline-flex; align-items: center; gap: 12px; min-height: 52px; padding: 0 30px; border: 0; cursor: pointer; background: var(--accent); color: #130c08; font: 700 12px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; transition: transform .25s var(--ease), background .2s; }
.contact__send:hover { background: #ffb07a; transform: translateY(-2px); }
.contact__send:disabled { opacity: .55; cursor: progress; transform: none; }
.contact__status { margin: 0; font-size: 15px; color: #beb5af; }
.contact__status.is-ok { color: #7fe3a0; }
.contact__status.is-err { color: #ffb07a; }
.contact__status a { color: var(--accent); text-decoration: underline; }
@media (max-width: 700px) { .contact__form { grid-template-columns: 1fr; } .contact__send { width: 100%; justify-content: center; } }

/* ---- Sound toggle (in the HUD) ---- */
.snd { display: inline-flex; align-items: center; gap: 9px; min-height: 40px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; background: rgba(12,12,14,.6); color: #beb5af; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; backdrop-filter: blur(8px); transition: border-color .2s, color .2s; }
.snd:hover, .snd:focus-visible { border-color: var(--accent); color: #ece8e1; }
.snd.is-armed { border-color: var(--accent); color: var(--accent); animation: sndPulse 1.8s ease-in-out infinite; }
.snd__bars { display: inline-flex; align-items: flex-end; gap: 2px; height: 12px; }
.snd__bars i { width: 2px; height: 3px; background: currentColor; border-radius: 1px; }
.snd.is-playing .snd__bars i { animation: sndBar .9s ease-in-out infinite; }
.snd.is-playing .snd__bars i:nth-child(2) { animation-delay: .15s; } .snd.is-playing .snd__bars i:nth-child(3) { animation-delay: .3s; } .snd.is-playing .snd__bars i:nth-child(4) { animation-delay: .45s; }
@keyframes sndBar { 0%, 100% { height: 3px; } 50% { height: 12px; } }
@keyframes sndPulse { 50% { box-shadow: 0 0 0 5px rgba(255,106,31,.15); } }
@media (max-width: 760px) { .snd__t { display: none; } .snd { padding: 0 11px; } }
@media (prefers-reduced-motion: reduce) { .snd.is-armed, .snd.is-playing .snd__bars i { animation: none; } .snd.is-playing .snd__bars i { height: 8px; } }
