// Inject placeholder font-size globally (cannot be done inline in React)
const placeholderStyle = document.createElement('style');
placeholderStyle.textContent = `
  input::placeholder,
  textarea::placeholder {
    font-size: 9px !important;
    font-family: var(--mono);
    letter-spacing: 0.06em;
    color: var(--faint);
  }
  input:focus,
  textarea:focus {
    outline: none;
  }
  * { -webkit-font-smoothing: antialiased; }
`;
document.head.appendChild(placeholderStyle);

function App() {
  return (
    React.createElement(React.Fragment, null,
      React.createElement(Nav),
      React.createElement(Hero),
      React.createElement('div', { style: { background: 'var(--bg)', position: 'relative', zIndex: 2 } },
        React.createElement(Work),
        React.createElement(Career),
        React.createElement(AboutServices),
        React.createElement(Contact),
        React.createElement(Footer),
      )
    )
  );
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(React.createElement(App));