/* ===== Mobile Fixes ===== */
html, body { overflow-x: hidden; }
img, video { max-width: 100%; height: auto; display: block; }

@media (max-width: 768px) {
  .container { padding: 16px; }
  .hero { grid-template-columns: 1fr !important; gap: 16px !important; padding: 24px 0 !important; }
  .h2 { font-size: 28px !important; line-height: 1.2 !important; }
  .nav { flex-wrap: wrap !important; gap: 10px !important; padding: 10px 16px !important; }
  .navlinks { flex: 1 1 100% !important; display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
  .grid { grid-template-columns: 1fr !important; }
  .grid-3, .cards-3 { grid-template-columns: 1fr !important; }
  .section { padding: 28px 0 !important; }
  .card { padding: 14px !important; border-radius: 14px !important; }
  .btn, .btn-cta { padding: 10px 14px !important; font-size: 0.95rem !important; }
}

.social-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 520px) { .social-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.social-card { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--card); box-shadow: 0 6px 16px rgba(0,0,0,.06); }
.social-card .label { font-size: 0.95rem; }

@media (max-width: 720px) { .kontakt-form .row.two { grid-template-columns: 1fr !important; } }
footer { padding-bottom: 20px; }