body {
      margin: 0;
      font-family: Arial, sans-serif;
      background: #0b0f14;
      color: #e6edf3;
      line-height: 1.6;
    }
    main {
      max-width: 900px;
      margin: 0 auto;
      padding: 64px 24px;
    }
    .eyebrow {
      color: #8b949e;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      font-size: 0.8rem;
    }
    h1 {
      font-size: clamp(2.2rem, 6vw, 4.5rem);
      line-height: 1.05;
      margin: 16px 0;
    }
    h2 {
      margin-top: 48px;
      border-bottom: 1px solid #263241;
      padding-bottom: 8px;
    }
    a {
      color: #58a6ff;
    }
    .card {
      border: 1px solid #263241;
      background: #121821;
      border-radius: 16px;
      padding: 20px;
      margin: 16px 0;
    }
    .tag {
      display: inline-block;
      border: 1px solid #303d4f;
      border-radius: 999px;
      padding: 4px 10px;
      margin: 4px 4px 4px 0;
      color: #8b949e;
      font-size: 0.85rem;
    }

html {
  scroll-behavior: smooth;
}

.contact-panel {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 24px;
  align-items: center;
  border: 1px solid #263241;
  border-radius: 22px;
  padding: 28px;
  margin-top: 16px;
  background:
    radial-gradient(circle at top left, rgba(88, 166, 255, 0.14), transparent 35%),
    linear-gradient(180deg, #121821, #0f1620);
}

.contact-panel {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 32px;
  align-items: start;
  border: 1px solid #263241;
  border-radius: 22px;
  padding: 28px;
  margin-top: 16px;
  background:
    radial-gradient(circle at top left, rgba(88, 166, 255, 0.14), transparent 35%),
    linear-gradient(180deg, #121821, #0f1620);
}

.contact-copy {
  padding-top: 10px;
}

.contact-panel h3 {
  margin: 0 0 10px;
  font-size: 1.55rem;
}

.contact-panel p {
  margin: 0;
  color: #8b949e;
}

.contact-actions {
  display: grid;
  gap: 20px;
}

.contact-label {
  margin: 0 0 8px;
  color: #8b949e;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.72rem;
}

.contact-links.compact {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.contact-links a {
  display: block;
  padding: 13px 14px;
  border: 1px solid #303d4f;
  border-radius: 14px;
  background: rgba(11, 15, 20, 0.55);
  color: #e6edf3;
  text-decoration: none;
  font-weight: 700;
  font-size: 0.95rem;
}

.contact-links a:hover {
  border-color: rgba(88, 166, 255, 0.75);
  color: #58a6ff;
}

@media (max-width: 800px) {
  .contact-panel {
    grid-template-columns: 1fr;
  }

  .contact-links.compact {
    grid-template-columns: 1fr;
  }
}



.site-footer {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid #263241;
  color: #8b949e;
  font-size: 0.9rem;
  text-align: center;
}
a {
  color: #58a6ff;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}