/* ---- css/base/reset.css ---- */
*{

    margin:0;

    padding:0;

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

    overflow-x:hidden;

    width:100%;

}

body{

    overflow-x:hidden;

    width:100%;

}

img{

    display:block;

    max-width:100%;

}

button{

    cursor:pointer;

    border:none;

    background:none;

}

a{

    text-decoration:none;

}

ul{

    list-style:none;

}

/* ---- css/base/variables.css ---- */
:root{

    

    --primaria:#1D173F;
    --secundaria:#A678FF;

    --primaria-hover:#2A2256;
    --secundaria-hover:#915DFF;

    --sucesso:#23C16B;

    --erro:#F04438;

    --aviso:#F79009;

    

    --background:#F6F7FB;

    --surface:#FFFFFF;

    --surface-2:#F6F3FF;

    --texto:#222222;

    --texto-claro:#666666;

    --borda:#E4E4E7;

    

    --titulo-cor:var(--primaria);

    --shadow:
        0 15px 40px rgba(0,0,0,.08);

    

    --bg-chrome:#1D173F;

    --texto-chrome:#FFFFFF;

    --texto-chrome-claro:#C9C3E0;

    --link-chrome:#A678FF;

    --link-chrome-hover:#5b2eb6;

    --borda-chrome:rgba(255,255,255,.08);

    --chrome-hover-bg:rgba(255,255,255,.06);

    --sombra-chrome:0 5px 20px rgba(0,0,0,.08);

    

    --acento:#A678FF;
    --acento-rgb:166,120,255;

    

    --titulo:'Manrope','Poppins',sans-serif;

    --texto-fonte:'Manrope','Inter',sans-serif;

    

    --radius:18px;

    --radius-small:10px;

    --transition:.35s ease;

    

    --navbar-height:104px;

    --navbar-celula:91px;

}


/* ---- css/base/themes.css ---- */




[data-theme="escuro"]{

    --background:#0D0B1A;

    --surface:#171331;

    --surface-2:#1E1940;

    --texto:#EDEDF5;

    --texto-claro:#A8A3C0;

    --borda:#2A2550;

    --titulo-cor:var(--texto);

    --shadow:
        0 15px 40px rgba(0,0,0,.35);

    
}



[data-theme="invertido"]{

    --background:#1D173F;

    --surface:#2B2358;

    --surface-2:#332A66;

    --texto:#F5F3FF;

    --texto-claro:#C3B9EA;

    --borda:rgba(255,255,255,.14);

    --titulo-cor:var(--texto);

    --shadow:
        0 15px 40px rgba(0,0,0,.35);

    --bg-chrome:#FFFFFF;

    --texto-chrome:#1D173F;

    --texto-chrome-claro:#5B5480;

    --link-chrome:#7A4FDB;

    --link-chrome-hover:#1D173F;

    --borda-chrome:#E4E4E7;

    --chrome-hover-bg:rgba(0,0,0,.045);

    --sombra-chrome:0 5px 20px rgba(0,0,0,.1);

}



.logo-tema-invertido{
    display:none;
}

[data-theme="invertido"] .logo-tema-padrao{
    display:none;
}

[data-theme="invertido"] .logo-tema-invertido{
    display:block;
}


/* ===== Identidade aplicada (tema escuro): paleta roxa, degradê no topo, cabeçalho e rodapé ===== */

[data-theme="escuro"]{

    --background:#090712;

    --surface:#130F1E;

    --surface-2:#171326;

    --texto:#FFFFFF;

    --texto-claro:rgba(255,255,255,.68);

    --borda:rgba(255,255,255,.10);

    --bg-chrome:#100D20;

    --borda-chrome:rgba(255,255,255,.10);

    --texto-chrome:#FFFFFF;

    --texto-chrome-claro:rgba(255,255,255,.70);

    --link-chrome:#FFFFFF;

    --chrome-hover-bg:rgba(255,255,255,.06);

}

[data-theme="escuro"] .navbar{

    --bg-chrome:rgba(73,51,149,.92);

    --borda-chrome:rgba(255,255,255,.18);

}

