/* ==========================================================
   STUDIOBOARD — CLEAN V14
   Camada visual comum + tema claro/escuro.
   Mantém a lógica existente e reduz a linguagem "HUD/ficção".
   ========================================================== */
:root,
html[data-theme="dark"] {
  --sb-bg: #0b1119;
  --sb-bg-soft: #0f1722;
  --sb-surface: #121b27;
  --sb-surface-2: #182332;
  --sb-field: #0f1824;
  --sb-text: #edf4fc;
  --sb-text-strong: #ffffff;
  --sb-muted: #a7b3c2;
  --sb-muted-2: #7f8da0;
  --sb-line: rgba(148, 170, 199, .18);
  --sb-line-strong: rgba(90, 159, 255, .48);
  --sb-accent: #4e8cff;
  --sb-accent-2: #7a5cff;
  --sb-accent-soft: rgba(78, 140, 255, .12);
  --sb-success: #79d49c;
  --sb-danger: #ff8f8f;
  --sb-shadow: 0 24px 70px rgba(0, 0, 0, .22);
}

html[data-theme="light"] {
  --sb-bg: #f4f7fb;
  --sb-bg-soft: #eef3f8;
  --sb-surface: #ffffff;
  --sb-surface-2: #f7f9fc;
  --sb-field: #f4f7fb;
  --sb-text: #243246;
  --sb-text-strong: #111827;
  --sb-muted: #5e6c7e;
  --sb-muted-2: #77869a;
  --sb-line: #dbe4ef;
  --sb-line-strong: #8db9ff;
  --sb-accent: #2f73e8;
  --sb-accent-2: #6a4df6;
  --sb-accent-soft: rgba(47, 115, 232, .09);
  --sb-success: #16824b;
  --sb-danger: #b83f4b;
  --sb-shadow: 0 22px 58px rgba(53, 72, 96, .10);
}

html { background: var(--sb-bg); }
body { transition: background-color .18s ease, color .18s ease; }

