/* Help Center page styles */

.help-hero {
  position: relative;
  /* Compensar navbar fijo sin ocupar demasiado espacio */
  margin-top: -100px;
  padding: 120px 0 12px 0;
  min-height: auto;
  background: radial-gradient(1000px 500px at 10% -10%, rgba(255,95,69,.14), transparent 60%);
}
.help-hero .container { display:block; padding: 0 16px; }
.help-hero h1 { font-size: clamp(1.6rem, 3.5vw, 2rem); margin-bottom: 6px; }
.help-hero p { color: var(--text-secondary); }

@media (max-width: 768px) {
  .help-hero {
    margin-top: -80px; /* En móviles el body compensa 80px */
    padding-top: 96px; /* Compacto pero visible bajo navbar */
  }
}

.help-sections { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
@media (max-width: 1200px){ .help-sections{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 720px){ .help-sections{ grid-template-columns: 1fr; } }

.help-card { background: var(--bg-secondary); border:1px solid rgba(255,255,255,.08); border-radius: var(--radius-lg); padding: 16px; }
.help-card h2 { margin-bottom: 6px; font-size: 1.25rem; }
.help-card p { color: var(--text-secondary); }
.help-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top: 10px; }
.help-actions .btn { display:inline-flex; align-items:center; gap:8px; }

.hours { margin-top: 10px; padding: 10px 12px; border-radius: var(--radius-md); border:1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04); }
.hours strong { display:block; margin-bottom: 4px; }