/* CasinoOpsAI route-scoped page-family design. Internal.
   Loaded only for the matching visual family; the protected homepage loads none. */
body[data-page-family='demonstration'] {
  --family-accent: #a36d13;
  --family-accent-dark: #6e480a;
  --family-accent-soft: #fff6df;
  --family-border: #d8b86f;
  --family-surface: #fbfaf6;
  --family-radius: 8px;
  --family-shadow: 0 8px 18px rgba(83, 67, 37, 0.08);
}

/* Demonstrations: clearly a test bench, not a finished product shell. */
body[data-page-family='demonstration'] .hero {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.035) 25%, transparent 25%) 0 0 / 28px 28px,
    linear-gradient(315deg, rgba(255, 255, 255, 0.025) 25%, transparent 25%) 0 0 / 28px 28px,
    linear-gradient(140deg, #202a35 0%, #354353 63%, #5c4a29 100%) !important;
  border-bottom: 4px dashed #d5af5c;
}

body[data-page-family='demonstration'] :is(.card, .mini-card, .info-card, .service-card, .department-card, .case-card, .problem-card, .example-card, .step-card, .output-card, .side-panel) {
  border-style: dashed !important;
  background: #fffef9;
}

body[data-page-family='demonstration'] .card:hover {
  transform: none;
}

body[data-page-family='demonstration'] .section-label {
  padding: 0.32rem 0.55rem;
  border: 1px dashed var(--family-border);
  background: var(--family-accent-soft);
  color: var(--family-accent-dark) !important;
  letter-spacing: 0.09em;
}

/* The test-bench chip is light by default; dark workflow surfaces retain an on-dark label. */
body[data-page-family='demonstration'] :is(.hero, .ai-hero, .page-header, .about-hero, .contact-hero,
  .sitemap-hero, .article-header, .section--dark, .on-dark, .cta-section--dark, .es-review-hero,
  .es-final-card, .app-header, .workflow-hero, .workflow-final-cta, .plan-hero, .cv-hero,
  .download-card, .final-card, .rules-card, .use-instead-card, .marketing-differentiation-section)
  .section-label {
  border-color: rgba(255, 232, 168, .48);
  background: transparent;
  color: #ffe8a8 !important;
}

body[data-page-family='demonstration'] .section-label::before {
  display: none;
}