[data-theme="escuro"] body:has(> header.navbar){

    background:
        linear-gradient(180deg,#493494 0,#402E86 80px,#3F2C86 190px,#322473 380px,#241A57 575px,#151136 770px,#090712 960px) top / 100% 960px no-repeat,
        #090712;

}

:root{

    --grad-destaque:linear-gradient(160deg,#A678FF 0%,#6B4FD6 48%,#3A2A8C 100%);

    --grad-cta:linear-gradient(110deg,#1F1842 0%,#44318B 42%,#8761DB 78%,#A274FA 100%);

    --grad-foto:linear-gradient(180deg,#9F73FA 0%,#7C58DE 40%,#4F39A5 78%,#2E226E 100%);

}


/* ---- css/base/typography.css ---- */
h1,
h2,
h3,
h4,
h5,
h6{

    font-family:var(--titulo);

    color:var(--titulo-cor);

    font-weight:700;

    overflow-wrap:break-word;

    word-break:break-word;

}

h1{

    font-size:3.5rem;

}

h2{

    font-size:2.5rem;

}

h3{

    font-size:1.6rem;

}

p{

    line-height:1.7;

    color:var(--texto-claro);

}

.section-title{

    margin-bottom:15px;

}

.section-subtitle{


    align-items:center;
}

.faq-section-subtitle{

    max-width:700px;
    margin:0 auto;

}

.serv-section-subtitle{

    max-width:200px;
    margin:0 auto;

}

/* ---- css/base/global.css ---- */
body{

    background:var(--background);

    color:var(--texto);

    font-family:var(--texto-fonte);

    transition:background-color .35s ease, color .35s ease;

}



.navbar,
.footer,
.sidebar,
.conta-drawer,
[class*="card"],
[class*="painel"],
section{

    transition:background-color .35s ease, color .35s ease, border-color .35s ease;

}

.container{

    width:min(1200px,92%);

    margin:auto;

}

section{

    padding:90px 0;

}

.grid-2{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:60px;

}

.grid-3{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.grid-4{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

}

.center{

    text-align:center;

}

.hidden{

    display:none;

}

/* ---- css/base/animations.css ---- */
.fade{

    animation:fade .25s ease-out;

}

@keyframes fade{

    from{

        opacity:0;

    }

    to{

        opacity:1;

    }

}

@media (prefers-reduced-motion: reduce){

    .fade{

        animation:none;

    }

}

@keyframes flutuar{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

    100%{

        transform:translateY(0);

    }

}

/* ---- css/base/responsive.css ---- */
@media(max-width:992px){

    .grid-2{

        grid-template-columns:1fr;

    }

    .grid-3{

        grid-template-columns:1fr;

    }

    .grid-4{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:700px){

    h1{

        font-size:2.5rem;

    }

    h2{

        font-size:2rem;

    }

    .grid-4{

        grid-template-columns:1fr;

    }

}

@media(max-width:400px){

    h1{

        font-size:2.1rem;

    }

    h2{

        font-size:1.7rem;

    }

}

/* ---- css/components/buttons.css ---- */
.btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:16px 34px;

    border-radius:50px;

    border:none;

    appearance:none;

    -webkit-appearance:none;

    background:var(--secundaria);

    color:white;

    font-weight:600;

    font-family:inherit;

    font-size:1rem;

    cursor:pointer;

    transition:var(--transition);

}

.btn:hover{

    transform:translateY(-3px);

    background:var(--secundaria-hover);

}

.btn-outline{

    background:none;

    border:2px solid var(--secundaria);

    color:var(--secundaria);

    appearance:none;

    -webkit-appearance:none;

    cursor:pointer;

    font-family:inherit;

    font-size:1rem;

}

.btn-outline:hover{

    color:white;

    background:var(--secundaria);

}

/* ---- css/components/navbar.css ---- */
/* ===== Cabeçalho (estrutura em células) — identidade LYXUS ===== */

.navbar{

    position:fixed;

    top:0;
    left:0;

    width:100%;

    z-index:1000;

    padding:8px clamp(8px,1.2vw,16px) 0;

    background:transparent;

    pointer-events:none;

}

.navbar-caixa{

    pointer-events:auto;

    display:grid;

    grid-template-columns:var(--navbar-celula) minmax(0,1fr) auto var(--navbar-celula);

    height:calc(var(--navbar-height) - 8px);

    background:var(--bg-chrome);

    border:1px solid var(--borda-chrome);

    border-radius:18px;

    overflow:hidden;

    box-shadow:var(--sombra-chrome);

    transition:box-shadow .3s ease, background-color .35s ease;

}

.navbar.scrolled .navbar-caixa{

    box-shadow:0 12px 34px rgba(0,0,0,.28);

    backdrop-filter:blur(14px);

}

/* célula genérica: separadas por linhas finas */

.navbar-celula{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    color:var(--link-chrome);

    font-weight:500;

    font-size:.9rem;

    white-space:nowrap;

    border:0;

    border-right:1px solid var(--borda-chrome);

    background:transparent;

    cursor:pointer;

    transition:background-color .25s ease, color .25s ease;

}

.navbar-celula:last-child{

    border-right:0;

}

.navbar-celula:hover{

    background:var(--chrome-hover-bg);

    color:var(--texto-chrome);

}

.navbar-celula:focus-visible,
.navbar-links a:focus-visible{

    outline:2px solid var(--acento);

    outline-offset:-3px;

}

/* logo (X) */

.navbar-logo{

    padding:0;

}

.navbar-logo img{

    width:34px;

    height:auto;

    object-fit:contain;

    transition:transform .35s ease;

}

.navbar-logo:hover img{

    transform:scale(1.08);

}

/* centro: links em cima, ações embaixo */

.navbar-centro{

    display:grid;

    grid-template-rows:1fr auto;

    min-width:0;

    border-right:1px solid var(--borda-chrome);

}

.navbar-links{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:clamp(18px,2.6vw,44px);

    padding:0 16px;

    min-height:52px;

}

.navbar-links a{

    position:relative;

    color:var(--texto-chrome-claro);

    font-weight:500;

    font-size:clamp(.85rem,.95vw,.95rem);

    white-space:nowrap;

    transition:color .25s ease;

}

.navbar-links a:hover,
.navbar-links a.ativo{

    color:var(--texto-chrome);

}

.navbar-links a.ativo::after{

    content:"";

    position:absolute;

    left:0;
    right:0;
    bottom:-6px;

    height:2px;

    border-radius:2px;

    background:var(--acento);

}

.navbar-acoes{

    display:grid;

    grid-template-columns:1fr 1fr;

    border-top:1px solid var(--borda-chrome);

    min-height:43px;

}

.navbar-acao i{

    font-size:1rem;

    line-height:1;

}

.cta-texto-curto{

    display:none;

}

/* conta + menu */

.navbar-conta{

    padding:0 clamp(18px,2vw,30px);

    min-width:120px;

}

.navbar-menu-btn{

    width:var(--navbar-celula);

}

.navbar-hamburguer{

    display:flex;

    flex-direction:column;

    gap:6px;

    width:30px;

}

.navbar-hamburguer span{

    display:block;

    height:2px;

    border-radius:2px;

    background:var(--texto-chrome);

    transition:transform .3s ease, width .3s ease;

}

.navbar-menu-btn:hover .navbar-hamburguer span:nth-child(2){

    width:70%;

    align-self:flex-end;

}

/* bloqueio de visitante (mantido) */

.bloqueado-visitante{

    opacity:.4;

    cursor:not-allowed;

    filter:grayscale(.4);

}

.aviso-visitante-toast{

    position:fixed;

    left:50%;

    bottom:24px;

    transform:translate(-50%,20px);

    display:flex;

    align-items:center;

    gap:10px;

    max-width:min(90vw,420px);

    background:var(--bg-chrome);

    color:var(--texto-chrome);

    border:1px solid var(--borda-chrome);

    border-radius:12px;

    padding:14px 18px;

    font-size:.9rem;

    box-shadow:0 15px 30px rgba(0,0,0,.3);

    opacity:0;

    z-index:2000;

    transition:.3s;

}

.aviso-visitante-toast i{

    color:#F79009;

    font-size:1.2rem;

    flex-shrink:0;

}

.aviso-visitante-toast.visivel{

    opacity:1;

    transform:translate(-50%,0);

}

/* ===== Responsivo ===== */

@media(max-width:760px){

    .navbar-caixa{

        grid-template-columns:var(--navbar-celula) minmax(0,1fr) var(--navbar-celula);

    }

    /* "Registre-se" sai da barra (continua no menu lateral) */

    .navbar-conta{

        display:none;

    }

    .navbar-links{

        gap:clamp(12px,3.4vw,22px);

        padding:0 10px;

    }

    .navbar-links a{

        font-size:.8rem;

    }

    .navbar-menu-btn{

        border-right:0;

    }

}

@media(max-width:480px){

    :root{

        --navbar-celula:54px;

    }

    .navbar{

        padding-left:6px;
        padding-right:6px;

    }

    .navbar-logo img{

        width:26px;

    }

    .navbar-links{

        gap:clamp(8px,2.6vw,14px);

        padding:0 6px;

        min-height:46px;

    }

    .navbar-links a{

        font-size:clamp(.66rem,3.3vw,.8rem);

    }

    .navbar-celula{

        font-size:clamp(.72rem,3.4vw,.85rem);

        gap:6px;

    }

    .navbar-hamburguer{

        width:24px;

        gap:5px;

    }

    .cta-texto-completo{

        display:none;

    }

    .cta-texto-curto{

        display:inline;

    }

}


/* ===== Botões globais (mantidos como estavam: este arquivo sobrescreve buttons.css) ===== */

.btn-outline{
    color: var(--link-chrome);
    font-weight:500;
    padding:14px clamp(12px,1.4vw,20px);
    border:2px solid var(--link-chrome);
    border-radius:10px;
    white-space:nowrap;
    transition:.3s;
}

.btn-outline:hover{
    background-color: var(--link-chrome);
    color:var(--bg-chrome);
}

.btn{
    color:#FFFFFF;
    background-color: var(--secundaria);
    font-weight:500;
    padding:14px clamp(16px,2vw,26px);
    border-radius:10px;
    white-space:nowrap;
    transition:.3s;
    display:inline-block;
}

.btn:hover{
    background-color: var(--secundaria-hover);
}


@media(max-width:350px){

    .navbar-links{

        gap:7px;

        padding:0 4px;

    }

}


/* ---- css/components/footer.css ---- */
/* ===== Rodapé em células, de ponta a ponta — identidade LYXUS ===== */

.footer{

    background:var(--bg-chrome);

    color:var(--texto-chrome);

    padding-top:0;

}

.footer-caixa{

    width:100%;

    border-top:1px solid var(--borda-chrome);

}

.footer-linha{

    display:grid;

    grid-template-columns:29fr 38fr 33fr;

}

.footer-celula{

    display:flex;

    align-items:center;

    min-width:0;

    padding:26px clamp(18px,2.2vw,36px);

    border-right:1px solid var(--borda-chrome);

}

.footer-celula:last-child{

    border-right:0;

}

.footer-marca{

    gap:12px;

    font-family:var(--titulo);

    font-weight:500;

    font-size:1.05rem;

    white-space:nowrap;

}

.footer-marca img{

    width:auto;

    height:auto;

    flex-shrink:0;

}

/* 2 colunas x 3 linhas, alinhadas */

.footer-links{

    display:grid;

    grid-auto-flow:column;

    grid-template-rows:repeat(3,auto);

    grid-template-columns:repeat(2,max-content);

    column-gap:clamp(28px,3.4vw,56px);

    row-gap:12px;

    font-size:.9rem;

}

.footer-links a,
.footer-email a{

    color:var(--link-chrome);

    white-space:nowrap;

    transition:color .25s ease;

}

.footer-links a:hover,
.footer-email a:hover{

    color:var(--texto-chrome);

}

.footer-email{

    font-size:1.1rem;

}

.footer-cnpj{

    justify-content:center;

    font-size:.8rem;

    color:var(--texto-chrome-claro);

    white-space:nowrap;

}

.footer-redes{

    justify-content:center;

    gap:12px;

}

.footer-redes a{

    display:flex;

    align-items:center;

    justify-content:center;

    width:44px;
    height:44px;

    flex-shrink:0;

    border:1px solid var(--borda-chrome);

    border-radius:50%;

    color:var(--link-chrome);

    font-size:1.1rem;

    transition:background-color .25s ease, color .25s ease;

}

.footer-redes a:hover{

    background:var(--chrome-hover-bg);

    color:var(--texto-chrome);

}

.footer-linha-copy{

    padding:22px clamp(18px,2.2vw,36px);

    border-top:1px solid var(--borda-chrome);

    font-size:.82rem;

    color:var(--texto-chrome-claro);

}

.footer-linha-2{

    grid-template-columns:1fr 1fr;

    border-top:1px solid var(--borda-chrome);

}

.footer-marca img{

    width:auto;

    height:30px;

    max-width:140px;

}

.footer-email a{

    font-weight:700;

    color:var(--texto-chrome);

}

/* ===== Barra legal (mantida como estava) ===== */

.footer-copy{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
    padding:26px clamp(20px,3vw,44px) 30px;
    margin-top:0;
    border-top:1px solid var(--borda-chrome);
    font-size:.85rem;
    color:var(--texto-chrome-claro);
}

.footer-legal{
    display:flex;
    flex-wrap:wrap;
    gap:8px 20px;
}

.footer-legal a{
    color:var(--texto-chrome-claro);
    transition:var(--transition);
}

.footer-legal a:hover{
    color:var(--secundaria);
}

/* ===== Responsivo ===== */

@media(max-width:1100px){

    .footer-linha{

        grid-template-columns:1fr 1fr;

    }

    .footer-celula{

        border-bottom:1px solid var(--borda-chrome);

    }

    .footer-celula:nth-child(2n){

        border-right:0;

    }

    .footer-redes{

        grid-column:1 / -1;

        justify-content:flex-start;

        border-right:0;

        border-bottom:0;

    }

}

@media(max-width:640px){

    .footer-linha{

        grid-template-columns:1fr;

    }

    .footer-celula{

        border-right:0;

    }

    .footer-cnpj{

        justify-content:flex-start;

    }

    .footer-email{

        font-size:1rem;

    }


}


/* ---- css/components/theme-switcher.css ---- */
.tema-switcher{

    display:flex;

    align-items:center;

    gap:4px;

    padding:4px;

    border-radius:30px;

    background:rgba(255,255,255,.08);

    border:1px solid var(--borda-chrome);

    flex-shrink:0;

}

[data-theme="invertido"] .tema-switcher{

    background:rgba(0,0,0,.04);

}

.tema-opcao{

    display:flex;

    align-items:center;

    justify-content:center;

    width:32px;

    height:32px;

    border-radius:50%;

    color:var(--texto-chrome-claro);

    font-size:1rem;

    transition:var(--transition);

    flex-shrink:0;

}

.tema-opcao:hover{

    color:var(--texto-chrome);

    background:rgba(255,255,255,.1);

}

[data-theme="invertido"] .tema-opcao:hover{

    background:rgba(0,0,0,.06);

}

.tema-opcao.ativo{

    background:var(--secundaria);

    color:#FFFFFF;

}


.sidebar .tema-switcher--bloco,
.sidebar-painel .tema-switcher--bloco,
.conta-drawer .tema-switcher--bloco{

    width:calc(100% - 48px);

    justify-content:center;

    margin:16px 24px;

}


/* ---- css/components/conta-drawer.css ---- */
.conta-drawer-overlay{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.5);

    opacity:0;

    pointer-events:none;

    transition:.3s;

    z-index:1999;

}

.conta-drawer-overlay.aberto{

    opacity:1;

    pointer-events:auto;

}

.conta-drawer{

    position:fixed;

    top:0;

    right:0;

    width:280px;

    max-width:82vw;

    height:100vh;

    background:var(--bg-chrome);

    z-index:2000;

    display:flex;

    flex-direction:column;

    transform:translateX(100%);

    transition:transform .3s ease;

    box-shadow:-10px 0 30px rgba(0,0,0,.25);

}

.conta-drawer.aberto{

    transform:translateX(0);

}

.conta-drawer-top{

    display:flex;

    flex-direction:column;

    gap:16px;

    padding:24px;

    border-bottom:1px solid var(--borda-chrome);

}

.conta-drawer-top-linha{

    display:flex;

    align-items:center;

    justify-content:space-between;

}

.conta-drawer-top img{

    height:30px;

}

.conta-drawer-fechar{

    width:34px;

    height:34px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--texto-chrome-claro);

    font-size:1.2rem;

    border-radius:8px;

    transition:var(--transition);

}

.conta-drawer-fechar:hover{

    background:var(--chrome-hover-bg);

    color:var(--texto-chrome);

}

.conta-drawer nav{

    flex:1;

    padding:18px 14px;

    overflow-y:auto;

}

.conta-drawer ul{

    list-style:none;

    display:flex;

    flex-direction:column;

    gap:4px;

}

.conta-drawer li a{

    display:flex;

    align-items:center;

    gap:12px;

    padding:12px 16px;

    border-radius:var(--radius-small);

    color:var(--texto-chrome-claro);

    font-weight:500;

    font-size:.92rem;

    transition:var(--transition);

}

.conta-drawer li a > span:first-child{

    display:inline-flex;

    align-items:center;

    gap:12px;

}

.conta-drawer li a i{

    font-size:1.15rem;

}

.conta-drawer li a:hover{

    background:var(--chrome-hover-bg);

    color:var(--texto-chrome);

}

.conta-drawer-saudacao{

    padding:6px 16px 14px;

    color:var(--texto-chrome);

    font-weight:600;

    font-family:var(--titulo);

}

.conta-drawer-titulo{

    margin-top:14px;

    padding:14px 16px 4px;

    color:var(--texto-chrome-claro);

    font-size:.72rem;

    text-transform:uppercase;

    letter-spacing:.5px;

    border-top:1px solid var(--borda-chrome);

}

.conta-drawer-sair{

    margin-top:auto;

    padding-top:14px;

    border-top:1px solid var(--borda-chrome);

}

.conta-drawer-sair a{

    color:#ff8a8a;

}

.conta-drawer-sair a:hover{

    color:#ff5c5c;

    background:rgba(255,90,90,.08);

}

.conta-drawer li a.bloqueado-visitante{

    justify-content:space-between;

}

.conta-drawer-tag-bloqueado{

    display:inline-flex;

    align-items:center;

    gap:4px;

    margin-left:auto;

    padding:2px 8px;

    border-radius:6px;

    font-size:.65rem;

    text-transform:uppercase;

    letter-spacing:.3px;

    background:rgba(247,144,9,.15);

    color:#F79009;

    white-space:nowrap;

}

.conta-drawer-tag-bloqueado i{

    font-size:.75rem;

}

/* ===== Identidade aplicada: menu lateral em cartão escuro ===== */

.conta-drawer{
    top:12px;
    right:12px;
    height:auto;
    max-height:calc(100vh - 24px);
    width:min(380px,calc(100vw - 24px));
    max-width:none;
    background:#100D20;
    border:1px solid rgba(255,255,255,.12);
    border-radius:24px;
    box-shadow:0 24px 70px rgba(0,0,0,.5);
    overflow:hidden;
    transform:translateX(calc(100% + 24px));
}

.conta-drawer.aberto{
    transform:translateX(0);
}

.conta-drawer-top{
    padding:22px 24px 10px;
    border-bottom:0;
}

.conta-drawer-top img{
    height:26px;
    width:auto;
}

.conta-drawer nav{
    padding:6px 18px 22px;
}

.conta-drawer ul{
    gap:0;
}

.conta-drawer li a{
    padding:13px 6px;
    color:#D9CCFF;
    font-weight:500;
    font-size:.98rem;
}

.conta-drawer li a i{
    display:none;
}

.conta-drawer li a:hover{
    background:transparent;
    color:#FFFFFF;
}

.conta-drawer li:first-child a{
    color:#FFFFFF;
    font-weight:700;
}

.conta-drawer li a.conta-drawer-cta{
    justify-content:center;
    margin:6px 0 4px;
    padding:15px 20px;
    border-radius:999px;
    background:#FFFFFF;
    color:#1D173F;
    font-weight:700;
}

.conta-drawer li a.conta-drawer-cta:hover{
    background:#FFFFFF;
    color:#1D173F;
    opacity:.9;
}

.conta-drawer-titulo{
    margin-top:18px;
    padding:10px 6px 6px;
    border-top:0;
    color:#A678FF;
    font-weight:700;
    font-size:.7rem;
    letter-spacing:.2em;
}

.conta-drawer-fechar i{
    display:block;
}


/* ---- css/components/cards.css ---- */
.badge{

    display:inline-block;

    background:var(--surface-2);

    color:var(--secundaria);

    padding:11px 26px;

    border-radius:30px;

    font-weight:700;

    font-size:1.05rem;

    letter-spacing:.5px;

    margin-bottom:20px;

}



#feedback-grid .card{

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.1);

    border-radius:var(--radius);

    padding:35px 30px;

    transition:var(--transition);

}

#feedback-grid .card:hover{

    transform:translateY(-6px);

    border-color:var(--acento);

    box-shadow:0 15px 40px rgba(var(--acento-rgb),.25);

}