/* Tema */
.sb-theme-toggle {
  min-width: 42px;
  height: 38px;
  padding: 0 11px;
  border: 1px solid var(--sb-line);
  background: var(--sb-surface);
  color: var(--sb-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 8px;
  font: 650 12px/1 "Segoe UI", Arial, sans-serif;
  cursor: pointer;
  white-space: nowrap;
}
.sb-theme-toggle:hover { border-color: var(--sb-line-strong); background: var(--sb-surface-2); }
.sb-theme-toggle span[aria-hidden="true"] { font-size: 17px; line-height: 1; }
.sb-theme-toggle.is-floating { position: fixed; z-index: 200; right: 18px; top: 18px; box-shadow: var(--sb-shadow); }

/* Cabeçalhos comuns */
.site-header,
.flow-header,
.legal-header {
  background: color-mix(in srgb, var(--sb-bg) 92%, transparent) !important;
  border-bottom: 1px solid var(--sb-line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(14px) !important;
}
.brand,
.flow-brand,
.legal-brand { color: var(--sb-text-strong) !important; }
.brand-copy small,
.flow-brand-copy small,
.legal-brand small {
  color: var(--sb-muted-2) !important;
  font-size: 11px !important;
  letter-spacing: .08em !important;
}
.site-nav a,
.flow-nav a,
.legal-nav a {
  color: var(--sb-muted) !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-weight: 600 !important;
}
.site-nav a:hover,
.site-nav a.is-active,
.flow-nav a:hover,
.legal-nav a:hover,
.legal-nav a[aria-current="page"] { color: var(--sb-text-strong) !important; }

/* HOME V14 */
body.site-clean-v14 {
  margin: 0;
  min-width: 320px;
  background: var(--sb-bg) !important;
  color: var(--sb-text) !important;
  font-family: "Segoe UI", Arial, sans-serif;
}
body.site-clean-v14::before { display: none !important; }
.site-clean-v14 .ambient-field,
.site-clean-v14 .site-progress,
.site-clean-v14 .xp-chapter-status,
.site-clean-v14 .experience-strip,
.site-clean-v14 .conversion-dock { display: none !important; }
.clean-header { height: 72px; }
.clean-header .header-inner { min-height: 72px; gap: 22px; }
.clean-header .brand-mark { width: 44px; height: 44px; flex: 0 0 44px; }
.clean-header .site-nav { gap: 23px; }
.clean-header .header-action { min-height: 40px; padding-inline: 16px; }

.clean-hero {
  padding: 150px 0 92px;
  background:
    radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--sb-accent-2) 12%, transparent), transparent 34%),
    var(--sb-bg);
  border-bottom: 1px solid var(--sb-line);
}
.clean-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(520px, 1.18fr);
  align-items: center;
  gap: clamp(48px, 7vw, 100px);
}
.clean-eyebrow {
  margin: 0 0 15px;
  color: var(--sb-accent);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.2;
}
.clean-hero h1,
.clean-flow-heading h2,
.clean-feature-copy h2,
.clean-summary h2 {
  margin: 0;
  color: var(--sb-text-strong);
  letter-spacing: -.045em;
  font-weight: 760;
}
.clean-hero h1 { max-width: 720px; font-size: clamp(52px, 6.3vw, 90px); line-height: .98; }
.clean-hero h1 em,
.clean-flow-heading h2 em,
.clean-feature-copy h2 em,
.clean-summary h2 em { color: var(--sb-accent); font-style: normal; }
.clean-hero-lead {
  max-width: 650px;
  margin: 28px 0 0;
  color: var(--sb-muted);
  font-size: clamp(17px, 1.45vw, 20px);
  line-height: 1.7;
}
.clean-hero .hero-actions { margin-top: 32px; }
.clean-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin-top: 31px;
  color: var(--sb-muted-2);
  font-size: 13px;
  font-weight: 600;
}
.clean-proof span::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 8px 2px 0; border-radius: 50%; background: var(--sb-accent); }
.clean-product-demo {
  overflow: hidden;
  border: 1px solid var(--sb-line);
  background: var(--sb-surface);
  box-shadow: var(--sb-shadow);
}
.clean-product-demo video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }

.clean-flow-intro { padding: 108px 0 52px; background: var(--sb-bg); }
.clean-flow-heading { max-width: 860px; }
.clean-flow-heading h2 { font-size: clamp(40px, 5vw, 68px); line-height: 1.02; }
.clean-flow-heading > p:last-child { max-width: 760px; margin: 24px 0 0; color: var(--sb-muted); font-size: 18px; line-height: 1.7; }
.clean-features { width: min(calc(100% - 48px), 1180px); margin: 0 auto; padding-bottom: 110px; }
.clean-feature-row {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(480px, 1.1fr);
  align-items: center;
  gap: clamp(44px, 7vw, 92px);
  padding: 74px 0;
  border-bottom: 1px solid var(--sb-line);
  scroll-margin-top: 90px;
}
.clean-feature-row.is-reversed .clean-feature-copy { order: 2; }
.clean-feature-row.is-reversed .clean-feature-media { order: 1; }
.clean-feature-copy h2 { font-size: clamp(34px, 4.1vw, 58px); line-height: 1.05; }
.clean-feature-copy > p:not(.clean-eyebrow) { margin: 22px 0 0; color: var(--sb-muted); font-size: 17px; line-height: 1.7; }
.clean-feature-copy ul { margin: 26px 0 0; padding: 0; list-style: none; display: grid; gap: 11px; color: var(--sb-text); font-size: 15px; }
.clean-feature-copy li::before { content: "✓"; margin-right: 10px; color: var(--sb-accent); font-weight: 800; }
.clean-feature-media { overflow: hidden; min-height: 330px; border: 1px solid var(--sb-line); background: var(--sb-surface); box-shadow: var(--sb-shadow); }
.clean-feature-media img { display: block; width: 100%; height: 100%; min-height: 330px; object-fit: cover; transform: scale(1.01); }
.media-import img { object-position: 55% 50%; }
.media-materials img { object-position: 72% 50%; }
.media-control img { object-position: 81% 52%; }
.media-catalog img { object-position: 88% 50%; }

