/* Contact Us page styles (PiratePLGame)
   Keep it minimal and complementary to base.css */
.hero {
  background: radial-gradient(80% 60% at 50% 0%, rgba(212,175,55,0.12), transparent), linear-gradient(180deg, rgba(16,40,68,0.9), rgba(11,30,51,0.9));
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.hero .hero-sub { color: var(--color-text-muted); max-width: 70ch; }

.contact-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-24);
}
@media (min-width: 900px) {
  .contact-grid { grid-template-columns: repeat(2, 1fr); }
}

.contact-card .contact-list { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-16); }
.contact-card .contact-list li { display: grid; grid-template-columns: 32px 1fr; gap: var(--space-12); align-items: start; }
.contact-card i { color: var(--color-primary); font-size: 1.1rem; margin-top: 4px; }

.support-cta { display: flex; gap: var(--space-12); flex-wrap: wrap; margin-top: var(--space-16); }

.form-grid { align-items: start; }
.form-field { display: grid; gap: 8px; }
.form-field-full { grid-column: 1 / -1; }
.checkbox { display: flex; gap: 10px; align-items: flex-start; }
.form-status { margin-top: var(--space-12); color: var(--color-text-muted); }
.form-inline { display: flex; gap: var(--space-12); flex-wrap: wrap; }
.form-inline .input { min-width: min(280px, 100%); }

.social-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-12); padding: 0; list-style: none; }
.social-link { display: inline-flex; gap: 10px; align-items: center; padding: 12px 14px; border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius-md); }
.social-link:hover { text-decoration: none; background: rgba(255,255,255,0.04); }

.media-kit-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-12); }
.kit-item { display: flex; gap: 10px; align-items: center; padding: 12px 14px; border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius-md); color: var(--color-text); }
.kit-item:hover { background: rgba(255,255,255,0.04); text-decoration: none; }
.kit-item i { color: var(--color-primary); }

.events-list { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-12); }
.event { display: grid; grid-template-columns: 140px 1fr; gap: var(--space-16); }
.event-date { color: var(--color-primary); font-weight: 600; }
@media (max-width: 600px) { .event { grid-template-columns: 1fr; } }

.faq details { background: var(--color-surface); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-md); padding: 12px 14px; }
.faq details + details { margin-top: var(--space-12); }
.faq summary { cursor: pointer; font-weight: 600; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '\25BC'; float: right; transition: transform var(--duration-150) var(--ease); color: var(--color-primary); }
.faq details[open] summary::after { transform: rotate(180deg); }