#feedback-grid .card .stars{

    display:block;

    color:var(--acento);

    font-size:1.05rem;

    letter-spacing:3px;

    margin-bottom:18px;

}

#feedback-grid .card h3{

    color:#FFFFFF;

    font-size:1.15rem;

    margin-bottom:10px;

}

#feedback-grid .card p{

    color:#B9B4CE;

    font-size:.95rem;

    line-height:1.6;

}

/* ===== Time (Início e página Equipe) — parcial equipeGrade ===== */

.membros-grade{

    --painel:var(--surface-2);

    --cards-filtro:opacity(.3);

    display:grid;

    gap:14px;

}

[data-theme="escuro"] .membros-grade,
[data-theme="invertido"] .membros-grade{

    --painel:var(--surface);

    --cards-filtro:none;

}

.membro{

    position:relative;

    display:flex;

    flex-direction:column;

    overflow:hidden;

    border:1px solid var(--borda);

    border-radius:18px;

    background:var(--painel);

    isolation:isolate;

}

.membro-foto{

    display:flex;

    align-items:center;

    justify-content:center;

    aspect-ratio:4 / 5;

    font-size:.78rem;

    color:var(--texto-claro);

}

.membro-foto img{

    width:100%;
    height:100%;

    object-fit:cover;

}

