@import url('https://fonts.googleapis.com/css2?family=Fredoka+One&family=Poppins:wght@400;600&display=swap');

:root {
    --cor-primaria: #6a0dad;
    --cor-secundaria: #ffdd57;
    --cor-dark: #2a0845;
    --cor-branca: #ffffff;
    --font-titulo: 'Fredoka One', cursive;
    --font-texto: 'Poppins', sans-serif;
}

body {
    margin: 0;
    font-family: var(--font-texto);
    background: linear-gradient(to right, #6441A5, var(--cor-dark));
    color: var(--cor-branca);
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    overflow: hidden;
    text-align: center;
}

/* --- ESTILOS DA PÁGINA INICIAL (INDEX.HTML) --- */
.landing-body .main-container { padding: 2rem; }
.landing-body .logo { max-width: 250px; margin-bottom: 1rem; }
.landing-body h1 { font-family: var(--font-titulo); font-size: 3rem; color: var(--cor-secundaria); text-shadow: 2px 2px 5px rgba(0,0,0,0.3); }
.landing-body p { font-size: 1.2rem; margin-top: 0; }
.landing-body .play-button { margin: 2rem 0; padding: 15px 40px; font-size: 1.5rem; font-family: var(--font-titulo); background-color: var(--cor-secundaria); color: var(--cor-primaria); border: none; border-radius: 50px; cursor: pointer; text-decoration: none; box-shadow: 0 5px 15px rgba(0,0,0,0.2); transition: all 0.3s ease; }
.landing-body .play-button:hover { transform: scale(1.1); box-shadow: 0 8px 25px rgba(0,0,0,0.3); }
.landing-body .separator { width: 80px; height: 3px; background-color: var(--cor-secundaria); margin: 2rem auto; }
.landing-body .social-links a { color: var(--cor-branca); font-size: 2.5rem; margin: 0 1rem; transition: color 0.3s, transform 0.3s; }
.landing-body .social-links a:hover { color: var(--cor-secundaria); transform: translateY(-5px); }
.whatsapp-float { position: fixed; width: 60px; height: 60px; bottom: 30px; right: 30px; background-color: #25D366; color: #FFF; border-radius: 50px; text-align: center; font-size: 30px; box-shadow: 2px 2px 10px rgba(0,0,0,0.3); z-index: 100; display: flex; justify-content: center; align-items: center; text-decoration: none; transition: transform 0.3s ease; }
.whatsapp-float:hover { transform: scale(1.1); }

/* --- ESTILOS DA PÁGINA DO JOGO (GAME.HTML) --- */
.game-body #game-container { width: 900px; max-width: 95vw; position: relative; display: flex; justify-content: center; align-items: center; }
.game-body #memory-board { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; width: 100%; padding: 20px; perspective: 1000px; }
.game-body .memory-card { background-color: transparent; height: 150px; border-radius: 15px; position: relative; transform-style: preserve-3d; transition: transform 0.6s; cursor: pointer; }
.game-body .memory-card.flip { transform: rotateY(180deg); }
.game-body .front-face, .game-body .back-face { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; border-radius: 15px; display: flex; justify-content: center; align-items: center; font-size: 4rem; box-shadow: 0 5px 15px rgba(0,0,0,0.25); }

/* CORREÇÃO APLICADA AQUI */
.game-body .front-face { 
    background-color: var(--cor-branca);
    transform: rotateY(180deg); /* Face da fruta começa escondida */
}
.game-body .back-face { 
    background: linear-gradient(135deg, var(--cor-primaria), #9370DB); 
    /* Linha 'transform' removida daqui para a face da logo começar visível */
    background-image: url('https://i.ibb.co/S1s6LXS/gelagelalogo.png'); 
    background-size: 60%; 
    background-repeat: no-repeat; 
    background-position: center; 
    border: 3px solid var(--cor-secundaria); 
}

.game-body #game-ui { position: absolute; top: 20px; left: 20px; display: flex; gap: 10px; }
.game-body .game-button { background: rgba(0,0,0,0.5); color: var(--cor-branca); border: 2px solid var(--cor-branca); width: 50px; height: 50px; border-radius: 50%; font-size: 1.5rem; cursor: pointer; text-decoration: none; display: flex; justify-content: center; align-items: center; }
.game-body #feedback-message { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0.5); background-color: var(--cor-secundaria); color: var(--cor-primaria); padding: 20px 40px; border-radius: 20px; font-size: 2.5rem; pointer-events: none; opacity: 0; transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); z-index: 100; }
.game-body #feedback-message.show { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.game-body #win-screen { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(42, 8, 69, 0.95); z-index: 100; display: flex; flex-direction: column; justify-content: center; align-items: center; color: var(--cor-secundaria); }
.game-body #win-screen.hidden { display: none; }
.game-body #win-screen .trophy { max-width: 300px; animation: bounceIn 1s ease-out; }
.game-body #win-screen h1 { font-size: 4rem; text-shadow: 3px 3px 0 var(--cor-primaria); }
.game-body #restart-button { margin-top: 2rem; padding: 15px 40px; font-size: 1.5rem; font-family: var(--font-titulo); background-color: var(--cor-branca); color: var(--cor-primaria); border: none; border-radius: 50px; cursor: pointer; transition: transform 0.2s ease; }
.game-body #restart-button:hover { transform: scale(1.1); }
@keyframes bounceIn { 0% { transform: scale(0.5); opacity: 0; } 70% { transform: scale(1.1); } 100% { transform: scale(1); opacity: 1; } }