/* Paleta */
:root {
    --c-primary-900: #03588C; /* azul escuro */
    --c-primary-700: #0388A6; /* azul médio */
    --c-accent: #f39333;      /* laranja */
    --c-neutral-700: #8C7D7E; /* cinza quente */

    --body-900: #0f1418;
    --body-800: #171c21;
    --body-700: #1d242b;
    --text-100: #e7edf3;
    --text-200: #cfd7df;
    --text-300: #b6c0ca;
    --text-400: #9aa6b2;
    --text-500: #7e8994;
    --text-600: #62707c;
    --text-700: #4b5763;
    --text-800: #37424d;
}

html, body {
    font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    background-color: var(--body-900);
    color: var(--text-100);
}

.bg-primary-900 { background-color: var(--c-primary-900) !important; }
.bg-body-900 { background-color: var(--body-900) !important; }
.bg-body-800 { background-color: var(--body-800) !important; }
.border-secondary-800 { border-color: #28303a !important; }
.border-secondary-700 { border-color: #313b46 !important; }

.text-secondary-200 { color: var(--text-200) !important; }
.text-secondary-300 { color: var(--text-300) !important; }
.text-secondary-400 { color: var(--text-400) !important; }
.text-secondary-500 { color: var(--text-500) !important; }

.text-accent { color: var(--c-accent) !important; }
.bg-accent { background-color: var(--c-accent) !important; }
.btn-accent { background-color: var(--c-accent); color: #1b1b1b; border: none; }
.btn-accent:hover { background-color: #ffa24f; color: #111; }
.btn-outline-accent { border: 1px solid var(--c-accent); color: var(--c-accent); }
.btn-outline-accent:hover { background-color: var(--c-accent); color: #1b1b1b; }
.text-bg-accent-soft { background-color: rgba(243, 147, 51, .15); color: var(--c-accent); }

.fw-extrabold { font-weight: 800; }
.lh-tight { line-height: 1.1; }
.pt-7 { padding-top: 6.5rem !important; }
.py-6 { padding-top: 4.5rem !important; padding-bottom: 4.5rem !important; }

/* Marca simples com referência a marcenaria (encaixe) */
.brand-mark {
    width: 26px; height: 26px;
    background: linear-gradient(135deg, #f0d7b1 0%, #b89a72 100%);
    position: relative;
    box-shadow: inset 0 0 0 2px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.25);
}
.brand-mark::after {
    content: '';
    position: absolute; inset: 5px 5px auto auto; width: 8px; height: 8px;
    background: rgba(0,0,0,.15);
    transform: rotate(45deg);
}

/* Navbar shrink ao rolar */
.navbar {
    transition: all .25s ease;
}
.navbar.shrink { padding-top: .25rem; padding-bottom: .25rem; background-color: var(--c-primary-900) !important; }
.navbar .nav-link { color: var(--text-200); }
.navbar .nav-link.active, .navbar .nav-link:hover { color: #fff; }

/* Hero com textura que remete a madeira */
.hero {
    background: radial-gradient(80% 80% at 10% 10%, rgba(3,136,166,.25) 0%, rgba(3,88,140,.15) 40%, transparent 70%),
                linear-gradient(180deg, rgba(3,88,140,.18) 0%, rgba(3,88,140,0) 50%);
}
.hero-wood-detail {
    position: absolute; inset: 0; pointer-events: none;
    background-image: linear-gradient(90deg, rgba(0,0,0,.05) 1px, transparent 1px),
                      repeating-linear-gradient(180deg, rgba(184,154,114,.06) 0, rgba(184,154,114,.06) 6px, rgba(0,0,0,0) 6px, rgba(0,0,0,0) 12px);
    background-size: 24px 100%, 100% 12px;
    opacity: .35;
    mask-image: radial-gradient(60% 40% at 0% 0%, black 30%, transparent 70%);
}
.hero .badge { letter-spacing: .2px; }
.hero .hero-card { backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.08); }
.bg-glass { background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); }

/* Cards e elementos */
.feature-card { background: var(--body-800); border: 1px solid #2a323c; }
.quote-card { background: var(--body-800); border: 1px solid #2a323c; }
.avatar { width: 36px; height: 36px; border-radius: 50%; background: #24313d; display: grid; place-items: center; font-weight: 700; color: var(--text-300); }

/* Interações modernas */
.feature-card { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.feature-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,0,0,.35); border-color: rgba(3,136,166,.35); }
.pcp-icon { transition: transform .25s ease, background .25s ease; }
.feature-card:hover .pcp-icon { transform: scale(1.06); background: rgba(243,147,51,.15); }

/* Módulos PCP */
.pcp-item .pcp-icon {
    width: 40px; height: 40px; flex: 0 0 40px;
    border-radius: 10px; display: grid; place-items: center;
    background: rgba(3,136,166,.12); color: var(--c-accent);
}
.furniture-panel { background: linear-gradient(180deg, #1b232b, #171c21); border: 1px solid #2a323c; }
.wood-inlay { background-image: linear-gradient(90deg, rgba(184,154,114,.12) 1px, rgba(0,0,0,0) 1px), linear-gradient(0deg, rgba(184,154,114,.05) 1px, rgba(0,0,0,0) 1px); background-size: 24px 100%, 100% 16px; }

/* Indústrias tiles com borda chanfrada que lembra chapa/plano de corte */
.industry-tile {
    background: var(--body-800);
    border: 1px solid #2a323c;
    padding: 1rem; text-align: center; border-radius: 12px;
    position: relative; color: var(--text-200); font-weight: 600;
}
.industry-tile::after {
    content: '';
    position: absolute; inset: 0; border-radius: 12px;
    padding: 1px; background: linear-gradient(135deg, rgba(3,136,166,.3), rgba(243,147,51,.3));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
}

/* Footer links */
a.link-secondary { color: var(--text-400); text-decoration: none; }
a.link-secondary:hover { color: #fff; }

/* WhatsApp floating button */
.whatsapp-float {
    position: fixed; right: 18px; bottom: 18px; z-index: 1050;
    width: 56px; height: 56px; display: grid; place-items: center;
    background: #25D366; color: #0d0f11; border-radius: 50%;
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.whatsapp-float:hover { filter: brightness(1.1); }

/* Reveal on scroll */
[data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity .5s ease, transform .6s ease; }
[data-reveal].revealed { opacity: 1; transform: translateY(0); }

/* Utilidades */
.border-0 { border: 0 !important; }
.rounded-4 { border-radius: 1rem !important; }

/* Depoimentos: fonte branca */
#depoimentos .quote-card p { color: #fff; }
#depoimentos .badge { color: #fff !important; }

/* Logo tamanho consistente */
.brand-logo { display: inline-block; height: 28px; width: auto; }

/* Planos */
#planos .card { border: 1px solid #2a323c; background: var(--body-800); }
#planos .card h3 { color: #fff; }
#planos .card ul li { color: var(--text-200); }
#planos .badge { border: 1px solid rgba(243,147,51,.35); }
#planos .card .bi-check-circle { vertical-align: -2px; }

/* FAQ acordeão (tema escuro) */
#faq .accordion-button {
    background: var(--body-800);
    color: var(--text-100);
    border: 1px solid #2a323c;
}
#faq .accordion-button:not(.collapsed) {
    color: #fff; background: #1d242b; box-shadow: inset 0 -1px 0 rgba(255,255,255,.05);
}
#faq .accordion-item { background: var(--body-800); border: 1px solid #2a323c; }
#faq .accordion-body { color: var(--text-200); }

/* Acordeões em seções escuras (sobre/descricao) */
#sobre .accordion-button {
    background: var(--body-800);
    color: var(--text-100);
    border: 1px solid #2a323c;
}
#sobre .accordion-button:not(.collapsed) {
    color: #fff; background: #1d242b; box-shadow: inset 0 -1px 0 rgba(255,255,255,.05);
}
#sobre .accordion-item { background: var(--body-800); border: 1px solid #2a323c; }
#sobre .accordion-body { color: var(--text-200); }

/* Tabela comparativa (tema escuro) */
.compare-table thead th {
    background: #1d242b;
    color: var(--text-200);
    border-color: #2a323c;
}
.compare-table tbody td {
    border-color: #2a323c;
}
.compare-table tbody td:nth-child(3) {
    background: rgba(243,147,51,.08);
    color: var(--text-100);
}
.compare-table .bi-check-circle { color: var(--c-accent); }
.compare-table .bi-x-circle { color: var(--text-600); }

/* Footer moderno */
.footer .footer-social { width: 36px; height: 36px; display: grid; place-items: center; }
.footer .link-secondary { text-decoration: none; }
.footer .link-secondary:hover { color: #fff; }

/* Chips de filtro (Integrações) */
.filter-chips { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.filter-chip { border: 1px solid #2a323c; color: var(--text-200); background: var(--body-800); padding: .4rem .8rem; border-radius: 999px; font-size: .9rem; cursor: pointer; transition: all .2s ease; }
.filter-chip:hover { border-color: rgba(243,147,51,.6); color: #fff; }
.filter-chip.active { background: rgba(243,147,51,.18); border-color: var(--c-accent); color: #fff; }

/* Integrações: títulos e ícones em laranja (accent) */
#integrationGrid .feature-card h3 { color: var(--c-accent); }
#integrationGrid .pcp-icon, #integrationGrid .pcp-icon i { color: var(--c-accent); }

/* Soluções: títulos e ícones em laranja */
#solutionsGrid .feature-card h3 { color: var(--c-accent); }
#solutionsGrid .pcp-icon, #solutionsGrid .pcp-icon i { color: var(--c-accent); }


/* ERP Pequenas Indústrias: acordeão com cores do tema */
#conteudo-peq .accordion-button {
    background: var(--body-800);
    color: var(--text-100);
    border: 1px solid #2a323c;
}
#conteudo-peq .accordion-button:not(.collapsed) {
    color: #fff;
    background: var(--body-700);
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.05);
}
#conteudo-peq .accordion-item {
    background: var(--body-800);
    border: 1px solid #2a323c;
}
#conteudo-peq .accordion-body {
    background: var(--body-800);
    color: var(--text-200);
    border-top: none;
}

/* Sistema PCP: títulos em laranja */
#beneficios .feature-card h3 { color: var(--c-accent); }
#funcionalidades .accordion-button { color: var(--c-accent); }
#funcionalidades .accordion-button:not(.collapsed) { color: var(--c-accent); }

/* Sistema PCP: acordeão com cores do tema escuro */
#funcionalidades .accordion-button {
    background: var(--body-800);
    border: 1px solid #2a323c;
}
#funcionalidades .accordion-button:not(.collapsed) {
    background: var(--body-700);
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.05);
}
#funcionalidades .accordion-item { background: var(--body-800); border: 1px solid #2a323c; }
#funcionalidades .accordion-body { color: var(--text-200); }

/* Sistema PCP: tabelas com tema escuro */
#sobre-pcp table thead th {
    background: #1d242b;
    color: var(--text-200);
    border-color: #2a323c;
}
#sobre-pcp table tbody td {
    color: var(--text-200);
    border-color: #2a323c;
}

/* ERP Pequenas Indústrias: tabelas com tema escuro */
#conteudo-peq table thead th {
    background: #1d242b;
    color: var(--text-200);
    border-color: #2a323c;
}
#conteudo-peq table tbody td {
    color: var(--text-200);
    border-color: #2a323c;
}