.membro-info{

    display:flex;

    flex-direction:column;

    gap:3px;

    padding:16px;

    background:var(--background);

    font-size:.95rem;

    color:var(--texto);

}

.membro-info small{

    font-size:.82rem;

    color:var(--texto-claro);

}

/* página Equipe: 4 colunas */

.membros-grade--pagina{

    grid-template-columns:repeat(4,1fr);

}

/* Início: 6 cartões compactos, com o padrão de fundo */

.membros-grade--compacto{

    grid-template-columns:repeat(6,1fr);

}

.membros-grade--compacto .membro{

    min-height:240px;

    justify-content:flex-end;

}

.membros-grade--compacto .membro::before{

    content:"";

    position:absolute;

    inset:0;

    z-index:-2;

    background:url("/img/fundos/fundo-cubos.svg") center -40px / 420px auto no-repeat;

    filter:var(--cards-filtro);

}

.membros-grade--compacto .membro::after{

    content:"";

    position:absolute;

    inset:0;

    z-index:-1;

    background:linear-gradient(180deg,transparent 45%,var(--painel) 100%);

}

.membros-grade--compacto .membro-foto{

    position:absolute;

    inset:0;

    aspect-ratio:auto;

    z-index:-1;

    font-size:0;

}

.membros-grade--compacto .membro-info small{

    font-size:smaller;

}

