/* =========================================================
   Section 7 — Contact. Giant two-line headline fitted to the grid,
   direct channels cols 1–5, form cols 7–12 (2-col fields).
   ========================================================= */

.contact{padding-block:clamp(72px,9vw,144px) clamp(64px,7vw,112px);border-top:1px solid var(--line)}
.contact__head{padding:0 var(--margin);margin-bottom:clamp(40px,5vw,80px)}
.contact__idx{color:var(--acid);margin-bottom:16px}
.contact__title{font-family:var(--f-display);font-weight:700;font-size:clamp(56px,13.2vw,260px);letter-spacing:-.065em;line-height:.82;text-transform:uppercase}
.contact__l1,.contact__l2{display:block;width:max-content;white-space:nowrap}
.contact__l2{color:var(--acid)}
.contact__ar{font-family:var(--f-display);font-weight:500;font-size:.5em;margin-left:.12em;vertical-align:top;display:inline-block;transition:transform .6s var(--expo)}
.contact__title:hover .contact__ar{transform:translate(.08em,-.08em)}

.contact__grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gutter);row-gap:56px;padding:0 var(--margin)}
.contact__direct{grid-column:1/-1;display:flex;flex-direction:column;gap:22px;min-width:0}
.contact__form{grid-column:1/-1;display:grid;grid-template-columns:1fr;gap:20px 24px;min-width:0}
@media (min-width:900px){
	.contact__direct{grid-column:1/span 5}
	.contact__form{grid-column:7/span 6;grid-template-columns:1fr 1fr}
}

.contact__status{display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute-2)}
.contact__dot{width:9px;height:9px;border-radius:50%;background:var(--mute)}
.contact__status.is-live{color:var(--paper)}
.contact__status.is-live .contact__dot{background:var(--acid);animation:ma-pulse 1.6s infinite}
@keyframes ma-pulse{50%{opacity:.25}}
.contact__lede{font-family:var(--f-display);font-weight:500;font-size:clamp(22px,2vw,30px);letter-spacing:-.025em;line-height:1.2;max-width:24ch}
.contact__wa{display:flex;flex-direction:column;gap:6px;background:var(--acid);color:var(--ink);padding:20px 22px;transition:background .4s var(--expo)}
.contact__wa .label{color:var(--ink);opacity:.7}
.contact__wa-t{font-family:var(--f-display);font-weight:700;font-size:clamp(22px,2.2vw,32px);letter-spacing:-.03em;text-transform:uppercase}
.contact__wa:hover{background:var(--paper)}
.contact__row{display:grid;grid-template-columns:100px 1fr auto;gap:8px 16px;align-items:baseline;border-top:1px solid var(--line-strong);padding-top:14px}
.contact__row .label{color:var(--mute-2)}
.contact__email{font-family:var(--f-display);font-weight:500;font-size:clamp(17px,1.4vw,21px);overflow-wrap:anywhere;transition:color .3s}
.contact__email:hover{color:var(--acid)}
.contact__copy{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line-strong);padding:5px 10px;transition:background .3s,color .3s}
.contact__copy:hover,.contact__copy.is-done{background:var(--acid);color:var(--ink);border-color:var(--acid)}
.contact__social{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;grid-column:2/-1}
.contact__social a{font-family:var(--f-display);font-weight:500;font-size:17px;transition:color .3s}
.contact__social a:hover{color:var(--acid)}
.contact__time{grid-column:2/-1;font-variant-numeric:tabular-nums}
.contact__tz{color:var(--mute-2);font-size:13px}

/* form */
.field{display:flex;flex-direction:column;gap:8px;min-width:0;border:0;margin:0;padding:0}
.field--wide{grid-column:1/-1}
.field label,.field legend{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute-2);padding:0}
.field__opt{color:var(--mute);text-transform:none;letter-spacing:0}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:17px;color:var(--paper);background:transparent;border:0;border-bottom:1px solid var(--line-strong);padding:10px 0 12px;border-radius:0;transition:border-color .3s}
.field select{appearance:none;background:linear-gradient(45deg,transparent 50%,var(--paper) 50%) right 6px center/6px 6px no-repeat,linear-gradient(-45deg,transparent 50%,var(--paper) 50%) right 0 center/6px 6px no-repeat;padding-right:24px}
.field select option{background:var(--ink);color:var(--paper)}
.field textarea{resize:vertical;min-height:120px;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--acid)}
.field input::placeholder,.field textarea::placeholder{color:var(--mute)}
.field.is-error input,.field.is-error textarea{border-color:#ff6a4d}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding-top:4px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:block;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.04em;padding:8px 14px;border:1px solid var(--line-strong);border-radius:999px;transition:background .3s,color .3s,border-color .3s}
.chip:hover span{border-color:var(--paper)}
.chip input:checked + span{background:var(--acid);color:var(--ink);border-color:var(--acid)}
.chip input:focus-visible + span{outline:2px solid var(--acid);outline-offset:3px}
.contact__hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.contact__send{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:8px}
.contact__submit{display:inline-flex;align-items:center;gap:14px;background:var(--acid);color:var(--ink);padding:20px 28px;font-family:var(--f-display);font-weight:700;font-size:clamp(18px,1.6vw,24px);letter-spacing:-.02em;text-transform:uppercase;position:relative;overflow:hidden;isolation:isolate}
.contact__submit::before{content:"";position:absolute;inset:0;background:var(--paper);transform:translateY(101%);transition:transform .5s var(--expo);z-index:-1}
.contact__submit:hover::before{transform:none}
.contact__submit[disabled]{opacity:.6;pointer-events:none}
.contact__note{font-size:15px;color:var(--mute-2);max-width:40ch}
.contact__note.is-ok{color:var(--acid)}
.contact__note.is-err{color:#ff8a70}
