/* Tokens semânticos: as cores literais da marca/ilustrações não são invertidas. */
:root {
    color-scheme: light;
    --page-bg: #ffffff;
    --surface: #ffffff;
    --surface-alt: #f8fafc;
    --surface-raised: #ffffff;
    --text-main: #0f172a;
    --text-body: #334155;
    --text-muted: #586579;
    --text-accent: #6330cd;
    --accent-hover: #4a1db5;
    --accent-soft: #f1ebff;
    --border: #d7deea;
    --border-control: #77859b;
    --positive: #166534;
    --positive-bg: #f0f9f3;
    --positive-border: #b9d6c4;
    --focus-ring: #6d28d9;
    --bar: #8a61c9;
    --bar-peak: #6330cd;
    --nav-surface: rgba(255, 255, 255, .98);
    --hero-wash: rgba(139, 92, 246, .10);
    --card-shadow: 0 16px 45px -24px rgba(15, 23, 42, .2);
    --cta-from: #6230cc;
    --cta-to: #7441d5;
    --on-dark: #ffffff;
    --on-dark-muted: #e2e8f0;
    --on-dark-accent: #ddd6fe;
}

/* Fallback sem JavaScript: somente tokens, sem controles inoperantes. */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        color-scheme: dark;
        --page-bg: #0b1020; --surface: #131c30; --surface-alt: #10182a;
        --surface-raised: #1b2640; --text-main: #f1f5f9; --text-body: #d4deed;
        --text-muted: #aebcd0; --text-accent: #c4b5fd; --accent-hover: #e2d9ff;
        --accent-soft: #292340; --border: #34425a; --border-control: #8797b0;
        --positive: #86efac; --positive-bg: #102a23; --positive-border: #31574a;
        --focus-ring: #c4b5fd; --bar: #a78bfa; --bar-peak: #ddd6fe;
        --nav-surface: rgba(19, 28, 48, .98); --hero-wash: rgba(139, 92, 246, .12);
        --card-shadow: 0 16px 45px -24px rgba(0, 0, 0, .6);
    }
}
:root[data-theme="dark"] {
    color-scheme: dark;
    --page-bg: #0b1020; --surface: #131c30; --surface-alt: #10182a;
    --surface-raised: #1b2640; --text-main: #f1f5f9; --text-body: #d4deed;
    --text-muted: #aebcd0; --text-accent: #c4b5fd; --accent-hover: #e2d9ff;
    --accent-soft: #292340; --border: #34425a; --border-control: #8797b0;
    --positive: #86efac; --positive-bg: #102a23; --positive-border: #31574a;
    --focus-ring: #c4b5fd; --bar: #a78bfa; --bar-peak: #ddd6fe;
    --nav-surface: rgba(19, 28, 48, .98); --hero-wash: rgba(139, 92, 246, .12);
    --card-shadow: 0 16px 45px -24px rgba(0, 0, 0, .6);
}

html, body { background: var(--page-bg); color: var(--text-body); }
/* Não interpolar cor/fundo na troca: evita texto claro sobre card ainda claro. */
html body :is(a, button, .navbar, .navbar-brand span, .feature-card, .client-card,
    .benefit-card, .testimonial-card, .emotion-card, .clients-more-content,
    .blog-filter, .post-card, .partner-fit-card) { transition-property: transform, box-shadow; }
