.hero__variant-label{font-size:0.78rem;font-weight:700;color:var(--text-soft);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:10px}
.hero__variants{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.hero__variant-option{display:inline-flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;padding:4px;border-radius:12px;transition:background 0.2s}
.hero__variant-option:hover{background:var(--surface)}
.hero__variant-swatch{width:32px;height:32px;border-radius:50%;border:2px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,0.1);transition:all 0.2s;display:block}
.hero__variant-option--active .hero__variant-swatch{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.hero__variant-name{display:none}
.hero__variant-option--active .hero__variant-name,.hero__variant-option:hover .hero__variant-name{display:block;font-size:0.65rem;color:var(--text-soft);text-align:center;max-width:60px;line-height:1.2}
.hero__variant-radio{display:none}