.membros-grade--compacto .membro-info{

    padding:16px;

    background:transparent;

    font-size:.82rem;

}

@media(max-width:1000px){

    .membros-grade--compacto{

        grid-template-columns:repeat(3,1fr);

    }

}

@media(max-width:900px){

    .membros-grade--pagina{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:520px){

    .membros-grade--compacto{

        grid-template-columns:repeat(2,1fr);

    }

    .membros-grade--compacto .membro{

        min-height:200px;

    }

}

@media(max-width:380px){

    .membros-grade--pagina{

        grid-template-columns:1fr;

    }

}

/* Identidade aplicada: fotos e cartões em degradê roxo */

.membro-info{

    background:var(--surface);

}

.membros-grade--pagina .membro-foto{

    background:var(--grad-foto);

    color:rgba(255,255,255,.45);

}

.membros-grade--compacto .membro::before{

    background:var(--grad-foto);

    filter:none;

}

.membros-grade--compacto .membro::after{

    display:none;

}

.membros-grade--compacto .membro-info{

    color:#FFFFFF;

}

.membros-grade--compacto .membro-info small{

    color:rgba(255,255,255,.7);

}


/* ---- css/components/forms.css ---- */
form{

    width:100%;

}

.form-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:25px;

}

.form-actions{

    display:flex;

    gap:15px;

    margin-top:20px;

    flex-wrap:wrap;

}

@media(max-width:700px){

    .form-grid{

        grid-template-columns:1fr;

    }

}

/* ---- css/components/faq.css ---- */
.faq .badge{

    background:rgba(var(--acento-rgb),.15);

    color:var(--acento);

}



.faq-link-processo{

    color:var(--acento);

    font-weight:600;

}

.faq-link-processo:hover{

    text-decoration:underline;

}



.faq-layout{

    display:grid;

    grid-template-columns:1.15fr .85fr;

    gap:50px;

    align-items:center;

}

.faq-grid{

    display:flex;

    flex-direction:column;

    gap:22px;

}

.faq-bubble{

    position:relative;

    background:var(--surface);

    border:2px solid var(--borda);

    border-radius:26px;

    padding:26px 30px;

    cursor:pointer;

    transform:rotate(var(--rot,0deg)) translateY(var(--desloca-y,0px));

    animation:flutuarCaotico 5.5s ease-in-out infinite;

    animation-delay:var(--delay,0s);

    transition:border-color var(--transition), box-shadow var(--transition);

}

@keyframes flutuarCaotico{

    0%,100%{

        transform:rotate(var(--rot,0deg)) translateY(var(--desloca-y,0px));

    }

    50%{

        transform:rotate(calc(var(--rot,0deg) * -1)) translateY(calc(var(--desloca-y,0px) - 10px));

    }

}

.faq-bubble::after{

    content:"";

    position:absolute;

    bottom:-12px;

    left:38px;

    width:24px;

    height:24px;

    background:var(--surface);

    border-right:2px solid var(--borda);

    border-bottom:2px solid var(--borda);

    border-radius:0 0 6px 0;

    transform:rotate(45deg);

    transition:border-color var(--transition);

}

.faq-bubble:nth-child(even){

    animation-duration:6.5s;

}

.faq-bubble:hover{

    border-color:var(--acento);

}

.faq-bubble:hover::after{

    border-color:var(--acento);

}



.faq-bubble.aberto{

    animation-play-state:paused;

    transform:rotate(calc(var(--rot,0deg) * .4));

    border-color:var(--acento);

    box-shadow:0 15px 35px rgba(var(--acento-rgb),.2);

}

.faq-bubble.aberto::after{

    border-color:var(--acento);

}

.faq-pergunta{

    margin:0;

    font-family:var(--titulo);

    font-weight:700;

    color:var(--titulo-cor);

    line-height:1.4;

}

.faq-resposta{

    max-height:0;

    overflow:hidden;

    opacity:0;

    margin:0;

    color:var(--texto-claro);

    line-height:1.6;

    font-size:.95rem;

    transition:max-height .4s ease, opacity .3s ease, margin-top .4s ease;

}

.faq-bubble.aberto .faq-resposta{

    max-height:260px;

    opacity:1;

    margin-top:14px;

}



.faq-visual{

    position:relative;

    height:420px;

    border-radius:var(--radius);

    background:var(--surface-2);

    display:flex;

    align-items:center;

    justify-content:center;

    overflow:hidden;

}

.faq-visual-icone{

    width:140px;

    height:140px;

    border-radius:50%;

    background:linear-gradient(135deg,var(--primaria),var(--secundaria));

    color:#FFFFFF;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:3.2rem;

    box-shadow:var(--shadow);

    animation:flutuar 4s ease-in-out infinite;

    z-index:1;

}

.faq-visual-dot{

    position:absolute;

    border-radius:50%;

    background:var(--secundaria);

    opacity:.18;

}

.faq-visual .d1{ width:100px; height:100px; top:35px; left:45px; animation:flutuar 3.6s ease-in-out infinite; }

.faq-visual .d2{ width:56px; height:56px; bottom:55px; right:55px; animation:flutuar 4.3s ease-in-out infinite; }

.faq-visual .d3{ width:34px; height:34px; top:90px; right:40px; animation:flutuar 3s ease-in-out infinite; }



@media(max-width:900px){

    .faq-layout{

        grid-template-columns:1fr;

    }

    .faq-visual{

        height:220px;

        order:-1;

    }

}


/* ---- css/components/processo.css ---- */


.processo-tabs{

    display:flex;

    flex-wrap:wrap;

    justify-content:center;

    gap:12px;

    margin-bottom:50px;

}

.tab-btn{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:14px 26px;

    border-radius:50px;

    border:2px solid var(--borda);

    background:var(--surface);

    color:var(--texto-claro);

    font-family:var(--titulo);

    font-weight:600;

    font-size:.95rem;

    cursor:pointer;

    transition:var(--transition);

}

.tab-btn i{

    font-size:1.1rem;

}

.tab-btn:hover{

    border-color:var(--acento);

    color:var(--acento);

}

