header{width:100%;height:380px;overflow:hidden}.banner-img{width:100%;height:100%;object-fit:cover}body{background:#1a1a1a;color:#eee;font-family:Segoe UI,sans-serif;margin:0;padding:20px}h1{text-align:center;color:#d6c89f;text-shadow:0 0 5px #000}.personajes-container ul{list-style:none;padding:0;margin:0;flex-wrap:wrap;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:25px}.personaje-card{display:flex;flex-direction:column;align-items:center;align-self:start;background:#2a2a2a;border:1px solid #3b3b3b;border-radius:8px;padding:15px;box-shadow:0 0 12px #0006;transition:transform .2s;text-align:center}.personaje-card:hover{transform:scale(1.03)}.personaje-card img{width:100%;height:250px;object-fit:contain;background:#000;border-radius:6px;border:2px solid #4a4538}.character-name{font-size:1.4em;margin-top:10px;color:#d9d6c3}.info-btn{margin-top:10px;background:#5a4d37;color:#eee;border:none;padding:8px 10px;cursor:pointer;border-radius:4px;width:100%;font-weight:700;transition:background .2s}.info-btn:hover{background:#756344}.extra-info{max-height:0;opacity:0;overflow:hidden;margin-top:0;background:#1f1f1f;padding:0 10px;border-left:3px solid #756344;border-radius:4px;transition:max-height .5s ease,opacity .5s ease,padding .5s ease,margin-top .5s ease}.extra-info.show{max-height:500px;opacity:1;padding:10px;margin-top:10px}.info-label{font-weight:700;color:#c8b389}nav{display:flex;justify-content:space-between;align-items:center;margin-top:50px;margin-left:auto;margin-right:auto;width:85%;padding:10px 0}nav a{margin:0 15px;text-decoration:none;color:#d6c89f;font-size:20px;padding:10px 20px;border-radius:5px;position:relative;transition:all .3s ease;display:block;flex:1;text-align:center}nav a:hover{background-color:#555;color:#fff;transform:scale(1.1)}nav a.selected{background-color:#d6c89f;color:#1a1a1a;font-weight:700}nav a:after{content:"";position:absolute;width:0;height:3px;background-color:#d6c89f;left:50%;bottom:-5px;transition:all .3s ease;transform:translate(-50%)}nav a:hover:after{width:100%}.footer{background-color:#111;color:#fff;padding:20px;margin-top:40px;text-align:center}.footer-content{display:flex;justify-content:center;gap:30px}.footer a{color:#fff;text-decoration:none;font-weight:700}.footer a:hover{color:#00bcd4}
