/* ============================================================
   contact.css — Contact page
   ============================================================ */

.contact-hero .lead{max-width:60ch}

/* ---------------- CONTACT MAIN ---------------- */
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2.5rem,5vw,4.5rem);align-items:start}

/* info column */
.contact-info h2{font-size:clamp(1.6rem,2.6vw,2rem)}
.contact-list{display:grid;gap:1.4rem;margin-top:2rem}
.contact-list li{display:grid;grid-template-columns:auto 1fr;gap:1.1rem;align-items:start}
.contact-list__ico{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;background:rgba(141,198,63,.1);border:1px solid var(--line-green);color:var(--green);flex-shrink:0}
.contact-list__ico svg{width:22px;height:22px}
.contact-list__label{display:block;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey-2);margin-bottom:.35rem}
.contact-list a,.contact-list__text{display:block;font-size:1rem;color:#dbe3ee;transition:color .25s}
.contact-list a:hover{color:var(--green)}
.contact-socials{display:flex;gap:.6rem;margin-top:2rem}
.contact-socials a{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:11px;color:#cfd8e4;transition:.3s var(--ease)}
.contact-socials a:hover{color:var(--ink);background:var(--green);border-color:var(--green);transform:translateY(-3px)}
.contact-socials svg{width:18px;height:18px}

/* form column */
.contact-form-wrap{padding:clamp(1.8rem,3.5vw,2.8rem)}
.contact-form-wrap h2{font-size:clamp(1.5rem,2.4vw,1.9rem)}
.form-intro{font-size:.95rem;margin:.6rem 0 1.8rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.field{margin-bottom:1.2rem;display:flex;flex-direction:column}
.field label{font-family:var(--head);font-weight:500;font-size:.88rem;color:#c8d2e0;margin-bottom:.5rem}
.field label span{color:var(--green)}
.field input,.field textarea,.field select{
  width:100%;background:var(--ink);border:1px solid var(--line);border-radius:12px;
  padding:.85em 1em;color:#fff;font-size:.95rem;transition:border-color .25s,box-shadow .25s;
}
.field textarea{resize:vertical;min-height:120px}
.field input::placeholder,.field textarea::placeholder{color:var(--grey-2)}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(141,198,63,.14)
}
.select-wrap{position:relative}
.select-wrap select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:2.6em}
.select-wrap svg{position:absolute;right:1em;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--green);pointer-events:none}
.field-error{font-size:.8rem;color:#ff7b72;margin-top:.4rem;min-height:1em;font-family:var(--body)}
.field.has-error input,.field.has-error textarea{border-color:#ff7b72;box-shadow:0 0 0 3px rgba(255,123,114,.12)}

.contact-form-wrap .btn{width:100%;justify-content:center;margin-top:.4rem}
.contact-form-wrap .btn:disabled{opacity:.7;cursor:wait}
.form-status{font-size:.92rem;margin-top:1rem;min-height:1.2em;text-align:center}
.form-status.ok{color:var(--green)}
.form-status.err{color:#ff7b72}

@media (max-width:880px){
  .contact-grid{grid-template-columns:1fr}
  .contact-info{order:2}
}
@media (max-width:520px){.form-row{grid-template-columns:1fr;gap:0}}

/* ---------------- MAP ---------------- */
.map-frame{padding:8px;overflow:hidden;line-height:0}
.map-frame iframe{display:block;width:100%;border-radius:calc(var(--r-lg) - 8px);filter:grayscale(.3) contrast(1.05)}