.tab-btn.ativo{

    background:var(--acento);

    border-color:var(--acento);

    color:#FFFFFF;

    box-shadow:0 10px 25px rgba(var(--acento-rgb),.3);

}

.processo .badge{

    background:rgba(var(--acento-rgb),.15);

    color:var(--acento);

}



.processo-info{

    max-width:760px;

    margin:0 auto;

    text-align:center;

}

#titulo-processo{

    margin-top:45px;

    margin-bottom:22px;

}

.processo-info .section-subtitle{

    margin:0 auto 45px;

}



.timeline{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));

    gap:34px 26px;

    text-align:left;

}

.etapa-balao{

    position:relative;

    background:var(--surface);

    border:2px solid var(--borda);

    border-radius:20px;

    padding:24px 22px 22px 26px;

    opacity:0;

    transition:border-color var(--transition), box-shadow var(--transition);

}

.etapa-balao.visivel{

    animation-name:entrarComMouse, flutuarBalao;

    animation-duration:.7s, 5s;

    animation-timing-function:ease, ease-in-out;

    animation-iteration-count:1, infinite;

    animation-fill-mode:forwards, none;

    animation-delay:var(--delay,0s), calc(var(--delay,0s) + .7s);

}

.etapa-balao:hover{

    border-color:var(--acento);

    box-shadow:0 15px 30px rgba(var(--acento-rgb),.15);

}

.etapa-cursor{

    position:absolute;

    left:-60px;

    top:50%;

    transform:translateY(-50%);

    font-size:1.5rem;

    color:var(--acento);

    opacity:0;

    pointer-events:none;

}

.etapa-balao.visivel .etapa-cursor{

    animation:cursorArrastar .7s ease forwards;

    animation-delay:var(--delay,0s);

}

@keyframes entrarComMouse{

    0%{ opacity:0; transform:translateX(-50px); }

    100%{ opacity:1; transform:translateX(0); }

}

@keyframes cursorArrastar{

    0%{ opacity:0; left:-90px; }

    45%{ opacity:1; left:-46px; }

    100%{ opacity:0; left:-10px; }

}

.etapa-numero{

    position:absolute;

    top:-18px;

    left:-14px;

    width:46px;

    height:46px;

    border-radius:50%;

    background:var(--acento);

    color:#FFFFFF;

    display:flex;

    align-items:center;

    justify-content:center;

    font-family:var(--titulo);

    font-weight:800;

    font-size:1.15rem;

    box-shadow:0 8px 20px rgba(var(--acento-rgb),.4);

    border:3px solid var(--surface);

}

.etapa-titulo{

    margin:0 0 8px;

    font-family:var(--titulo);

    font-weight:700;

    font-size:1.05rem;

    color:var(--titulo-cor);

}

.etapa-descricao{

    margin:0;

    font-size:.9rem;

    line-height:1.6;

    color:var(--texto-claro);

}

@keyframes flutuarBalao{

    0%,100%{ transform:translateY(0) rotate(0deg); }

    50%{ transform:translateY(-10px) rotate(.6deg); }

}



.nao-quebra{

    white-space:nowrap;

}

.servico-card{

    background:var(--surface);

    border:2px solid var(--borda);

    border-radius:var(--radius);

    padding:35px 25px;

    text-align:center;

    cursor:pointer;

    transition:var(--transition);

}

.servico-card:hover{

    border-color:var(--secundaria);

    transform:translateY(-6px);

}

.servico-card.ativo{

    border-color:var(--secundaria);

    background:var(--surface-2);

    box-shadow:var(--shadow);

}

.servico-card .icon{

    width:60px;

    height:60px;

    margin:0 auto 20px;

    border-radius:16px;

    background:var(--secundaria);

    color:#FFFFFF;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:1.6rem;

}

.servico-card h3{

    margin-bottom:8px;

}

.servico-card p{

    font-size:1.0rem;

    margin:0;
}




.transicao{

    position:fixed;

    inset:0;

    z-index:9999;

    background:var(--primaria);

    opacity:0;

    pointer-events:none;

    transition:opacity .7s ease;

}

.transicao.ativa{

    opacity:1;
    transition-duration:.35s;

}

.transicao-cena{

    position:absolute;

    inset:0;

    display:none;

    align-items:center;

    justify-content:center;

    overflow:hidden;

}

.transicao-cena.ativa{

    display:flex;

}



.cena-apps .cena-phone{

    width:130px;

    height:130px;

    border-radius:32px;

    background:var(--acento);

    color:#FFFFFF;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:3rem;

    animation:flutuar 2s ease-in-out infinite;

}

.cena-apps .cena-icon{

    position:absolute;

    width:64px;

    height:64px;

    border-radius:50%;

    background:#FFFFFF;

    color:var(--acento);

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:1.6rem;

    animation:flutuar 1.8s ease-in-out infinite;

}

.cena-apps .ci1{ top:22%; left:32%; }

.cena-apps .ci2{ bottom:26%; left:28%; animation-delay:.2s; }

.cena-apps .ci3{ top:26%; right:30%; animation-delay:.4s; }

.cena-apps .ci4{ bottom:24%; right:32%; animation-delay:.6s; }



.cena-sites canvas{

    width:100%;

    height:100%;

    display:block;

}



.cena-codigo{

    position:absolute;

    bottom:12%;

    left:50%;

    transform:translate(-50%,10px);

    background:rgba(0,0,0,.35);

    border:1px solid rgba(var(--acento-rgb),.45);

    border-radius:16px;

    padding:20px 30px;

    font-family:monospace;

    font-size:1.3rem;

    color:var(--acento);

    text-align:left;

    opacity:0;

    animation:blocoFade 1.4s ease forwards;

}

.cena-codigo .linha{

    opacity:0;

    animation:linhaFade .4s ease forwards;

}

.cena-codigo .linha:nth-child(1){ animation-delay:.15s; }

