.section-tag { font-size: 11.5px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; color: var(--purple-2); display: inline-block; margin-bottom: 14px; }
.page-hero { padding: 52px 0 22px; text-align: center; }
.page-hero h1 { font-size: clamp(32px, 4.4vw, 50px); font-weight: 800; line-height: 1.1; letter-spacing: -0.03em; }
.page-hero h1 .grad { background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.page-hero .lead { color: var(--text-2); font-size: 16px; margin: 18px auto 0; max-width: 560px; line-height: 1.65; }

.contact-grid { display: grid; grid-template-columns: 1.25fr 0.9fr; gap: 26px; align-items: start; }
.form-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 30px 32px; }
.form-card h3 { font-size: 19px; font-weight: 800; }
.form-card .fsub { font-size: 13px; color: var(--text-3); margin: 5px 0 22px; }
.field { margin-bottom: 16px; }
.field label { display: block; font-size: 12.5px; font-weight: 600; color: var(--text-2); margin-bottom: 7px; }
.field input, .field select, .field textarea { width: 100%; background: var(--surface-2); border: 1px solid var(--border-2); border-radius: 12px; padding: 12px 14px; color: var(--text); font-size: 14px; font-family: inherit; outline: none; transition: border-color .16s ease; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--border-glow); }
.field input::placeholder, .field textarea::placeholder { color: var(--text-4); }
.field textarea { resize: vertical; min-height: 110px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-card .btn { width: 100%; justify-content: center; margin-top: 6px; }
.form-note { font-size: 11.5px; color: var(--text-4); text-align: center; margin-top: 12px; }

.info-stack { display: grid; gap: 16px; }
.info-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px 22px; }
.info-card .row { display: flex; gap: 14px; align-items: flex-start; }
.info-card .row + .row { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--border); }
.info-card .ic { flex-shrink: 0; width: 42px; height: 42px; border-radius: 12px; background: rgba(139,92,246,0.1); border: 1px solid rgba(139,92,246,0.22); color: var(--purple-2); display: grid; place-items: center; }
.info-card .ic svg { width: 20px; height: 20px; }
.info-card .lb { font-size: 12px; color: var(--text-4); }
.info-card .vl { font-size: 14.5px; font-weight: 600; color: var(--text); margin-top: 2px; }
.info-card .vl a:hover { color: var(--purple-2); }
.info-social { display: flex; gap: 10px; }
.info-social a { width: 40px; height: 40px; border-radius: 11px; border: 1px solid var(--border); background: var(--card); display: grid; place-items: center; color: var(--text-2); transition: all .18s ease; }
.info-social a:hover { color: #fff; border-color: var(--border-glow); background: rgba(139,92,246,0.12); }
.info-social svg { width: 17px; height: 17px; }

/* Map */
.map-card { position: relative; border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; height: 320px; background:
  linear-gradient(rgba(139,92,246,0.06) 1px, transparent 1px) 0 0 / 100% 40px,
  linear-gradient(90deg, rgba(139,92,246,0.06) 1px, transparent 1px) 0 0 / 40px 100%,
  radial-gradient(120% 120% at 50% 40%, #12122a, #0a0a14 70%); }
.map-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(300px 200px at 50% 42%, rgba(124,58,237,0.18), transparent 70%); }
.map-roads { position: absolute; inset: 0; width: 100%; height: 100%; }
.map-pin { position: absolute; top: 42%; left: 50%; transform: translate(-50%, -100%); text-align: center; }
.map-pin .dot { width: 22px; height: 22px; margin: 0 auto; border-radius: 50% 50% 50% 0; background: var(--grad-cta); transform: rotate(-45deg); box-shadow: 0 8px 24px -6px rgba(109,40,217,0.8); position: relative; }
.map-pin .dot::after { content: ""; position: absolute; top: 6px; left: 6px; width: 10px; height: 10px; border-radius: 50%; background: #fff; }
.map-pin .pulse { position: absolute; top: 4px; left: 50%; transform: translateX(-50%); width: 22px; height: 22px; border-radius: 50%; border: 2px solid rgba(139,92,246,0.6); animation: mp 2.4s ease-out infinite; }
@keyframes mp { 0% { transform: translateX(-50%) scale(1); opacity: .8 } 70%,100% { transform: translateX(-50%) scale(3); opacity: 0 } }
.map-label { position: absolute; bottom: 16px; left: 16px; background: rgba(7,7,13,0.75); backdrop-filter: blur(8px); border: 1px solid var(--border-2); border-radius: 12px; padding: 12px 16px; }
.map-label .t { font-size: 13px; font-weight: 700; }
.map-label .s { font-size: 11.5px; color: var(--text-3); margin-top: 2px; }

@media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .field-row { grid-template-columns: 1fr; } .form-card { padding: 24px 20px; } }