body {
                    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);
                    min-height: 100vh;
                    margin: 0;
                    font-family: Segoe UI, Arial, sans-serif;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                }
                
                .container {
                    background: rgba(255,255,255,0.95);
                    border-radius: 18px;
                    box-shadow: 0 8px 32px 0 rgba(31,38,135,0.37);
                    padding: 40px 32px 32px 32px;
                    text-align: center;
                    max-width: 400px;
                    width: 90%;
                    position: relative;
                    overflow: hidden;
                }
                
                .container::before {
                    content: "";
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    width: 100%;
                    height: 100%;
                    background: url('../images/domotic.webp?auto=format') no-repeat center center;
                    background-size: contain;
                    opacity: 0.10;
                    transform: translate(-50%, -50%);
                    pointer-events: none;
                    z-index: 0;
                }
                
                h1, .lang-btn {
                    position: relative;
                    z-index: 1;
                }
                
                h1 {
                    background: linear-gradient(90deg, #1e3c72, #2a5298, #00d2ff);
                    -webkit-background-clip: text;
                    -webkit-text-fill-color: transparent;
                    font-size: 2.2em;
                    margin-bottom: 30px;
                    font-weight: bold;
                    text-shadow:
                        2px 2px 4px rgba(30,60,114,0.4),
                        4px 4px 8px rgba(42,82,152,0.2);
                    transform: perspective(300px) rotateX(0deg);
                }
                
                .lang-btn {
                    display: inline-block;
                    margin: 16px 12px;
                    padding: 16px 36px;
                    font-size: 1.1em;
                    font-weight: 600;
                    color: #fff;
                    background: linear-gradient(90deg, #00d2ff, #2a5298);
                    border: none;
                    border-radius: 30px;
                    box-shadow: 0 4px 16px rgba(30,60,114,0.15);
                    cursor: pointer;
                    text-decoration: none;
                    transition: background 0.3s, transform 0.2s;
                }
                
                .lang-btn:hover {
                    background: linear-gradient(90deg, #2a5298, #00d2ff);
                    transform: translateY(-2px) scale(1.05);
                }
                
                img {
                    box-shadow:
                        2px 2px 8px rgba(30,60,114,0.25),
                        8px 8px 24px rgba(42,82,152,0.52);
                }

                @media (max-width: 500px) {
                    .container {
                        padding: 24px 8px;
                    }
                    h1 {
                        font-size: 1.2em;
                    }
                    .lang-btn {
                        width: 90%;
                        margin: 12px 0;
                        padding: 14px 0;
                    }
                }