.cena-codigo .linha-passo{ animation-delay:.55s; color:#FFFFFF; }

.cena-codigo .linha:nth-child(3){ animation-delay:.95s; }

@keyframes blocoFade{
    0%{ opacity:0; transform:translate(-50%,10px); }
    35%,100%{ opacity:1; transform:translate(-50%,0); }
}

@keyframes linhaFade{

    from{ opacity:0; }

    to{ opacity:1; }

}



.cena-design .cena-shape{

    position:absolute;

    width:90px;

    height:90px;

    border-radius:20px;

    background:var(--acento);

    box-shadow:0 20px 50px rgba(var(--acento-rgb),.5);

    animation:arrastarForma 1.4s ease-in-out infinite alternate;

}

.cena-design .cena-cursor{

    position:absolute;

    font-size:2.4rem;

    color:#FFFFFF;

    animation:arrastarCursor 1.4s ease-in-out infinite alternate;

}

@keyframes arrastarForma{
    0%{ left:35%; top:35%; }
    100%{ left:55%; top:55%; }
}

@keyframes arrastarCursor{
    0%{ left:37%; top:38%; }
    100%{ left:57%; top:58%; }
}



.cena-marketing{

    flex-direction:column;

    gap:30px;

}

.cena-bars{

    display:flex;

    align-items:flex-end;

    gap:18px;

    height:220px;

}

.cena-bars span{

    width:30px;

    border-radius:8px 8px 0 0;

    background:linear-gradient(180deg,var(--acento),var(--primaria));

    transform-origin:bottom;

    animation:crescerBarra 1.2s ease-in-out infinite;

}

.cena-bars span:nth-child(1){ height:35%; animation-delay:0s; }

.cena-bars span:nth-child(2){ height:60%; animation-delay:.1s; }

.cena-bars span:nth-child(3){ height:45%; animation-delay:.2s; }

.cena-bars span:nth-child(4){ height:90%; animation-delay:.3s; }

.cena-bars span:nth-child(5){ height:70%; animation-delay:.4s; }

@keyframes crescerBarra{

    0%,100%{ transform:scaleY(.8); }

    50%{ transform:scaleY(1); }

}

.cena-arrow{

    font-size:3rem;

    color:#FFFFFF;

    animation:flutuar 1.6s ease-in-out infinite;

}



@media(max-width:600px){

    .timeline{

        grid-template-columns:1fr;

    }

}


/* ===== Cenas novas: Social Media e YouTube ===== */

.cena-social .feed-card{
    width:260px;
    padding:16px;
    border-radius:24px;
    background:#FFFFFF;
    display:flex;
    flex-direction:column;
    gap:12px;
    box-shadow:0 24px 60px rgba(0,0,0,.35);
    animation:flutuar 2.2s ease-in-out infinite;
}

.cena-social .feed-topo{
    display:flex;
    align-items:center;
    gap:10px;
}

.cena-social .feed-avatar{
    width:36px;
    height:36px;
    border-radius:50%;
    background:var(--acento);
}

.cena-social .feed-linhas{
    flex:1;
    display:flex;
    flex-direction:column;
    gap:6px;
}

.cena-social .feed-linhas i{
    display:block;
    height:8px;
    border-radius:4px;
    background:#E4E1F2;
}

.cena-social .feed-linhas i:last-child{
    width:60%;
}

.cena-social .feed-imagem{
    height:150px;
    border-radius:16px;
    background:linear-gradient(135deg,var(--acento),var(--primaria));
}

.cena-social .feed-acoes{
    display:flex;
    gap:16px;
    font-size:1.4rem;
    color:#9A96B5;
}

.cena-social .feed-acoes .ri-heart-3-fill{
    color:var(--acento);
    animation:pulsarIcone .9s ease-in-out infinite;
}

.cena-social .feed-like{
    position:absolute;
    bottom:46%;
    font-size:1.7rem;
    color:var(--acento);
    opacity:0;
    animation:subirLike 1.6s ease-out infinite;
}

.cena-social .fl1{ left:calc(50% + 120px); animation-delay:0s; }
.cena-social .fl2{ left:calc(50% + 165px); animation-delay:.4s; font-size:1.3rem; }
.cena-social .fl3{ left:calc(50% + 140px); animation-delay:.8s; font-size:2rem; }
.cena-social .fl4{ left:calc(50% + 185px); animation-delay:1.1s; color:#FFFFFF; }

@keyframes subirLike{
    0%{ opacity:0; transform:translateY(0) scale(.6); }
    20%{ opacity:1; }
    100%{ opacity:0; transform:translateY(-150px) scale(1.15); }
}

@keyframes pulsarIcone{
    0%,100%{ transform:scale(1); }
    50%{ transform:scale(1.25); }
}

.cena-youtube{
    flex-direction:column;
    gap:18px;
}

.cena-youtube .player-tela{
    position:relative;
    width:min(380px,70vw);
    aspect-ratio:16 / 9;
    border-radius:20px;
    background:linear-gradient(135deg,#2A2250,var(--primaria));
    border:1px solid rgba(var(--acento-rgb),.5);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 24px 60px rgba(0,0,0,.35);
    animation:flutuar 2.2s ease-in-out infinite;
}

.cena-youtube .player-play{
    width:84px;
    height:60px;
    border-radius:18px;
    background:var(--acento);
    color:#FFFFFF;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:2.3rem;
    animation:pulsarIcone 1s ease-in-out infinite;
}

.cena-youtube .player-cursor{
    position:absolute;
    right:30%;
    bottom:22%;
    font-size:2rem;
    color:#FFFFFF;
    animation:clicarPlay 1.4s ease-in-out infinite;
}

@keyframes clicarPlay{
    0%,100%{ transform:translate(30px,30px); }
    45%{ transform:translate(0,0); }
    60%{ transform:translate(0,0) scale(.85); }
}

.cena-youtube .player-barra{
    width:min(380px,70vw);
    height:6px;
    border-radius:6px;
    background:rgba(255,255,255,.2);
    overflow:hidden;
}

.cena-youtube .player-barra span{
    display:block;
    height:100%;
    width:0;
    background:var(--acento);
    animation:encherBarra 2s ease-in-out forwards;
}

@keyframes encherBarra{
    0%{ width:0; }
    100%{ width:100%; }
}

/* ===== Chegada de uma transição: a página já nasce coberta pela cena ===== */
html.cena-chegando{
    background:var(--primaria);
}
html.cena-chegando body{
    visibility:hidden;
}
html.cena-chegando .transicao{
    visibility:visible;
    opacity:1;
    transition:none;
}
html[data-cena-chegando="apps"] .cena-apps,
html[data-cena-chegando="sites"] .cena-sites,
html[data-cena-chegando="design"] .cena-design,
html[data-cena-chegando="social"] .cena-social,
html[data-cena-chegando="marketing"] .cena-marketing,
html[data-cena-chegando="youtube"] .cena-youtube{
    display:flex;
}

/* a página que chega de uma transição não faz o "fade" do body (a cena está dentro do body e piscaria) */
html[data-sem-fade] body.fade{
    animation:none;
}


/* ---- css/components/feedback.css ---- */
.feedback-layout{

    display:grid;

    grid-template-columns:.85fr 1.15fr;

    gap:60px;

    align-items:center;

}

.feedback-info .section-title{

    color:#FFFFFF;

}

.feedback-info .section-subtitle{

    color:#B9B4CE;

    margin:0;

}

.feedback-info .badge{

    background:rgba(var(--acento-rgb),.15);

    color:var(--acento);

}



.feedback-filtros{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-top:24px;

}

.feedback-filtro{

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.14);

    color:#B9B4CE;

    padding:9px 18px;

    border-radius:30px;

    font-size:.85rem;

    font-weight:600;

    cursor:pointer;

    transition:var(--transition);

}

.feedback-filtro:hover{

    border-color:var(--acento);

    color:#FFFFFF;

}

.feedback-filtro.ativo{

    background:var(--acento);

    border-color:var(--acento);

    color:#FFFFFF;

}

.feedback-filtros-area{

    margin-top:24px;

    margin-bottom:2px;

    gap:8px;

}

.feedback-filtros-area .feedback-filtro{

    padding:7px 14px;

    font-size:.8rem;

}



.feedback-filtros-area.filtro-area-quebrado [data-feedback-area="todas"]{

    flex:1 1 100%;

}

.feedback-filtros:not(.feedback-filtros-area){

    margin-top:12px;

}



.feedback-card-topo{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:10px;

    margin-bottom:18px;

}

#feedback-grid .card .feedback-card-topo .stars{

    margin-bottom:0;

}

.feedback-tag{

    flex-shrink:0;

    background:rgba(var(--acento-rgb),.12);

    color:var(--tag-cor, var(--acento));

    border:1px solid var(--tag-cor, var(--acento));

    padding:3px 12px;

    border-radius:20px;

    font-size:.72rem;

    font-weight:600;

    white-space:nowrap;

}

.feedback-vazio{

    color:#B9B4CE;

    padding:20px 0;

}



.feedback-info{

    min-width:0;

}

.feedback-carousel{

    width:100%;
    min-width:0;

}

.feedback-track{

    display:flex;

    gap:22px;

    overflow-x:auto;

    scrollbar-width:none;

    padding-bottom:6px;

}

.feedback-track::-webkit-scrollbar{

    display:none;

}

.feedback-track .card{

    flex:0 0 62%;

}

@media(max-width:768px){

    .feedback-track .card{

        flex:0 0 80%;

    }

}



.feedback-scrub{

    position:relative;

    height:3px;

    border-radius:3px;

    background:rgba(255,255,255,.12);

    margin-top:22px;

    cursor:pointer;

    user-select:none;

}

.feedback-scrub-fill{

    position:absolute;

    top:0;

    left:0;

    height:100%;

    width:40%;

    border-radius:3px;

    background:var(--acento);

    transition:width .1s linear;

}



@media(max-width:992px){

    .feedback-layout{

        grid-template-columns:1fr;

        gap:35px;

    }

}

/* ---- css/components/categoria-icone.css ---- */


.categoria-visual-icone,
.categoria-visual-img{

    display:inline-block;

    vertical-align:middle;

    object-fit:cover;

    border-radius:50%;

}



.badge .categoria-visual-icone,
.badge .categoria-visual-img,
.post-card-categoria .categoria-visual-icone,
.post-card-categoria .categoria-visual-img{

    margin-right:2px;

}

.blog-sidebar-bloco a{

    display:inline-flex;

    align-items:center;

    gap:8px;

}



.categoria-visual-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:32px;

    height:32px;

    border-radius:50%;

    flex-shrink:0;

}

