/* /hall-of-fame — los mecenas que pidieron salir (Fase 42), «oro sobre carbón».
   Se apoya en los componentes de global.css (.gv2-card, .gv2-btn, .gv2-chip,
   .gv2-eyebrow, .gv2-section-title); aquí solo va lo propio de la página. */

.hof-wrap { max-width:1200px;margin:0 auto;padding:calc(var(--nav-h) + var(--sp-12)) var(--sp-4) var(--sp-16);}
.hof-wrap { color:var(--gv2-text);font-family:var(--font-ui);}

.hof-hero { position:relative;isolation:isolate;max-width:760px;margin:0 auto var(--sp-16);text-align:center;}
.hof-hero::before { content:"";position:absolute;inset:-4rem -2rem auto;height:20rem;z-index:-1;pointer-events:none;}
.hof-hero::before { background:radial-gradient(closest-side, rgba(212, 168, 67, 0.14), transparent);}
.hof-emblem { display:inline-flex;align-items:center;justify-content:center;width:72px;height:72px;margin-bottom:var(--sp-4);}
.hof-emblem { border:1px solid var(--gv2-border-gold);border-radius:50%;background:var(--gv2-gold-wash);box-shadow:var(--gv2-shadow-gold);}
.hof-emblem-icon { width:32px;height:32px;color:var(--gold-light);fill:currentColor;}
.hof-title { margin:0 0 var(--sp-4);font-family:var(--font-display);font-weight:400;letter-spacing:2px;line-height:1;}
.hof-title { font-size:clamp(3rem, 9vw, 5.5rem);color:var(--gv2-text);text-transform:uppercase;}
.hof-lead { margin:0 auto;max-width:600px;font-family:var(--font-body);font-size:1.125rem;line-height:1.65;color:var(--gv2-text-2);}

.hof-section { margin:0 0 var(--sp-16);text-align:center;}
.hof-section-title { margin:0 0 var(--sp-8);}

.hof-grid { display:grid;grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));gap:var(--sp-6);margin:0;padding:0;list-style:none;}
.hof-card { display:flex;flex-direction:column;align-items:center;gap:var(--sp-3);padding:var(--sp-8) var(--sp-6);text-align:center;}
.hof-card[data-tier="Legend"] { border-color:var(--gv2-border-gold);box-shadow:var(--gv2-shadow-gold);}
.hof-card[data-tier="Legend"] { background:linear-gradient(180deg, var(--gv2-gold-wash), transparent 55%), var(--gv2-surface);}
.hof-avatar { display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:50%;}
.hof-avatar { background:var(--gv2-track);border:2px solid var(--gv2-border-gold);color:var(--gold-light);}
.hof-avatar { font-family:var(--font-display);font-size:2.25rem;line-height:1;text-transform:uppercase;}
.hof-name { margin:0;max-width:100%;font-family:var(--font-ui);font-size:1.25rem;font-weight:700;letter-spacing:0.04em;line-height:1.25;}
.hof-name { color:var(--gv2-text);overflow-wrap:anywhere;}

.hof-empty { max-width:640px;margin:0 auto;padding:var(--sp-12) var(--sp-6);border-style:dashed;border-color:var(--gv2-border-gold);}
.hof-empty-icon { display:inline-flex;width:44px;height:44px;margin-bottom:var(--sp-4);color:var(--gold);}
.hof-empty-icon svg { width:100%;height:100%;fill:currentColor;}
.hof-empty-title { margin:0 0 var(--sp-2);font-family:var(--font-display);font-size:1.75rem;letter-spacing:1px;line-height:1.1;color:var(--gv2-text);}
.hof-empty-text { margin:0 auto var(--sp-6);max-width:460px;font-size:1.0625rem;line-height:1.5;color:var(--gv2-text-2);}

.hof-join { margin-top:var(--sp-12);}
.hof-join-text { margin:0 0 var(--sp-4);font-size:1.0625rem;color:var(--gv2-text-2);}

.hof-band { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-6);padding:var(--sp-8);}
.hof-band { border:1px solid var(--gv2-border-gold);border-radius:var(--gv2-radius-xl);}
.hof-band { background:linear-gradient(120deg, rgba(212, 168, 67, 0.12), transparent 60%), var(--gv2-surface);}
.hof-band-title { margin:0 0 var(--sp-2);font-family:var(--font-display);font-weight:400;font-size:clamp(1.75rem, 4vw, 2.5rem);letter-spacing:1px;line-height:1;color:var(--gv2-text);}
.hof-band-text { margin:0;font-size:1.0625rem;line-height:1.5;color:var(--gv2-text-2);}
.hof-band-actions { display:flex;flex-wrap:wrap;gap:var(--sp-3);flex:0 0 auto;}

@media (max-width:760px) {
  .hof-band { flex-direction:column;align-items:stretch;text-align:center;padding:var(--sp-8) var(--sp-4);}
  .hof-band-actions { flex-direction:column;}
  .hof-empty { padding:var(--sp-8) var(--sp-4);}
}