/* ── kontak ───────────────────────────────────────────────── */
.contact{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(24px,3.4vw,56px); align-items:start; }
.contact-side h2{ font-size:clamp(26px,3.4vw,42px); font-variation-settings:"wdth" 110,"wght" 800; }
.contact-side > p{ margin-top:16px; color:var(--txt-2); max-width:46ch; font-size:15.5px; }
.contact-side dl{ margin:28px 0 0; display:grid; gap:0; }
.contact-side dt + dd + dt{ margin-top:22px; }
.contact-side dt{ font-family:"JetBrains Mono",monospace; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
.contact-side dd{ margin:4px 0 0; font-size:15px; }
.contact-side dd.todo{ color:var(--dim); font-style:italic; }
.contact-side dd a{ color:var(--txt); text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:3px; }
.contact-side dd a:hover{ color:var(--orange-br); text-decoration-color:currentColor; }
.contact-side .wa{ display:flex; flex-direction:column; gap:6px; }
form{ border:1px solid var(--line); background:var(--surface); padding:clamp(22px,2.6vw,34px); display:grid; gap:20px; }
.f-row{ display:grid; gap:8px; }
.f-row.two{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
@media (max-width:560px){ .f-row.two{ grid-template-columns:minmax(0,1fr); } }
label{ font-family:"JetBrains Mono",monospace; font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:var(--dim); }
input[type=text],input[type=email],textarea,select{
  width:100%; background:var(--bg); border:1px solid var(--line-2); color:var(--txt);
  padding:12px 13px; font-family:Barlow,sans-serif; font-size:15px; border-radius:0;
  transition:border-color .15s;
}
input:focus,textarea:focus,select:focus{ border-color:var(--orange); outline:none; }
textarea{ resize:vertical; min-height:96px; }
fieldset{ border:0; margin:0; padding:0; display:grid; gap:8px; }
legend{ font-family:"JetBrains Mono",monospace; font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:var(--dim); padding:0; margin-bottom:2px; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{ position:relative; }
.chip input{ position:absolute; opacity:0; width:100%; height:100%; left:0; top:0; margin:0; cursor:pointer; }
.chip span{
  display:block; font-family:"JetBrains Mono",monospace; font-size:11px; letter-spacing:.05em;
  border:1px solid var(--line-2); padding:9px 13px; color:var(--txt-2); transition:.15s; cursor:pointer;
}
.chip input:checked + span{ border-color:var(--orange); background:rgba(248,104,0,.12); color:var(--txt); }
.chip input:focus-visible + span{ outline:2px solid var(--orange-br); outline-offset:2px; }
.f-foot{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; padding-top:4px; }
.f-foot .note{ font-size:12.5px; color:var(--dim); max-width:40ch; line-height:1.5; }
.f-msg{ font-family:"JetBrains Mono",monospace; font-size:12px; color:var(--orange-br); border:1px solid rgba(248,104,0,.4); background:rgba(248,104,0,.08); padding:12px 14px; line-height:1.6; }
.f-msg[hidden]{ display:none!important; }
@media (max-width:880px){ .contact{ grid-template-columns:1fr; } }
.f-send{ border:1px solid rgba(248,104,0,.4); background:rgba(248,104,0,.08); padding:14px 16px; display:grid; gap:12px; }
.f-send[hidden]{ display:none!important; }
.f-send p{ font-size:14px; color:var(--txt-2); line-height:1.55; }
.f-send-acts{ display:flex; flex-wrap:wrap; gap:10px; }
/* jebakan bot di formulir kontak: tidak terlihat, tidak bisa dijangkau Tab */
.f-trap{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.f-acts{ display:flex; flex-wrap:wrap; gap:10px; }
