// WordmarkRotated.jsx — the rotated SUPERIOR vertical wordmark
const WordmarkRotated = ({ size = 96, color = '#fff' }) => (
  <div style={{
    position: 'relative',
    width: size * 1.1,
    overflow: 'hidden',
    alignSelf: 'stretch',
    display: 'flex',
    justifyContent: 'center',
  }}>
    <div style={{
      position: 'absolute',
      top: '50%', left: '50%',
      transform: 'translate(-50%, -50%) rotate(-90deg)',
      whiteSpace: 'nowrap',
      fontFamily: "'Helvetica Inserat', Impact, sans-serif",
      fontSize: size,
      lineHeight: 1,
      letterSpacing: '-0.01em',
      textTransform: 'uppercase',
      color,
    }}>
      SUPERIOR
    </div>
  </div>
);

window.WordmarkRotated = WordmarkRotated;