Modificación header index e inclusión cabecera mvc

index.php

@@ -4,13 +4,20 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Triviagmático</title>
      <link rel="icon" type="image/svg+xml" href="img/favicon/favicon.svg">
+        <!-- Bootstrap 5 CSS -->
+	    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+	    <!-- FontAwesome para iconos -->
+	    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
+	    <!-- Google Fonts para estilo Kahoot -->
+	    <link href="https://fonts.googleapis.com/css2?family=Fredoka:wght@400;600;700&display=swap" rel="stylesheet">
+	    <link rel="stylesheet" href="css/index.css">
+	    <script src="js/jquery-4.0.0.min.js"></script>
 </head>
 
 <body>
 
-    <?php include 'cabecera.php'; ?>
+  <header id="cabecera-container"></header>
 
     <div class="container my-5">
         <div class="row justify-content-center align-items-center g-4">
@@ -46,6 +53,7 @@
     <!-- JS de Bootstrap -->
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
     <script src="js/index.js"></script>
+      <script src="js/cabecera.js"></script>
 </body>
 
 </html>