/* ==========================================================================
1. ESTRUTURA BASE DA HERO (Computador / Telas Grandes)
   ========================================================================== */

#bgt3-home {
    position: relative;
    overflow: hidden;
}

.bgt3-hero {
    position: relative;
    min-height: 100%;
    display: flex;
    align-items: center;
    z-index: 10;
    height: 100% !important;
    max-height: calc(100vh - 100px) !important; 
    overflow: hidden !important; 
    box-sizing: border-box;
}

.bgt3-hero-content {
    max-width: 760px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding-top: 10px;
    padding-bottom: 120px;
}

/* BADGE */
.bgt3-hero-badge {
    display: inline-flex;
    align-items: center;
    width: max-content;
    padding: 10px 22px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.10);
    backdrop-filter: blur(12px);
    font-size: .90rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--bgt3-accent);
}

/* TITLE & TYPOGRAPHY */
.bgt3-hero-title {
    font-size: clamp(3.5rem, 8vw, 6.5rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -2px;
    color: white;
    text-shadow: 0 10px 35px rgba(0,0,0,.45);
}

.bgt3-hero-subtitle {
    font-size: clamp(1.3rem, 3vw, 2rem);
    color: var(--bgt3-text);
    font-weight: 500;
}

.bgt3-hero-description {
    max-width: 700px;
    font-size: 1.15rem;
    line-height: 1.9;
    color: var(--bgt3-text-muted);
}

/* BUTTONS */
.bgt3-hero-buttons {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    margin-top: 20px;
}

/* INTRODUCTION */
.bgt3-home-intro {
    margin-top: 60px;
}

.bgt3-home-intro .bgt3-card {
    padding: 10px;
}

.bgt3-home-intro h2 {
    margin-bottom: 10px;
    font-size: 2.2rem;
}

.bgt3-home-intro p {
    line-height: 1.9;
    font-size: 1.08rem;
}

/* FEATURES */
.bgt3-home-features {
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.bgt3-home-features .bgt3-card #bgt3-home-intro-card {
    text-align: center;
    padding: 45px 30px;
    margin: -300px auto 0 auto !important; 
}

.bgt3-home-features h3 {
    margin: 25px 0 15px;
}

.bgt3-home-features p {
    color: var(--bgt3-text-muted);
}

/* STATS */
.bgt3-home-stats {
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    text-align: center;
}

.bgt3-home-stats h2 {
    font-size: 3.3rem;
    margin-bottom: 12px;
    color: var(--bgt3-primary);
}

.bgt3-home-stats span {
    color: var(--bgt3-text-muted);
}

/* ==========================================================================
PAGE FOOTER (Estático e Protegido)
   ========================================================================== */
.bookflip-page-footer {
    position: fixed !important;
    left: 10% !important;
    right: auto !important;
    bottom: 35px !important;
    text-align: left !important;
    transform: none !important;
    margin: 0 !important;
    font-family: serif;
    font-size: 1.1rem;
    letter-spacing: .30em;
    color: rgba(255,255,255,.45);
    z-index: 99999 !important;
}

.footer-right {
    left: 10% !important;
    right: auto !important;
    text-align: left;
}

.footer-left {
    right: 10% !important;
    left: auto !important;
    text-align: right;
}

/* PARALLAX & TRANSITIONS */
.bgt3-depth-1{ transform: translateZ(30px); }
.bgt3-depth-2{ transform: translateZ(60px); }
.bgt3-depth-3{ transform: translateZ(90px); }
.bgt3-depth-4{ transform: translateZ(120px); }
.bgt3-depth-5{ transform: translateZ(160px); }

#bgt3-home * {
    transition: transform .5s ease, opacity .5s ease;
}


/* ==========================================================================
2. ULTRA COMPACTAÇÃO PARA CELULAR / TELEMÓVEL (Telas até 768px) - VERSÃO CORRIGIDA
   ========================================================================== */
@media (max-width: 992px) {

    /* Garante contenção absoluta e empurra o conteúdo para baixo do menu */
    .bgt3-hero {
        max-height: calc(100vh - 80px) !important;
        /* ADICIONADO: 80px de espaço no topo para o conteúdo descer e não sumir sob o menu */
        padding: 200px 15px 10px 15px !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    .bgt3-hero-content {
        gap: 12px !important;
        padding-top: 0px !important; /* Zera para respeitar o padding do container pai */
        padding-bottom: 40px !important;
        max-width: 100% !important;
        align-items: center !important;
    }

    /* Redução drástica da Badge */
    .bgt3-hero-badge {
        padding: 4px 12px !important;
        font-size: 0.7rem !important;
        margin-bottom: 2px !important;
    }

    /* Redução Matemática dos Títulos principais */
    .bgt3-hero-title {
        font-size: 2rem !important;
        text-align: center !important;
        letter-spacing: -0.5px !important;
    }

    .bgt3-hero-subtitle {
        font-size: 1.1rem !important;
        text-align: center !important;
    }

    .bgt3-hero-description {
        font-size: 0.8rem !important;
        line-height: 1.4 !important;
        text-align: center !important;
        max-width: 100% !important;
        margin-bottom: 5px !important;
    }

    /* Adaptação dos Botões */
    .bgt3-hero-buttons {
        gap: 10px !important;
        margin-top: 5px !important;
        justify-content: center !important;
    }

    .bgt3-hero-buttons .bgt3-btn {
        padding: 8px 16px !important;
        font-size: 0.8rem !important;
    }

    /* Compactação da Introdução */
    .bgt3-home-intro {
        margin-top: 15px !important; /* Ligeiramente aumentado para dar respiro */
    }

    .bgt3-home-intro h2 {
        font-size: 1.2rem !important;
    }

    .bgt3-home-intro p {
        font-size: 0.8rem !important;
        line-height: 1.4 !important;
    }

    /* FEATURES EM MODO COMPACTO */
    .bgt3-home-features {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        margin-top: 15px !important; /* Empurra os cards para baixo de forma segura */
        width: 100% !important;
    }

    .bgt3-home-features .bgt3-card #bgt3-home-intro-card {
        padding: 15px 20px !important;
        margin: 0 auto !important; /* Mantém zerado para o card não subir no menu */
        border-radius: 12px !important;
    }

    .bgt3-home-features h3 {
        font-size: 1rem !important;
        margin: 5px 0 !important;
    }

    .bgt3-home-features p {
        font-size: 0.4rem !important;
        line-height: 1.3 !important;
    }

    /* STATS EM MINI-GRID 2x2 */
    .bgt3-home-stats {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 3px !important;
/*         margin-top: 3px !important; */
        width: 100% !important;
    }

    .bgt3-home-stats h2 {
        font-size: 0.8rem !important;
        margin-bottom: 2px !important;
    }

    .bgt3-home-stats span {
        font-size: 0.5rem !important;
    }

    /* Ajuste de segurança para o rodapé */
    .bookflip-page-footer {
        bottom: 5px !important;
        font-size: 0.85rem !important;
    }
}