// Header — sticky site header with brand, nav, CTA
const Header = ({ onBookClick }) => {
  return (
    <header className="site-header">
      <div className="container site-header__inner">
        <a href="#" className="brand" aria-label="SaludAware">
          <img src="../../assets/iso-saludaware-dark.png" alt="SaludAware Medical Clinic" />
        </a>
        <nav className="nav">
          <a href="#servicios" className="active">Servicios</a>
          <a href="#filosofia">Filosofía</a>
          <a href="#telemedicina">Telemedicina</a>
          <a href="#pacientes">Pacientes</a>
          <a href="#contacto">Contacto</a>
        </nav>
        <div className="header-actions">
          <a href="tel:+17875551234" className="header-phone">+1 787 555 1234</a>
          <button className="btn btn-primary" onClick={onBookClick}>
            Agenda tu cita <span aria-hidden="true">→</span>
          </button>
        </div>
      </div>
    </header>
  );
};

window.Header = Header;