.contact-page {
  max-width: var(--max);
  min-height: calc(100vh - 80px);
  margin: auto;
  padding: 80px 24px 100px;
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 70px;
  align-items: start;
}

.contact-intro { padding-top: 42px; }
.contact-intro h1 {
  margin: 26px 0;
  font: 700 clamp(48px, 5.5vw, 76px)/1 "Manrope";
  letter-spacing: -.055em;
}
.contact-intro h1 span { color: #6f8094; }
.contact-intro > p {
  max-width: 520px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.65;
}
.contact-promises { margin-top: 52px; border-top: 1px solid var(--line); }
.contact-promises > div { padding: 18px 0; border-bottom: 1px solid var(--line); }
.contact-promises strong { display: block; margin-bottom: 5px; font: 600 14px "Manrope"; }
.contact-promises span { color: #74879a; font-size: 13px; }

.form-panel {
  padding: 42px;
  border: 1px solid rgba(92, 141, 181, .22);
  background: linear-gradient(145deg, rgba(22, 217, 255, .045), rgba(255, 255, 255, .012));
  box-shadow: 0 30px 90px rgba(0, 0, 0, .28);
}
.form-heading > span { color: var(--cyan); font: 600 10px "Manrope"; letter-spacing: .18em; }
.form-heading h2 { margin: 12px 0 7px; font: 650 30px "Manrope"; letter-spacing: -.035em; }
.form-heading p { margin: 0 0 30px; color: #74879a; font-size: 14px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
form label { display: flex; flex-direction: column; gap: 8px; }
form label > span { color: #aebdcb; font-size: 12px; }
input, select, textarea {
  width: 100%;
  padding: 14px 15px;
  border: 1px solid rgba(132, 168, 198, .2);
  border-radius: 0;
  outline: none;
  background: #071019;
  color: #eef6fb;
  font: 14px "DM Sans";
}
input:focus, select:focus, textarea:focus { border-color: rgba(22, 217, 255, .65); box-shadow: 0 0 0 3px rgba(22, 217, 255, .07); }
textarea { resize: vertical; min-height: 128px; }
.message-field { margin-top: 18px; }
.consent { margin: 18px 0; flex-direction: row; align-items: center; }
.consent input { width: 16px; height: 16px; accent-color: var(--cyan); }
.consent span { color: #8193a6; }
.honey { position: absolute; left: -9999px; }
.submit-button {
  width: 100%;
  min-height: 54px;
  border: 0;
  background: linear-gradient(120deg, #25d9ff, #3979ff);
  color: #031019;
  font: 700 14px "DM Sans";
  cursor: pointer;
}
.submit-button span { margin-left: 14px; }
.form-note { margin: 12px 0 0; color: #60758a; text-align: center; font-size: 11px; }
.form-note i { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--green); }
.direct-contact { margin-top: 30px; padding-top: 25px; border-top: 1px solid var(--line); }
.direct-contact > p { margin: 0 0 14px; color: #9fb0c0; font-size: 13px; }
.direct-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.direct-button { padding: 14px; border: 1px solid var(--line); color: #8193a6; font: 600 13px "Manrope"; opacity: .7; }
.direct-button small { display: block; margin-top: 4px; color: #586c7f; font: 10px "DM Sans"; }

@media (max-width: 980px) {
  .contact-page { grid-template-columns: 1fr; gap: 38px; padding-top: 40px; }
  .contact-intro { padding-top: 10px; }
}

@media (max-width: 640px) {
  .contact-page { padding: 38px 20px 70px; }
  .contact-intro h1 { font-size: 48px; }
  .form-panel { padding: 28px 20px; }
  .form-grid, .direct-actions { grid-template-columns: 1fr; }
}

/* Admin-managed contact channels */
.direct-button { display:block; text-decoration:none; opacity:1; transition:.2s; }
.direct-button:hover { border-color:rgba(22,217,255,.45); color:#e9faff; background:rgba(22,217,255,.045); }
.contact-unavailable { grid-column:1/-1; padding:14px; border:1px solid var(--line); color:#60758a; font-size:12px; }
.social-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.social-actions a { color:#8193a6; text-decoration:none; border-bottom:1px solid #31465a; padding:5px 0; font-size:12px; }
.social-actions a:hover { color:var(--cyan); border-color:var(--cyan); }
.contact-meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:14px; color:#60758a; font-size:11px; }
.contact-meta i { width:3px; height:3px; border-radius:50%; background:#496176; }

/* Refined contact buttons */
.submit-button {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(74, 216, 255, .38);
  border-radius: 12px;
  background: linear-gradient(135deg, #31e1ff 0%, #3b86ff 58%, #6268ff 100%);
  box-shadow: 0 14px 34px rgba(24, 139, 255, .20), inset 0 1px 0 rgba(255,255,255,.25);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.submit-button:hover { transform: translateY(-2px); box-shadow: 0 18px 42px rgba(24,139,255,.31), inset 0 1px 0 rgba(255,255,255,.3); filter: saturate(1.08); }
.submit-button:active { transform: translateY(0); }

.direct-actions { gap: 12px; }
.direct-button {
  min-height: 72px;
  padding: 15px 16px;
  border: 1px solid rgba(132,168,198,.18);
  border-radius: 12px;
  display: flex;
  align-items: center;
  gap: 13px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
  color: #e6f1fb;
  font: 650 13px "Manrope";
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.direct-button::after { content: "↗"; margin-left: auto; color: #61778c; font-size: 15px; transition: transform .2s ease, color .2s ease; }
.direct-button:hover { transform: translateY(-2px); color: #fff; border-color: rgba(22,217,255,.38); background: linear-gradient(145deg, rgba(22,217,255,.075), rgba(58,125,255,.035)); box-shadow: 0 12px 28px rgba(0,0,0,.18); }
.direct-button:hover::after { transform: translate(2px,-2px); color: var(--cyan); }
.direct-button small { display:block; margin-top:4px; color:#71869a; font:10px "DM Sans"; font-weight:500; }
.contact-button-icon { flex: 0 0 38px; width:38px; height:38px; border-radius:10px; display:grid; place-items:center; background:rgba(22,217,255,.07); border:1px solid rgba(22,217,255,.13); }
.contact-button-icon svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.contact-button-copy { min-width:0; }
.direct-button.whatsapp .contact-button-icon { color:#57f2b2; background:rgba(87,242,178,.07); border-color:rgba(87,242,178,.15); }
.direct-button.telegram .contact-button-icon { color:#42c8ff; }
.direct-button.email .contact-button-icon { color:#8aa8ff; background:rgba(91,119,255,.08); border-color:rgba(91,119,255,.16); }
.direct-button.phone .contact-button-icon { color:#d6e5f4; }

.social-actions { gap:8px; }
.social-actions a { border:1px solid rgba(132,168,198,.16); border-radius:999px; padding:8px 12px; background:rgba(255,255,255,.02); transition:.2s; }
.social-actions a:hover { color:#eaffff; border-color:rgba(22,217,255,.38); background:rgba(22,217,255,.055); transform:translateY(-1px); }

/* Compact contact cards - admin managed */
.direct-contact { margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--line); }
.direct-contact > p,
.social-heading { margin: 0 0 12px; color: #c5d4e2; font: 500 13px "DM Sans"; }
.direct-contact > p::after,
.social-heading::after { content:""; display:block; width:28px; height:2px; margin-top:10px; background:var(--cyan); box-shadow:0 0 10px rgba(22,217,255,.35); }
.direct-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.direct-button,
.social-button {
  min-width:0;
  min-height:58px;
  padding:10px 11px;
  border:1px solid rgba(22,217,255,.35);
  border-radius:0;
  background:#071019;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 20px;
  align-items:center;
  gap:10px;
  color:#e7f1f9;
  text-decoration:none;
  box-shadow:none;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}
.direct-button::after { content:none; }
.direct-button:hover,
.social-button:hover { transform:translateY(-1px); border-color:var(--cyan); background:rgba(22,217,255,.025); box-shadow:0 0 0 1px rgba(22,217,255,.04) inset; }
.contact-button-icon,
.social-icon {
  width:34px;
  height:34px;
  border:0;
  border-right:1px solid rgba(74,144,191,.35);
  border-radius:0;
  background:transparent !important;
  display:grid;
  place-items:start center;
  color:var(--cyan) !important;
  padding-right:9px;
}
.contact-button-icon svg,
.social-icon svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; overflow:visible; }
.social-icon svg.filled-icon,
.social-icon .filled-icon { fill:currentColor; stroke:none; }
.contact-button-copy,
.social-copy { min-width:0; display:block; }
.contact-button-copy strong,
.social-copy strong { display:block; color:#eef7fd; font:600 12px "Manrope"; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.direct-button small,
.social-button small { display:block; margin-top:3px; color:#6f8ba6; font:10.5px/1.2 "DM Sans"; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.contact-arrow { color:var(--cyan); font-size:19px; line-height:1; text-align:right; transition:transform .18s ease; }
.direct-button:hover .contact-arrow,
.social-button:hover .contact-arrow { transform:translateX(2px); }
.social-section { margin-top:22px; }
.social-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:0; }
.social-actions a { padding:10px 11px; border:1px solid rgba(22,217,255,.25); border-radius:0; background:#071019; }
.contact-meta { margin-top:13px; padding-top:12px; border-top:1px solid rgba(132,168,198,.12); }
.contact-unavailable { min-height:58px; display:flex; align-items:center; border-color:rgba(22,217,255,.2); background:#071019; }
@media (max-width: 760px) {
  .direct-actions { grid-template-columns:1fr; }
  .social-actions { grid-template-columns:1fr 1fr; }
}
@media (max-width: 480px) {
  .social-actions { grid-template-columns:1fr; }
}