.clean-summary { padding: 92px 0; background: var(--sb-surface); border-block: 1px solid var(--sb-line); }
.clean-summary-inner { max-width: 900px; text-align: center; }
.clean-summary h2 { font-size: clamp(42px, 5vw, 68px); line-height: 1.02; }
.clean-summary p:not(.clean-eyebrow) { max-width: 720px; margin: 24px auto 30px; color: var(--sb-muted); font-size: 18px; line-height: 1.7; }

/* Planos e demais blocos da home: limpeza sem mudar IDs/JS. */
.site-clean-v14 .section { background: var(--sb-bg) !important; color: var(--sb-text); }
.site-clean-v14 .plans-section { background: var(--sb-bg-soft) !important; border-color: var(--sb-line) !important; }
.site-clean-v14 .xp-sales-heading,
.site-clean-v14 .xp-account-grid,
.site-clean-v14 .xp-support-grid,
.site-clean-v14 .xp-faq-grid { color: var(--sb-text); }
.site-clean-v14 .xp-step-index { display: none !important; }
.site-clean-v14 .xp-step-kicker,
.site-clean-v14 .eyebrow { color: var(--sb-accent) !important; font-size: 13px !important; letter-spacing: 0 !important; text-transform: none !important; }
.site-clean-v14 .xp-sales-heading h2,
.site-clean-v14 .xp-account h2,
.site-clean-v14 .xp-support h2,
.site-clean-v14 .xp-faq h2 { color: var(--sb-text-strong) !important; }
.site-clean-v14 .xp-sales-heading > p:last-child,
.site-clean-v14 .xp-account p,
.site-clean-v14 .xp-support p,
.site-clean-v14 .faq-list p { color: var(--sb-muted) !important; font-size: 15px !important; line-height: 1.65 !important; }
.site-clean-v14 .plan-card,
.site-clean-v14 .subscribe-panel,
.site-clean-v14 .guarantee-strip,
.site-clean-v14 .xp-account-actions a,
.site-clean-v14 .xp-support-links a,
.site-clean-v14 .faq-list details {
  background: var(--sb-surface) !important;
  border-color: var(--sb-line) !important;
  color: var(--sb-text) !important;
  box-shadow: none !important;
}
.site-clean-v14 .plan-card:hover,
.site-clean-v14 .plan-card:focus-visible { background: var(--sb-surface-2) !important; transform: none !important; }
.site-clean-v14 .plan-card.selected { background: var(--sb-surface-2) !important; box-shadow: inset 0 0 0 2px var(--sb-accent) !important; }
.site-clean-v14 .plan-card h3,
.site-clean-v14 .plan-price strong,
.site-clean-v14 .subscribe-context h3,
.site-clean-v14 .xp-account-actions strong,
.site-clean-v14 .xp-support-links strong,
.site-clean-v14 .faq-list summary { color: var(--sb-text-strong) !important; }
.site-clean-v14 .plan-description,
.site-clean-v14 .plan-billing-note,
.site-clean-v14 .plan-card ul,
.site-clean-v14 .subscribe-context p,
.site-clean-v14 .subscribe-context li,
.site-clean-v14 .subscribe-form small,
.site-clean-v14 .xp-account-actions small { color: var(--sb-muted) !important; font-size: 13px !important; }
.site-clean-v14 .plan-topline { color: var(--sb-muted-2) !important; font-size: 12px !important; }
.site-clean-v14 .plan-topline b { color: var(--sb-accent) !important; font-size: 12px !important; }
.site-clean-v14 .plan-highlight { color: var(--sb-accent) !important; border-color: var(--sb-line-strong) !important; background: var(--sb-accent-soft) !important; font-size: 12px !important; }
.site-clean-v14 .plan-select { color: var(--sb-text-strong) !important; border-color: var(--sb-line-strong) !important; font-size: 13px !important; }
.site-clean-v14 .subscribe-form input,
.site-clean-v14 .selected-plan-info { background: var(--sb-field) !important; border-color: var(--sb-line) !important; color: var(--sb-text) !important; }
.site-clean-v14 .site-footer { background: var(--sb-bg-soft) !important; border-top-color: var(--sb-line) !important; color: var(--sb-muted) !important; }
.site-clean-v14 .site-footer a { color: var(--sb-text) !important; }

