/* Shared materials approved on the home and Fonte de dados.
   Tokens add no global repaint: each family explicitly selects its surfaces. */
:root {
  --soceo-brand-paper: #fdfdfb;
  --soceo-brand-cream: #f6f2ed;
  --soceo-brand-ink: #151517;
  --soceo-brand-muted: #665a76;
  --soceo-brand-purple: #7839ee;
  --soceo-brand-deep: #16033a;
  --soceo-brand-line: #d9d1e5;
  --soceo-brand-artwork: url('/assets/hero/soceo-glass/background-1600.webp');
  --soceo-brand-glass: linear-gradient(135deg, #ffffff33, #ffffff0d);
}

/* Scope markers also identify the actual runtime family in the route audit. */
[data-soceo-agent-home] { --soceo-brand-family: home; }
main.ds-page { --soceo-brand-family: data-sources; }
main:is(.mix-connectors-page, .mix-connector-detail-page) { --soceo-brand-family: connectors; }
main.mix-solution-page { --soceo-brand-family: solutions; }
main:is(.mix-platform-page, .mix-apis-page, .mix-model-center-page, .mix-agents-page, .agent-detail-page, .mix-security-page, .mix-roadmap-page) { --soceo-brand-family: product; }
main:is(.mix-connect-page, .mix-connect-subpage, .mix-motor-page) { --soceo-brand-family: motors; }
main.mix-legal-page { --soceo-brand-family: legal; }
main.mix-support-page { --soceo-brand-family: support; }
main:is(.mix-story-page, .mix-purpose-page, .mix-mission-page, .mix-vision-page, .mix-values-page, .mix-ethics-page) { --soceo-brand-family: company; }
main:is(.mix-blog-page, .mix-content-page) { --soceo-brand-family: content; }

/* Connector directory and all 60 connector detail pages. */
.mix-connectors-page,
.mix-connector-detail-page { background: var(--soceo-brand-paper); }
.mix-connectors-page .mix-connectors-inner,
.mix-connector-detail-page .mix-connector-detail-page__inner { max-width: 1180px; }
.mix-connectors-page .mix-connectors-hero,
.mix-connector-detail-page .mix-connector-detail-page__hero { background: var(--soceo-brand-cream); border-bottom-color: var(--soceo-brand-line); }
.mix-connectors-page .mix-connectors-hero::before,
.mix-connector-detail-page .mix-connector-detail-page__hero::before { display: none; }
.mix-connectors-page .mix-connectors-hero h1,
.mix-connector-detail-page .mix-connector-detail-page__hero h1 { font-family: "Bricolage Grotesque", Inter, sans-serif; font-size: clamp(36px, 4.6vw, 64px); font-weight: 650; line-height: 1.08; letter-spacing: -.03em; }
.mix-connectors-page .mix-connectors-eyebrow,
.mix-connector-detail-page .mix-connector-detail-page__eyebrow { font-weight: 650; letter-spacing: .12em; }
.mix-connectors-page .mix-connectors-mosaic,
.mix-connector-detail-page .mix-connector-detail-page__source-map {
  border-color: #ffffff40;
  background: var(--soceo-brand-artwork) center / cover no-repeat #6728d4;
  box-shadow: 0 20px 48px #16033a14;
  border-radius: 24px;
}
.mix-connectors-page .mix-connectors-mosaic::before { display: none; }
.mix-connectors-page .mix-connectors-mosaic__core,
.mix-connector-detail-page .mix-connector-detail-page__context-tile {
  color: #fff;
  border: 1px solid #ffffff40;
  background: var(--soceo-brand-glass), #16033ab3;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: none;
}
.mix-connector-detail-page .mix-connector-detail-page__source-flow { background: #ebe6fb; }
.mix-connectors-page .mix-connectors-controls {
  border: 0;
  border-radius: 20px;
  background: var(--soceo-brand-artwork) center / cover no-repeat #6728d4;
  box-shadow: none;
}
.mix-connectors-page .mix-connectors-control > span:first-child { color: #fff; text-shadow: 0 1px 8px #16033a; }
.mix-connectors-page .mix-connectors-search__field,
.mix-connectors-page .mix-connectors-control select { border-color: #ffffff94; }
.mix-connectors-page .mix-connectors-card__link { border-color: var(--soceo-brand-line); border-radius: 16px; box-shadow: none; background: var(--soceo-brand-paper); }
.mix-connectors-page .mix-connectors-card__link:hover { background: #fff; }
.mix-connectors-page .mix-connectors-permissions-close,
.mix-connector-detail-page .mix-connector-detail-page__final {
  background: linear-gradient(90deg, #16033aeb, #16033ac2), var(--soceo-brand-artwork) center / cover no-repeat;
}
.mix-connectors-page .mix-connectors-permissions-close a,
.mix-connector-detail-page .mix-connector-detail-page__final .mix-connector-detail-page__button {
  border: 1px solid #ffffff40;
  border-radius: 8px;
  color: #fff;
  background: var(--soceo-brand-glass), #16033ab3;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: none;
}
.mix-connectors-page .mix-connectors-permissions-close a:hover,
.mix-connector-detail-page .mix-connector-detail-page__final .mix-connector-detail-page__button:hover { background-color: #6728d4; }

/* Nine departmental solutions: native diagrams retain their own inner material. */
.mix-solution-page { background: var(--soceo-brand-paper); }
.mix-solution-page .mix-solution-copy h1,
.mix-solution-page .mix-solution-final h2 { font-size: clamp(36px, 4.6vw, 64px); font-weight: 650; line-height: 1.08; letter-spacing: -.03em; }
.mix-solution-page .mix-solution-eyebrow { font-weight: 650; letter-spacing: .12em; }
.mix-solution-page .mix-scene {
  --brand-scene-material: #fff;
  padding: 20px;
  border: 9px solid transparent;
  border-radius: 24px;
  background: linear-gradient(var(--brand-scene-material), var(--brand-scene-material)) padding-box, var(--soceo-brand-artwork) center / cover border-box;
  box-shadow: 0 20px 48px #16033a14;
}
.mix-solution-page .mix-scene-teams { --brand-scene-material: #eee7ff; }
.mix-solution-page .mix-scene-engineering { --brand-scene-material: #171430; }
.mix-solution-page .mix-scene-support { --brand-scene-material: #f9f7ff; }
.mix-solution-page :is(.mix-scene-sales, .mix-scene-marketing) { --brand-scene-material: #f5f1ff; }
.mix-solution-page .mix-scene-it { --brand-scene-material: #211a40; }
.mix-solution-page .mix-scene-people { --brand-scene-material: #f7f3ff; }
.mix-solution-page .mix-scene-finance { --brand-scene-material: #eee9fb; }
.mix-solution-page .mix-scene-legal { --brand-scene-material: #eeebf7; }
.mix-solution-page .mix-workflow {
  color: #fff;
  border-color: #ffffff40;
  background: linear-gradient(90deg, #16033ad9, #16033a80), var(--soceo-brand-artwork) center / cover no-repeat;
}
.mix-solution-page .mix-workflow-top span { color: #ebe6fb; }
.mix-solution-page .mix-workflow-detail { color: #ebe6fb; }
.mix-solution-page .mix-workflow-play,
.mix-solution-page .mix-workflow-steps button {
  color: #fff;
  border: 1px solid #ffffff40;
  background: var(--soceo-brand-glass), #16033ab3;
}
.mix-solution-page .mix-workflow-steps button[aria-current="step"],
.mix-solution-page .mix-workflow-play[aria-pressed="true"] { color: #6728d4; background: #fff; border-color: #fff; }
.mix-solution-page .mix-workflow-steps small { color: #ebe6fb; }
.mix-solution-page .mix-workflow-steps button[aria-current="step"] small { color: #6728d4; }
.mix-solution-page .mix-related-link:is(:hover, :focus-visible) span { color: #fff; }
.mix-solution-page .mix-solution-final {
  background: linear-gradient(90deg, #16033aeb, #16033ab3), var(--soceo-brand-artwork) center / cover no-repeat;
}
.mix-solution-page .mix-solution-final button {
  border: 1px solid #ffffff40;
  color: #fff;
  background: var(--soceo-brand-glass), #16033ab3;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
.mix-solution-page .mix-solution-final button:hover { background-color: #6728d4; }
@media (max-width: 820px) {
  :root { --soceo-brand-artwork: url('/assets/hero/soceo-glass/background-800.webp'); }
}
@media (max-width: 700px) {
  .mix-connectors-page .mix-connectors-hero h1,
  .mix-connector-detail-page .mix-connector-detail-page__hero h1,
  .mix-solution-page .mix-solution-copy h1,
  .mix-solution-page .mix-solution-final h2 { font-size: 36px; }
  .mix-connectors-page .mix-connectors-mosaic,
  .mix-connector-detail-page .mix-connector-detail-page__source-map { border-radius: 20px; }
  .mix-solution-page .mix-scene { padding: 16px; border-width: 6px; border-radius: 20px; }
}