.categoria-visual-badge-grande{

    width:56px;

    height:56px;

    margin-right:14px;

}

.blog-hero-categoria-titulo{

    display:flex;

    align-items:center;

}



.categoria-icone-picker{

    display:flex;

    align-items:center;

    gap:12px;

}

.categoria-icone-picker input[type="text"]{

    flex:1;

}

.categoria-icone-preview{

    display:flex;

    align-items:center;

    justify-content:center;

    width:48px;

    height:48px;

    flex-shrink:0;

    border-radius:var(--radius-small);

    border:2px solid var(--borda);

    font-size:1.4rem;

    color:var(--secundaria);

}

.campo-ajuda{

    color:var(--texto-claro);

    font-size:.8rem;

    line-height:1.4;

}

.campo-ajuda a{

    color:var(--secundaria);

    text-decoration:underline;

}

.categoria-imagem-preview{

    width:80px;

    height:80px;

    margin-top:6px;

    border-radius:var(--radius-small);

    object-fit:cover;

    border:2px solid var(--borda);

}

.categoria-icone-modal{

    max-width:560px;

}

.categoria-icone-busca{

    width:100%;

    padding:12px 16px;

    border:2px solid var(--borda);

    border-radius:var(--radius-small);

    font-family:var(--texto-fonte);

    font-size:.9rem;

    margin:14px 0 18px;

}

.categoria-icone-busca:focus{

    outline:none;

    border-color:var(--secundaria);

}

.categoria-icone-grid{

    display:grid;

    grid-template-columns:repeat(auto-fill,minmax(48px,1fr));

    gap:8px;

    max-height:320px;

    overflow-y:auto;

}

.categoria-icone-item{

    display:flex;

    align-items:center;

    justify-content:center;

    width:48px;

    height:48px;

    border-radius:var(--radius-small);

    border:2px solid var(--borda);

    background:var(--surface);

    color:var(--texto);

    font-size:1.3rem;

    cursor:pointer;

    transition:var(--transition);

}

.categoria-icone-item:hover{

    border-color:var(--secundaria);

    color:var(--secundaria);

    background:var(--surface-2);

}

.categoria-icone-vazio{

    grid-column:1 / -1;

    text-align:center;

    color:var(--texto-claro);

    font-size:.88rem;

    padding:20px 0;

}


/* ---- css/components/cookie-banner.css ---- */
    

.cookie-banner{

    position:fixed;

    left:20px;

    right:20px;

    bottom:20px;

    z-index:3000;

    max-width:920px;

    margin:0 auto;

    background:var(--surface);

    border:1px solid var(--borda);

    border-radius:var(--radius);

    box-shadow:var(--shadow);

    padding:22px 26px;

    display:flex;

    flex-wrap:wrap;

    align-items:center;

    gap:18px;

    justify-content:space-between;

    animation:cookieBannerEntrar .4s ease;

}

@keyframes cookieBannerEntrar{

    from{

        opacity:0;

        transform:translateY(16px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

.cookie-banner-texto{

    flex:1 1 420px;

}

.cookie-banner-texto p{

    margin:0;

    color:var(--texto);

    font-size:.88rem;

    line-height:1.6;

}

.cookie-banner-texto a{

    color:var(--secundaria);

    font-weight:600;

    text-decoration:underline;

}

.cookie-banner-acoes{

    display:flex;

    gap:12px;

    flex-shrink:0;

}

.cookie-banner-acoes .btn,
.cookie-banner-acoes .btn-outline{

    padding:11px 22px;

    font-size:.88rem;

    white-space:nowrap;

}

@media (max-width:640px){

    .cookie-banner{

        left:12px;

        right:12px;

        bottom:12px;

        padding:18px;

        flex-direction:column;

        align-items:stretch;

    }

    .cookie-banner-texto{

        flex:0 0 auto;

    }

    .cookie-banner-acoes{

        justify-content:stretch;

    }

    .cookie-banner-acoes .btn,
    .cookie-banner-acoes .btn-outline{

        flex:1;

        text-align:center;

    }

}
