/* =========================================================
   LILI MIMOS - BASE (VARIÁVEIS, RESET E UTILITÁRIOS)
========================================================= */

:root {
    /* Cores da marca */
    --fundo: #faf9fc;
    --texto: #2d2d2d;
    --texto-claro: #6c757d;

    /* Cores principais */
    --rosa-vivo: #ff69b4;
    --rosa-escuro: #e55a8a;
    --rosa-claro: #fff0f5;
    --roxo: #c5a3ff;
    --roxo-claro: #f3ecff;
    --amarelo-vivo: #fff4a3;
    --azul-claro: #e6f4ff;
    --lilas-vivo: #c27bc2;
    --lilas-escuro: #a85fa8;

    /* Cores neutras */
    --branco: #ffffff;
    --cinza-suave: #f5f5f5;
    --cinza-claro: #e9ecef;

    /* Sombras */
    --sombra: 0 2px 8px rgba(0, 0, 0, 0.04);
    --sombra-media: 0 4px 12px rgba(0, 0, 0, 0.06);

    /* Bordas */
    --borda: 1px solid #f0f0f0;
    --radius: 16px;
    --radius-sm: 12px;
    --radius-full: 9999px;
}

/* ===== RESET ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family:
        "Inter",
        "Montserrat",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Arial,
        sans-serif;
    background-color: var(--fundo);
    color: var(--texto);
    scroll-behavior: smooth;
    line-height: 1.5;
}

.container {
    width: 90%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ===== UTILITÁRIOS ===== */
.text-center {
    text-align: center;
}
.text-left {
    text-align: left;
}
.text-right {
    text-align: right;
}

/* ===== ANIMAÇÕES ===== */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--cinza-claro);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: var(--rosa-vivo);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--rosa-escuro);
}

/* ===== RESPONSIVIDADE BASE ===== */
@media (max-width: 768px) {
    .container {
        padding: 0 16px;
        width: 95%;
    }
}