import React from "react";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";

function App() {
  return (
    <div>
      <nav className="navbar navbar-expand-lg navbar-dark bg-primary">
        <div className="container">
          <a className="navbar-brand" href="#">Colégio São José</a>
        </div>
      </nav>

      <header className="banner d-flex align-items-center justify-content-center text-center">
        <div>
          <h1 className="text-light">Novos Alunos 2026</h1>
          <p className="text-warning">Faça a sua inscrição - 80 anos de tradição</p>
          <button className="btn btn-warning btn-lg">Inscreva-se Agora</button>
        </div>
      </header>

      <section className="container py-5 text-center">
        <h2>Educação Infantil</h2>
        <p>Aprendizado lúdico e criativo para os primeiros anos.</p>
        <img
          src="https://images.unsplash.com/photo-1588072432836-e10032774350"
          className="img-fluid rounded"
          alt="Crianças estudando"
        />
      </section>
    </div>
  );
}

export default App;