/* Loja de Móveis: acordeão e tabelas com cores do tema */
#sobre-loja .accordion-button {
    background: var(--body-800);
    color: var(--text-100);
    border: 1px solid #2a323c;
}
#sobre-loja .accordion-button:not(.collapsed) {
    background: var(--body-700);
    color: #fff;
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.05);
}
#sobre-loja .accordion-item { background: var(--body-800); border: 1px solid #2a323c; }
#sobre-loja .accordion-body { color: var(--text-200); }

#sobre-loja table thead th {
    background: #1d242b;
    color: var(--text-200);
    border-color: #2a323c;
}
#sobre-loja table tbody td {
    color: var(--text-200);
    border-color: #2a323c;
}

/* Controle de OS: acordeão e tabelas com cores do tema */
#conteudo-os .accordion-button {
    background: var(--body-800);
    color: var(--text-100);
    border: 1px solid #2a323c;
}
#conteudo-os .accordion-button:not(.collapsed) {
    background: var(--body-700);
    color: #fff;
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.05);
}
#conteudo-os .accordion-item { background: var(--body-800); border: 1px solid #2a323c; }
#conteudo-os .accordion-body { color: var(--text-200); }

#conteudo-os table thead th {
    background: #1d242b;
    color: var(--text-200);
    border-color: #2a323c;
}
#conteudo-os table tbody td {
    color: var(--text-200);
    border-color: #2a323c;
}