/* Páginas internas / Conta / Legal no mesmo sistema de tema */
body.account-page,
body.legal-page {
  background: var(--sb-bg) !important;
  color: var(--sb-text) !important;
}
body.account-page::before,
body.legal-page::before { background: linear-gradient(90deg, var(--sb-accent), var(--sb-accent-2)) !important; height: 2px !important; }
.account-context,
.account-hub .card,
.legal-card,
.legal-section,
.cancel-card,
.activation-card {
  background: var(--sb-surface) !important;
  color: var(--sb-text) !important;
  border-color: var(--sb-line) !important;
  box-shadow: none !important;
}
.account-context::before { display: none !important; }
.account-context h1,
.account-hub .card h1,
.account-section h2,
.legal-page h1,
.legal-page h2,
.legal-page h3 { color: var(--sb-text-strong) !important; }
.account-context p,
.account-context li,
.account-section-copy,
.legal-page p,
.legal-page li { color: var(--sb-muted) !important; font-size: 14px !important; line-height: 1.65 !important; }
.account-section,
.summary-item,
.machine-line,
.history-row,
.training-card,
.guarantee-box {
  background: var(--sb-surface-2) !important;
  border-color: var(--sb-line) !important;
  color: var(--sb-text) !important;
}
.input,
.account-page input,
.account-page select,
.account-page textarea {
  background: var(--sb-field) !important;
  color: var(--sb-text) !important;
  border-color: var(--sb-line) !important;
}
.input:focus,
.account-page input:focus { border-color: var(--sb-accent) !important; background: var(--sb-surface) !important; }
.account-nav { border-color: var(--sb-line) !important; }
.account-nav-button,
.account-small-button {
  background: var(--sb-surface) !important;
  color: var(--sb-muted) !important;
  border-color: var(--sb-line) !important;
  font-size: 13px !important;
}
.account-nav-button:hover,
.account-nav-button.active,
.account-small-button:hover:not(:disabled) {
  border-color: var(--sb-line-strong) !important;
  background: var(--sb-accent-soft) !important;
  color: var(--sb-text-strong) !important;
}
.flow-footer,
.legal-footer { color: var(--sb-muted-2) !important; border-color: var(--sb-line) !important; }
.flow-footer a,
.legal-footer a { color: var(--sb-muted) !important; }

/* Acessibilidade / motion */
[data-reveal] { transition: opacity .35s ease, transform .35s ease !important; }
[data-reveal]:not(.is-visible) { transform: translateY(14px) !important; filter: none !important; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (max-width: 1100px) {
  .sb-theme-toggle-text { display: none; }
  .sb-theme-toggle { min-width: 40px; padding: 0 9px; }
  .clean-header .site-nav { gap: 16px; }
  .clean-hero-grid,
  .clean-feature-row { grid-template-columns: 1fr; }
  .clean-feature-row.is-reversed .clean-feature-copy,
  .clean-feature-row.is-reversed .clean-feature-media { order: initial; }
  .clean-product-demo { max-width: 820px; }
}
@media (max-width: 760px) {
  .clean-hero { padding: 118px 0 66px; }
  .clean-hero-grid { gap: 42px; }
  .clean-hero h1 { font-size: clamp(44px, 13vw, 68px); }
  .clean-flow-intro { padding-top: 76px; }
  .clean-features { width: min(calc(100% - 32px), 1180px); }
  .clean-feature-row { padding: 54px 0; gap: 30px; }
  .clean-feature-media,
  .clean-feature-media img { min-height: 230px; }
  .clean-proof { gap: 9px 14px; }
  .sb-theme-toggle.is-inline { margin-left: auto; }
}