/* GENERAL */
body {
    margin: 0;
    font-family: Arial;
    background: #f4f4f4;
    text-align: center;
}

/* NAVBAR */
nav{
    background:#0d0d0d;
    padding:15px;
    position:fixed;
    width:100%;
    top:0;
    z-index:1000;
}

nav ul{
    list-style:none;
    display:flex;
    justify-content:center;
    gap:25px;
    margin:0;
    padding:0;
}

/* LINKS */
nav ul li a{
    text-decoration:none;
    font-weight:bold;
    color:white;
    transition:0.3s;
}

nav ul li a:hover{
    color:#FFDE42;
}

/* BOTÓN INICIAR SESIÓN */
.btn-iniciar{
    background-color:#FFDE42;
    color:black !important;
    padding:8px 15px;
    border-radius:10px;
    transition:0.3s;
}

.btn-iniciar:hover{
    background-color:#7a47aa;
    color:white !important;
}

/* HERO */
.hero{
    height:105vh;
    background:url('https://www.inverseteams.com/wp-content/uploads/INVERSE-PERSONALIZADO-BANNER-INFERIOR.jpg') center/cover no-repeat;
    display:flex;
    align-items:center;
    justify-content:center;
    color:white;
}

.hero h1{
    font-size:60px;
    padding:20px;
}

/* TITULOS */
h2 {
    margin-top: 20px;
}

/* ===== CARRUSEL ARREGLADO ===== */

/* 🔥 controla tamaño total */
.carousel {
    max-width: 600px;
    margin: 40px auto;
    position: relative;
}

/* 🔥 tamaño REAL de imagen */
.carousel img {
    height: 300px;
    width: auto;
    max-width: 100%;
    display: block;
    margin: auto;
    object-fit: contain;
}

/* slides */
.carousel-item {
    display: none;
}

.carousel-item.active {
    display: block;
}

/* botones */
.carousel-control-prev,
.carousel-control-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.5);
    color: white;
    padding: 10px;
    cursor: pointer;
    text-decoration: none;
}

.carousel-control-prev { left: 10px; }
.carousel-control-next { right: 10px; }

.carousel-control-prev-icon::after {
    content: "❮";
    font-size: 20px;
}

.carousel-control-next-icon::after {
    content: "❯";
    font-size: 20px;
}

/* FOOTER */
footer{
    background:#0d0d0d;
    color:white;
    text-align:center;
    padding:20px;
}