::selection { background: #6330cd; color: #fff; }
:focus-visible, .blog-page :focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 5px; }
.hero :focus-visible, .footer :focus-visible, .mobile-menu :focus-visible,
.cta-section :focus-visible, #dashboard-preview :focus-visible,
.partner-hero :focus-visible, .partner-final-cta :focus-visible,
.event-banner :focus-visible { outline-color: #e9d5ff; }

/* Contraste do CTA não depende de clarear a cor da marca no tema escuro. */
.btn-primary, .step-number, .testimonial-avatar { background: linear-gradient(135deg, var(--cta-from), var(--cta-to)); color: #fff; }
.btn-secondary { background: var(--surface); border-color: var(--text-accent); color: var(--text-accent); }
.btn-secondary:hover { background: var(--text-accent); color: var(--page-bg); }
.btn-white { background: #fff; color: #6330cd; }
.btn-ghost { color: #fff; border-color: #b6a4d8; }
.navbar-links { margin-left: auto; gap: 24px; }
.navbar .container { gap: 20px; }
.navbar.scrolled, .blog-page .navbar, .partners-page .navbar { background: var(--nav-surface); border-color: var(--border); }
.navbar.scrolled .navbar-brand span, .blog-page .navbar-brand span, .partners-page .navbar-brand span { color: var(--text-main); }
.navbar.scrolled .navbar-links a, .blog-page .navbar-links a, .partners-page .navbar-links > a:not(.btn) { color: var(--text-body); }
.navbar.scrolled .navbar-links a:hover, .blog-page .navbar-links a:hover, .partners-page .navbar-links > a:not(.btn):hover { color: var(--text-accent); }
.navbar .navbar-links a.navbar-cta { color: #fff; }
.navbar-toggle { color: #fff; flex-shrink: 0; }
.navbar-toggle svg, .mobile-menu-close svg { width: 24px; height: 24px; }
.navbar.scrolled .navbar-toggle, .blog-page .navbar-toggle, .partners-page .navbar-toggle { color: var(--text-main); }
.dropdown-menu { background: var(--surface-raised); border: 1px solid var(--border); }
.dropdown-menu a { color: var(--text-body) !important; }
.dropdown-menu a:hover { background: var(--accent-soft); color: var(--text-accent) !important; }
.dropdown-menu a span.drop-icon { background: var(--surface-alt); }
.nav-dropdown:focus-within .dropdown-menu { display: block; opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.mobile-menu { background: #0b1020; padding: 90px 24px 32px; overflow-y: auto; justify-content: flex-start; gap: 12px; z-index: 1100; }
.mobile-menu .mobile-drop-title { color: #b8c4d8; }
.mobile-menu a, .mobile-menu .mobile-drop-links a { color: #f1f5f9; }
.mobile-menu a:hover, .blog-page .mobile-menu [aria-current="page"] { color: #ddd6fe; }
.mobile-menu-close { color: #fff; padding: 8px; }
.mobile-menu-close:focus-visible { outline-color: #ddd6fe; }
.theme-toggle { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; border: 1px solid #c4b5fd; background: #211637; color: #fff; padding: 9px; cursor: pointer; flex-shrink: 0; }
.theme-toggle svg { display: block; width: 22px; height: 22px; }
.theme-toggle:hover { background: #3b255a; }
.mobile-menu .theme-toggle-mobile { display: flex; gap: 10px; width: auto; margin: 0; padding: 10px 16px; min-height: 44px; font: inherit; font-size: 14px; }
.navbar.scrolled .theme-toggle, .blog-page .theme-toggle, .partners-page .theme-toggle { background: var(--surface); color: var(--text-accent); border-color: var(--border-control); }
.navbar.scrolled .theme-toggle:hover, .blog-page .theme-toggle:hover, .partners-page .theme-toggle:hover { background: var(--accent-soft); }
.theme-preference { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 24px; color: #cbd5e1; font-size: 12px; }
.theme-system { font: inherit; color: #e2d9ff; background: #1b2438; border: 1px solid #8797b0; border-radius: 8px; padding: 9px 14px; cursor: pointer; }
.theme-system:hover, .theme-system[aria-pressed="true"] { background: #302345; color: #fff; }
.theme-system[aria-pressed="true"]::before { content: '✓ '; }

/* Soluções: títulos/textos/superfícies, sem modificar cores literais de imagens. */
.section-title, .feature-card h3, .step h3, .client-card h3, .benefit-card h3,
.testimonial-name, .emotion-card h3 { color: var(--text-main); }
.section-desc, .feature-card p, .step p, .client-card p, .benefit-card p,
.testimonial-role, .emotion-card p, .clients-more-content p, .client-card .client-location { color: var(--text-muted); }
.section-label { color: var(--text-accent); background: var(--accent-soft); }
.feature-card, .client-card, .benefit-card, .testimonial-card, .emotion-card { background: var(--surface); border-color: var(--border); }
.feature-card:hover, .client-card:hover, .emotion-card:hover { border-color: var(--text-accent); box-shadow: var(--card-shadow); }
.feature-list li, .testimonial-text { color: var(--text-body); }
.feature-list li::before { color: var(--positive); }
.feature-badge { display: inline-block; background: #6330cd; color: #fff; font-size: 11px; font-weight: 700; padding: 3px 12px; border-radius: 20px; letter-spacing: 1px; margin-bottom: 14px; }
.feature-badge-success { background: #166534; }
.client-tag { background: var(--surface-alt); color: var(--text-body); }
.client-logo { background: #fff; border-color: #d7deea; }
#como-funciona, #beneficios, .clients-more-content, .theme-alternate { background: var(--surface-alt); }
.clients-more-content { border-color: var(--border); }
.clients-more-content:hover { background: var(--accent-soft); border-color: var(--text-accent); }
.clients-more-content p strong { color: var(--text-accent); }
/* Variáveis locais somente nas cores inline de leitura, não nos fundos/CTAs. */
.feature-card h3, .feature-card a:not(.btn) { --brand: var(--text-accent); }
.feature-card p { --gray-600: var(--text-body); }
.solution-breadcrumb { padding: 76px 0 0; background: #0f172a; }
.solution-breadcrumb nav { font-size: 14px; color: #cbd5e1; padding: 12px 0 0; }
.solution-breadcrumb nav a { color: #ddd6fe; text-decoration: underline; text-underline-offset: 3px; }
.solution-breadcrumb nav > span { margin: 0 8px; }
.solution-breadcrumb nav > span:last-child { margin: 0; color: #cbd5e1; }
.hero-subtitle, .hero-stat-label, .carousel-caption p, .screenshot-url,
.clients-counter-label, .clients-counter-stat-label, .stats-bar-item .label { color: var(--on-dark-muted); }
.hero h1 .gradient-text { background-image: linear-gradient(135deg, #c4b5fd, #ede9fe); }
.screenshot-frame.img-placeholder::after { color: #ddd6fe; }
.carousel-arrow { border-color: #b3a4c9; }
.carousel-dot { width: 24px; height: 24px; display: grid; place-items: center; background: transparent; }
.carousel-dot::before { content: ''; display: block; width: 10px; height: 10px; border-radius: 50%; background: #b3a4c9; }
.carousel-dot.active { background: transparent; box-shadow: none; transform: none; outline: 2px solid #ede9fe; outline-offset: 2px; }
.carousel-dot.active::before { background: #ede9fe; }
.carousel-dot:hover:not(.active) { background: transparent; }
.carousel-dot:hover::before { background: #ede9fe; }
.event-desc, .event-point p { color: #fff; }
.event-location, .event-count-note { color: #dcfce7; }
.event-tag { background: #0f4a25; }
.event-poster-caption { color: #14532d; }
.event-poster-frame { background: #fff; }
.footer { background: #0f172a; color: #cbd5e1; }
.footer-brand p, .footer-col a { color: #cbd5e1; }
.footer-col a:hover { color: #ddd6fe; }
.footer-brand h3, .footer-col h4 { color: #fff; }
.footer-social a { background: #28354b; color: #fff; }
.footer-social a:hover { background: #6330cd; }

/* Blog e relatório: superfícies próprias para cards, tabelas e gráficos. */
.blog-page .navbar [aria-current="page"] { color: var(--text-accent); }
.blog-skip { background: var(--surface); color: var(--text-accent); }
.blog-breadcrumb, .blog-meta, .blog-result-count, .blog-hero p,
.post-card p, .post-card-stat span, .blog-empty p, .blog-social p,
.article-lead, .report-metrics small, .article-main .report-footnote,
.article-poster figcaption, .blog-cta p { color: var(--text-muted); }
.blog-breadcrumb a:hover, .blog-eyebrow, .blog-text-link, .post-card h2 a:hover,
.blog-social-links strong, .hour-peak strong, .hour-peak > span:first-child,
.article-toc a:hover { color: var(--text-accent); }
.blog-text-link:hover { color: var(--accent-hover); }
.blog-page .blog-hero { background: radial-gradient(ellipse at 90% 20%, var(--hero-wash), transparent 50%), var(--page-bg); }
.blog-hero h1, .blog-section-top h2, .post-card h2, .blog-empty h3,
.blog-social h2, .article-header h1, .article-main h2, .report-table-wrap tbody th,
.article-toc strong, .blog-cta h2 { color: var(--text-main); }
.blog-hero .gradient-text { background-image: linear-gradient(135deg, var(--text-accent), var(--accent-hover)); }
.blog-filter { background: var(--surface); color: var(--text-body); border-color: var(--border-control); }
.blog-filter:hover { background: var(--accent-soft); color: var(--text-accent); }
.blog-filter.active { background: var(--text-accent); color: var(--page-bg); border-color: var(--text-accent); font-weight: 700; }
.post-card, .blog-social-links a { background: var(--surface); border-color: var(--border); }
.post-card:hover { box-shadow: var(--card-shadow); }
.post-card-image { background: var(--positive-bg); }
.post-image-label, .post-card-stat strong, .article-location, .report-metrics span, .report-metrics strong { color: var(--positive); }
.blog-pill { color: var(--text-accent); background: var(--accent-soft); }
.blog-section-top, .post-card-stat, .blog-empty, .blog-page .report-section,
.report-table-wrap, .report-table-wrap td, .report-table-wrap th, .hour-chart { border-color: var(--border); }
.blog-page .blog-social, .blog-page .report-method, .blog-page .blog-cta { background: var(--surface-alt); }
.blog-social-links a { color: var(--text-body); }
.blog-social-links a:hover { border-color: var(--text-accent); }
.report-metrics > div { background: var(--positive-bg); border-color: var(--positive-border); }
.report-table-wrap { background: var(--surface); color: var(--text-body); }
.report-table-wrap caption, .report-table-wrap thead { background: var(--surface-alt); color: var(--text-muted); }
.report-table-wrap tfoot { background: var(--accent-soft); color: var(--text-accent); }
.hour-chart { background: var(--surface); }
.hour-row { color: var(--text-muted); }
.hour-row strong { color: var(--text-body); }
.hour-track { background: var(--accent-soft); }
.hour-track > span { background: var(--bar); }
.hour-peak .hour-track > span { background: var(--bar-peak); }
.hour-peak strong { color: var(--text-accent); }
.report-method li { color: var(--text-body); }
.article-poster { background: var(--surface-alt); border-color: var(--border); }
.article-toc { border-color: var(--border); }

/* Parceiros: a ilustração do portal também acompanha o tema. */
.partners-page { color: var(--text-body); }
.partner-intro, .partner-difference { background: var(--page-bg); }
.partner-fit, .partner-account, .partner-faq { background: var(--surface-alt); }
.partner-fit-card, .partner-portal-window, .partner-capabilities { background: var(--surface); border-color: var(--border); }
.partner-fit-card:hover { border-color: var(--text-accent); box-shadow: var(--card-shadow); }
.partner-section-heading h2, .partner-difference-copy h2, .partner-faq-heading h2,
.partner-intro-copy strong, .partner-fit-card h3, .partner-account-copy h2,
.partner-capability strong, .partner-faq-item summary, .partner-portal-brand,
.partner-portal-welcome strong, .partner-portal-summary strong, .partner-portal-payment strong { color: var(--text-main); }
.partner-intro-copy p, .partner-fit .section-header > p, .partner-fit-card p,
.partner-account-copy > p, .partner-account-copy .partner-account-footnote,
.partner-difference-copy > p, .partner-capability small, .partner-faq-heading > p,
.partner-faq-item p, .partner-portal-brand small, .partner-portal-welcome small,
.partner-portal-summary small, .partner-portal-payment small, .partner-portal-summary em,
.partner-portal-payment em, .partner-portal-nav, .partner-portal-caption { color: var(--text-muted); }
.partner-text-gradient, .partner-inline-link, .partner-portal-nav .active,
.partner-faq-item summary::after, .partner-portal-arrow { color: var(--text-accent); }
.partner-card-index { color: var(--text-muted); }
.partner-account-list li { color: var(--text-body); }
.partner-fit-icon, .partner-portal-avatar, .partner-portal-summary > div > span,
.partner-capability > span { background: var(--accent-soft); color: var(--text-accent); }
.partner-portal-status, .partner-portal-payment-icon { background: var(--positive-bg); color: var(--positive); }
.partner-portal-summary > div { background: var(--surface-alt); border-color: var(--border); }
.partner-portal-topbar, .partner-portal-brand small, .partner-portal-payment,
.partner-portal-nav, .partner-capability, .partner-faq-list, .partner-faq-item { border-color: var(--border); }
.partners-page #como-funciona { background: #111528; }
.partner-hero-lead, .partner-hero-note, .partner-trust-line, .partner-visual-caption,
.partner-how-heading > p, .partner-step p, .partner-step-number,
.partner-final-cta-content > p, .partner-email-link, .partner-terms-note { color: var(--on-dark-muted); }

/* Demonstração de conversão: contexto escuro intencional nos dois temas. */
.conversion-section { background: #0f172a; padding: 80px 0; color: #fff; }
.conversion-grid { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 32px; align-items: center; max-width: 900px; margin: 0 auto; }
.conversion-camera { background: #1b2438; border: 1px solid #59677e; border-radius: 16px; padding: 32px; text-align: center; }
.conversion-camera h3 { color: #fff; font-size: 18px; margin-bottom: 8px; }
.conversion-camera p { color: #d1d9e8; font-size: 14px; line-height: 1.6; }
.conversion-camera-icon { font-size: 48px; margin-bottom: 16px; }
.conversion-camera strong { color: #ddd6fe; }
.conversion-camera-checkout strong { color: #86efac; }
.conversion-count { margin-top: 16px; background: #332a68; border-radius: 10px; padding: 12px; }
.conversion-camera-checkout .conversion-count { background: #194144; }
.conversion-count strong { display: block; font-size: 28px; font-weight: 900; color: #fff; }
.conversion-count span { font-size: 11px; color: #e2e8f0; text-transform: uppercase; letter-spacing: 1px; }
.conversion-divider { text-align: center; }
.conversion-divider strong { display: flex; align-items: center; justify-content: center; background: #6330cd; border-radius: 50%; width: 56px; height: 56px; margin: 0 auto; font-size: 22px; color: #fff; }
.conversion-divider span { display: block; color: #d1d9e8; font-size: 12px; margin-top: 8px; }
.conversion-result { max-width: 900px; margin: 32px auto 0; background: linear-gradient(135deg, var(--cta-from), var(--cta-to)); border-radius: 16px; padding: 28px 40px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 24px; color: #fff; }
.conversion-result-label { font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; }
.conversion-result strong { font-size: 52px; font-weight: 900; line-height: 1; }
.conversion-result-note { font-size: 14px; margin-top: 4px; }
.conversion-result p { text-align: right; font-size: 15px; line-height: 1.7; }

@media (max-width: 1150px) {
    .navbar-links { display: none; }
    .navbar-toggle { display: block; }
    .theme-toggle { margin-left: auto; }
    .navbar .container { gap: 12px; }
}
@media (max-width: 480px) {
    .theme-toggle { width: 40px; height: 40px; }
    .theme-preference { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 768px) {
    .conversion-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .conversion-camera, .conversion-result { padding: 24px; }
    .conversion-result p { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
    html, *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
    .theme-toggle, .theme-system, .blog-filter { border: 1px solid ButtonText; }
    .theme-toggle svg { forced-color-adjust: auto; }
}
