/* ============================================================================= Capability pages — bold per-client demo skins ----------------------------------------------------------------------------- Loaded ONLY on /capabilities/* routes. Rollback: remove this file's from those HTML files and delete the `cap-theme cap-theme--*` classes from . ============================================================================= */ /* ----------------------------------------------------------------------------- Theme tokens — Capabilities index & patterns hub (main brand: charcoal + copper) Matches site :root — #2B2B2B, #B35C2E, #F5F3EF, #D9D6CF, #3F464A, #55606A ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--index { --cap-page-bg: #252422; --cap-body-text: #3f464a; --cap-hero-glow1: rgba(179, 92, 46, 0.34); --cap-hero-dot: rgba(245, 243, 239, 0.045); --cap-hero-heading: #f5f3ef; --cap-hero-sub: #d9d6cf; --cap-eyebrow-border: rgba(179, 92, 46, 0.38); --cap-eyebrow-bg: rgba(179, 92, 46, 0.08); --cap-nav-bg: rgba(245, 243, 239, 0.96); --cap-nav-border: rgba(43, 43, 43, 0.12); --cap-logo-a: #2b2b2b; --cap-logo-s: #b35c2e; --cap-nav-link: #3f464a; --cap-nav-link-hover: #b35c2e; --cap-nav-link-hover-bg: rgba(179, 92, 46, 0.1); --cap-nav-dropdown-bg: #ffffff; --cap-nav-dropdown-border: rgba(43, 43, 43, 0.12); --cap-dropdown-link: #2b2b2b; --cap-dropdown-link-hover-bg: rgba(179, 92, 46, 0.08); --cap-dropdown-link-hover: #9e4f26; --cap-accent: #b35c2e; --cap-accent-hover: #9e4f26; --cap-btn-text-on-accent: #ffffff; --cap-nav-toggle-border: rgba(43, 43, 43, 0.22); --cap-nav-toggle-hover: #b35c2e; --cap-nav-toggle-bar: #2b2b2b; --cap-drawer-overlay: rgba(30, 28, 26, 0.55); --cap-drawer-inner-bg: #f5f3ef; --cap-drawer-link: #2b2b2b; --cap-drawer-link-hover-bg: rgba(179, 92, 46, 0.08); --cap-band-bg: linear-gradient(180deg, #2a2826 0%, #252422 100%); --cap-band-border: rgba(179, 92, 46, 0.14); --cap-band-heading: #f5f3ef; --cap-band-text: #d9d6cf; --cap-panel-bg: linear-gradient(180deg, #33312e 0%, #2a2826 100%); --cap-panel-heading: #f5f3ef; --cap-panel-text: #d9d6cf; --cap-panel-eyebrow: #c17a4a; --cap-card-bg: #fbfaf7; --cap-card-border: rgba(43, 43, 43, 0.12); --cap-card-heading: #2b2b2b; --cap-card-muted: #55606a; --cap-mockbar-bg: #f0ebe4; --cap-mockbar-title: #3f464a; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.28); --cap-footer-bg: #1f1e1c; --cap-footer-border: rgba(179, 92, 46, 0.15); --cap-footer-text: #d9d6cf; --cap-footer-muted: #8a8580; --cap-footer-link-hover: #e8c4a8; --cap-cta-bg: linear-gradient(165deg, #2f2118 0%, #252422 100%); --cap-cta-heading: #f5f3ef; --cap-cta-text: #d9d6cf; --cap-mock-dot: #b35c2e; --cap-mock-dot-shadow: rgba(179, 92, 46, 0.35); --cap-mock-dot-secondary: #7a756d; --cap-warn: #c94c4c; --cap-good: #3d7a52; --cap-mid: #b8860b; --cap-matrix-feature: #b35c2e; --cap-matrix-cut: #c94c4c; --cap-demo-strip-bg: linear-gradient(90deg, rgba(179, 92, 46, 0.14), rgba(179, 92, 46, 0.02)); --cap-demo-strip-border: rgba(179, 92, 46, 0.35); --chart-feature: #b35c2e; --chart-promote: #6b7280; --chart-reprice: #3d7a52; --chart-cut: #c94c4c; --chart-gridline: rgba(85, 96, 106, 0.35); } /* ----------------------------------------------------------------------------- Restaurant + live demo — burgundy bistro + brass ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--restaurant { --cap-page-bg: #10060a; --cap-body-text: #dccdc8; --cap-hero-glow1: rgba(201, 164, 74, 0.38); --cap-hero-dot: rgba(255, 245, 235, 0.04); --cap-hero-heading: #fff8f0; --cap-hero-sub: #c4b4a8; --cap-nav-bg: rgba(16, 6, 10, 0.94); --cap-nav-border: rgba(201, 164, 74, 0.15); --cap-logo-a: #fff8f0; --cap-logo-s: #d4af37; --cap-nav-link: #e8ddd4; --cap-nav-link-hover: #f0d78c; --cap-nav-link-hover-bg: rgba(201, 164, 74, 0.1); --cap-nav-dropdown-bg: #1c0e14; --cap-nav-dropdown-border: rgba(201, 164, 74, 0.2); --cap-dropdown-link: #f5ebe0; --cap-dropdown-link-hover-bg: rgba(201, 164, 74, 0.08); --cap-dropdown-link-hover: #f0d78c; --cap-accent: #c9a44a; --cap-accent-hover: #dfc069; --cap-btn-text-on-accent: #1a0a08; --cap-nav-toggle-border: rgba(201, 164, 74, 0.3); --cap-nav-toggle-hover: #d4af37; --cap-nav-toggle-bar: #f5ebe0; --cap-drawer-overlay: rgba(8, 2, 4, 0.7); --cap-drawer-inner-bg: #180a10; --cap-drawer-link: #f5ebe0; --cap-drawer-link-hover-bg: rgba(201, 164, 74, 0.08); --cap-band-bg: #160a0f; --cap-band-border: rgba(201, 164, 74, 0.08); --cap-band-heading: #fff8f0; --cap-band-text: #b8a99c; --cap-panel-bg: #160a0f; --cap-panel-heading: #fff8f0; --cap-panel-text: #b8a99c; --cap-panel-eyebrow: #d4af37; --cap-card-bg: #faf5eb; --cap-card-border: rgba(90, 50, 40, 0.12); --cap-card-heading: #2a1410; --cap-card-muted: #5c4a42; --cap-mockbar-bg: #f0e6d8; --cap-mockbar-title: #4a3528; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #0a0406; --cap-footer-border: rgba(201, 164, 74, 0.1); --cap-footer-text: #a8988c; --cap-footer-muted: #7d6d62; --cap-footer-link-hover: #f0d78c; --cap-cta-bg: linear-gradient(165deg, #2a1018 0%, #10060a 100%); --cap-cta-heading: #fff8f0; --cap-cta-text: #c4b4a8; --cap-mock-dot: #c9a44a; --cap-mock-dot-shadow: rgba(201, 164, 74, 0.45); --cap-mock-dot-secondary: #6b5a52; --cap-warn: #c94c4c; --cap-good: #4a9d6f; --cap-mid: #d4a020; --cap-matrix-feature: #d4af37; --cap-matrix-cut: #c94c4c; --cap-demo-strip-bg: linear-gradient(90deg, rgba(201, 164, 74, 0.14), rgba(201, 164, 74, 0.02)); --cap-demo-strip-border: rgba(201, 164, 74, 0.35); --chart-feature: #d4af37; --chart-promote: #8b7355; --chart-reprice: #5a9d72; --chart-cut: #b44a4a; --chart-gridline: rgba(184, 160, 140, 0.45); } /* ----------------------------------------------------------------------------- Field service — navy deck + safety amber ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--field { --cap-page-bg: #030a12; --cap-body-text: #b4c2d4; --cap-hero-glow1: rgba(245, 184, 0, 0.28); --cap-hero-dot: rgba(200, 220, 255, 0.035); --cap-hero-heading: #f0f6ff; --cap-hero-sub: #8fa4bc; --cap-nav-bg: rgba(3, 10, 18, 0.95); --cap-nav-border: rgba(245, 184, 0, 0.15); --cap-logo-a: #f0f6ff; --cap-logo-s: #f5b800; --cap-nav-link: #b4c2d4; --cap-nav-link-hover: #ffd54a; --cap-nav-link-hover-bg: rgba(245, 184, 0, 0.1); --cap-nav-dropdown-bg: #0a1628; --cap-nav-dropdown-border: rgba(245, 184, 0, 0.18); --cap-dropdown-link: #e8eef5; --cap-dropdown-link-hover-bg: rgba(245, 184, 0, 0.08); --cap-dropdown-link-hover: #ffd54a; --cap-accent: #f5b800; --cap-accent-hover: #ffd54a; --cap-btn-text-on-accent: #030a12; --cap-nav-toggle-border: rgba(245, 184, 0, 0.28); --cap-nav-toggle-hover: #f5b800; --cap-nav-toggle-bar: #e8eef5; --cap-drawer-overlay: rgba(2, 6, 12, 0.72); --cap-drawer-inner-bg: #061220; --cap-drawer-link: #e8eef5; --cap-drawer-link-hover-bg: rgba(245, 184, 0, 0.08); --cap-band-bg: #061422; --cap-band-border: rgba(245, 184, 0, 0.08); --cap-band-heading: #f0f6ff; --cap-band-text: #8fa4bc; --cap-panel-bg: #061422; --cap-panel-heading: #f0f6ff; --cap-panel-text: #8fa4bc; --cap-panel-eyebrow: #f5b800; --cap-card-bg: #e8f0fa; --cap-card-border: rgba(30, 64, 120, 0.14); --cap-card-heading: #0a1628; --cap-card-muted: #3d5a80; --cap-mockbar-bg: #d9e6f5; --cap-mockbar-title: #1e3a5f; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.5); --cap-footer-bg: #02060c; --cap-footer-border: rgba(245, 184, 0, 0.1); --cap-footer-text: #8fa4bc; --cap-footer-muted: #5c7088; --cap-footer-link-hover: #ffd54a; --cap-cta-bg: linear-gradient(165deg, #0c1c32 0%, #030a12 100%); --cap-cta-heading: #f0f6ff; --cap-cta-text: #8fa4bc; --cap-mock-dot: #f5b800; --cap-mock-dot-shadow: rgba(245, 184, 0, 0.4); --cap-mock-dot-secondary: #5c7088; --cap-warn: #ef4444; --cap-good: #22c55e; --cap-mid: #f59e0b; --cap-matrix-feature: #f5b800; --cap-matrix-cut: #ef4444; --cap-demo-strip-bg: linear-gradient(90deg, rgba(245, 184, 0, 0.12), rgba(245, 184, 0, 0.02)); --cap-demo-strip-border: rgba(245, 184, 0, 0.35); --chart-feature: #f5b800; --chart-promote: #64748b; --chart-reprice: #22c55e; --chart-cut: #ef4444; --chart-gridline: rgba(100, 116, 139, 0.45); } /* ----------------------------------------------------------------------------- Auto dealer — carbon + racing red ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--auto { --cap-page-bg: #050607; --cap-body-text: #b8bcc4; --cap-hero-glow1: rgba(239, 68, 68, 0.32); --cap-hero-dot: rgba(255, 255, 255, 0.04); --cap-hero-heading: #f8fafc; --cap-hero-sub: #94a3b8; --cap-nav-bg: rgba(5, 6, 7, 0.95); --cap-nav-border: rgba(239, 68, 68, 0.12); --cap-logo-a: #f8fafc; --cap-logo-s: #ef4444; --cap-nav-link: #cbd5e1; --cap-nav-link-hover: #fca5a5; --cap-nav-link-hover-bg: rgba(239, 68, 68, 0.1); --cap-nav-dropdown-bg: #0f1114; --cap-nav-dropdown-border: rgba(239, 68, 68, 0.15); --cap-dropdown-link: #e2e8f0; --cap-dropdown-link-hover-bg: rgba(239, 68, 68, 0.08); --cap-dropdown-link-hover: #fca5a5; --cap-accent: #ef4444; --cap-accent-hover: #f87171; --cap-btn-text-on-accent: #ffffff; --cap-nav-toggle-border: rgba(239, 68, 68, 0.25); --cap-nav-toggle-hover: #ef4444; --cap-nav-toggle-bar: #e2e8f0; --cap-drawer-overlay: rgba(0, 0, 0, 0.75); --cap-drawer-inner-bg: #0a0c0e; --cap-drawer-link: #e2e8f0; --cap-drawer-link-hover-bg: rgba(239, 68, 68, 0.08); --cap-band-bg: #0a0c10; --cap-band-border: rgba(239, 68, 68, 0.08); --cap-band-heading: #f8fafc; --cap-band-text: #94a3b8; --cap-panel-bg: #0a0c10; --cap-panel-heading: #f8fafc; --cap-panel-text: #94a3b8; --cap-panel-eyebrow: #ef4444; --cap-card-bg: #f8fafc; --cap-card-border: rgba(30, 41, 59, 0.12); --cap-card-heading: #0f172a; --cap-card-muted: #475569; --cap-mockbar-bg: #e2e8f0; --cap-mockbar-title: #334155; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #020203; --cap-footer-border: rgba(239, 68, 68, 0.08); --cap-footer-text: #94a3b8; --cap-footer-muted: #64748b; --cap-footer-link-hover: #fca5a5; --cap-cta-bg: linear-gradient(165deg, #1c0a0a 0%, #050607 100%); --cap-cta-heading: #f8fafc; --cap-cta-text: #94a3b8; --cap-mock-dot: #94a3b8; --cap-mock-dot-shadow: rgba(148, 163, 184, 0.35); --cap-mock-dot-secondary: #64748b; --cap-warn: #dc2626; --cap-good: #22c55e; --cap-mid: #f59e0b; --cap-matrix-feature: #ef4444; --cap-matrix-cut: #dc2626; --cap-demo-strip-bg: linear-gradient(90deg, rgba(239, 68, 68, 0.12), rgba(239, 68, 68, 0.02)); --cap-demo-strip-border: rgba(239, 68, 68, 0.35); --chart-feature: #ef4444; --chart-promote: #94a3b8; --chart-reprice: #22c55e; --chart-cut: #dc2626; --chart-gridline: rgba(148, 163, 184, 0.45); } /* ----------------------------------------------------------------------------- Manufacturing — oxide floor + signal orange ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--mfg { --cap-page-bg: #140a06; --cap-body-text: #d4c4b8; --cap-hero-glow1: rgba(249, 115, 22, 0.35); --cap-hero-dot: rgba(255, 220, 200, 0.04); --cap-hero-heading: #fff7ed; --cap-hero-sub: #b8a090; --cap-nav-bg: rgba(20, 10, 6, 0.95); --cap-nav-border: rgba(249, 115, 22, 0.15); --cap-logo-a: #fff7ed; --cap-logo-s: #fb923c; --cap-nav-link: #e7d5c8; --cap-nav-link-hover: #fdba74; --cap-nav-link-hover-bg: rgba(249, 115, 22, 0.1); --cap-nav-dropdown-bg: #1c100a; --cap-nav-dropdown-border: rgba(249, 115, 22, 0.18); --cap-dropdown-link: #fff7ed; --cap-dropdown-link-hover-bg: rgba(249, 115, 22, 0.08); --cap-dropdown-link-hover: #fdba74; --cap-accent: #ea580c; --cap-accent-hover: #fb923c; --cap-btn-text-on-accent: #1a0a04; --cap-nav-toggle-border: rgba(249, 115, 22, 0.28); --cap-nav-toggle-hover: #fb923c; --cap-nav-toggle-bar: #fff7ed; --cap-drawer-overlay: rgba(8, 3, 0, 0.72); --cap-drawer-inner-bg: #1a0c08; --cap-drawer-link: #fff7ed; --cap-drawer-link-hover-bg: rgba(249, 115, 22, 0.08); --cap-band-bg: #1a0e08; --cap-band-border: rgba(249, 115, 22, 0.08); --cap-band-heading: #fff7ed; --cap-band-text: #b8a090; --cap-panel-bg: #1a0e08; --cap-panel-heading: #fff7ed; --cap-panel-text: #b8a090; --cap-panel-eyebrow: #fb923c; --cap-card-bg: #fffbeb; --cap-card-border: rgba(120, 53, 15, 0.15); --cap-card-heading: #431407; --cap-card-muted: #7c2d12; --cap-mockbar-bg: #ffedd5; --cap-mockbar-title: #7c2d12; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #0a0503; --cap-footer-border: rgba(249, 115, 22, 0.1); --cap-footer-text: #b8a090; --cap-footer-muted: #8a7a6c; --cap-footer-link-hover: #fdba74; --cap-cta-bg: linear-gradient(165deg, #3a1508 0%, #140a06 100%); --cap-cta-heading: #fff7ed; --cap-cta-text: #b8a090; --cap-mock-dot: #ea580c; --cap-mock-dot-shadow: rgba(234, 88, 12, 0.4); --cap-mock-dot-secondary: #8a7a6c; --cap-warn: #b91c1c; --cap-good: #15803d; --cap-mid: #ca8a04; --cap-matrix-feature: #ea580c; --cap-matrix-cut: #b91c1c; --cap-demo-strip-bg: linear-gradient(90deg, rgba(249, 115, 22, 0.12), rgba(249, 115, 22, 0.02)); --cap-demo-strip-border: rgba(249, 115, 22, 0.35); --chart-feature: #ea580c; --chart-promote: #78716c; --chart-reprice: #16a34a; --chart-cut: #b91c1c; --chart-gridline: rgba(168, 162, 158, 0.45); } /* ----------------------------------------------------------------------------- Equipment rental — slate yard + electric teal ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--rental { --cap-page-bg: #061318; --cap-body-text: #b7c9ce; --cap-hero-glow1: rgba(20, 184, 166, 0.38); --cap-hero-dot: rgba(190, 245, 245, 0.035); --cap-hero-heading: #ecfeff; --cap-hero-sub: #9bb8c0; --cap-nav-bg: rgba(6, 19, 24, 0.95); --cap-nav-border: rgba(20, 184, 166, 0.16); --cap-logo-a: #ecfeff; --cap-logo-s: #2dd4bf; --cap-nav-link: #c8dadd; --cap-nav-link-hover: #5eead4; --cap-nav-link-hover-bg: rgba(20, 184, 166, 0.12); --cap-nav-dropdown-bg: #0b1f26; --cap-nav-dropdown-border: rgba(20, 184, 166, 0.2); --cap-dropdown-link: #ecfeff; --cap-dropdown-link-hover-bg: rgba(20, 184, 166, 0.1); --cap-dropdown-link-hover: #5eead4; --cap-accent: #14b8a6; --cap-accent-hover: #5eead4; --cap-btn-text-on-accent: #041316; --cap-nav-toggle-border: rgba(20, 184, 166, 0.3); --cap-nav-toggle-hover: #2dd4bf; --cap-nav-toggle-bar: #ecfeff; --cap-drawer-overlay: rgba(2, 9, 12, 0.75); --cap-drawer-inner-bg: #0b1f26; --cap-drawer-link: #ecfeff; --cap-drawer-link-hover-bg: rgba(20, 184, 166, 0.1); --cap-band-bg: #092027; --cap-band-border: rgba(20, 184, 166, 0.12); --cap-band-heading: #ecfeff; --cap-band-text: #9bb8c0; --cap-panel-bg: #092027; --cap-panel-heading: #ecfeff; --cap-panel-text: #9bb8c0; --cap-panel-eyebrow: #2dd4bf; --cap-card-bg: #eef8f7; --cap-card-border: rgba(8, 80, 76, 0.22); --cap-card-heading: #0f2f32; --cap-card-muted: #3f6468; --cap-mockbar-bg: #d3ece9; --cap-mockbar-title: #17464a; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #030b0e; --cap-footer-border: rgba(20, 184, 166, 0.12); --cap-footer-text: #a8bdc2; --cap-footer-muted: #6d858a; --cap-footer-link-hover: #5eead4; --cap-cta-bg: linear-gradient(165deg, #0a3c3b 0%, #061318 100%); --cap-cta-heading: #ecfeff; --cap-cta-text: #9bb8c0; --cap-mock-dot: #14b8a6; --cap-mock-dot-shadow: rgba(20, 184, 166, 0.42); --cap-mock-dot-secondary: #6d858a; --cap-warn: #f97316; --cap-good: #14b8a6; --cap-mid: #eab308; --cap-matrix-feature: #14b8a6; --cap-matrix-cut: #f97316; --cap-demo-strip-bg: linear-gradient(90deg, rgba(20, 184, 166, 0.18), rgba(20, 184, 166, 0.03)); --cap-demo-strip-border: rgba(20, 184, 166, 0.45); --chart-feature: #14b8a6; --chart-promote: #64748b; --chart-reprice: #22c55e; --chart-cut: #f97316; --chart-gridline: rgba(148, 163, 184, 0.45); } /* ----------------------------------------------------------------------------- Restoration — storm blue + emergency orange ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--restoration { --cap-page-bg: #07111f; --cap-body-text: #b8c6d8; --cap-hero-glow1: rgba(251, 146, 60, 0.4); --cap-hero-dot: rgba(190, 220, 255, 0.035); --cap-hero-heading: #f3f8ff; --cap-hero-sub: #9fb0c6; --cap-nav-bg: rgba(7, 17, 31, 0.95); --cap-nav-border: rgba(251, 146, 60, 0.16); --cap-logo-a: #f3f8ff; --cap-logo-s: #fb923c; --cap-nav-link: #d5deea; --cap-nav-link-hover: #fdba74; --cap-nav-link-hover-bg: rgba(251, 146, 60, 0.12); --cap-nav-dropdown-bg: #0d1a2d; --cap-nav-dropdown-border: rgba(251, 146, 60, 0.2); --cap-dropdown-link: #f3f8ff; --cap-dropdown-link-hover-bg: rgba(251, 146, 60, 0.1); --cap-dropdown-link-hover: #fdba74; --cap-accent: #fb923c; --cap-accent-hover: #fdba74; --cap-btn-text-on-accent: #111827; --cap-nav-toggle-border: rgba(251, 146, 60, 0.3); --cap-nav-toggle-hover: #fb923c; --cap-nav-toggle-bar: #f3f8ff; --cap-drawer-overlay: rgba(2, 8, 18, 0.76); --cap-drawer-inner-bg: #0d1a2d; --cap-drawer-link: #f3f8ff; --cap-drawer-link-hover-bg: rgba(251, 146, 60, 0.1); --cap-band-bg: #0d1a2d; --cap-band-border: rgba(251, 146, 60, 0.12); --cap-band-heading: #f3f8ff; --cap-band-text: #9fb0c6; --cap-panel-bg: #0d1a2d; --cap-panel-heading: #f3f8ff; --cap-panel-text: #9fb0c6; --cap-panel-eyebrow: #fb923c; --cap-card-bg: #f2f6fb; --cap-card-border: rgba(80, 95, 130, 0.22); --cap-card-heading: #132238; --cap-card-muted: #4d5e74; --cap-mockbar-bg: #dbe5f0; --cap-mockbar-title: #253a58; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #030812; --cap-footer-border: rgba(251, 146, 60, 0.12); --cap-footer-text: #aebbd0; --cap-footer-muted: #718099; --cap-footer-link-hover: #fdba74; --cap-cta-bg: linear-gradient(165deg, #24304a 0%, #07111f 100%); --cap-cta-heading: #f3f8ff; --cap-cta-text: #9fb0c6; --cap-mock-dot: #fb923c; --cap-mock-dot-shadow: rgba(251, 146, 60, 0.42); --cap-mock-dot-secondary: #718099; --cap-warn: #f97316; --cap-good: #38bdf8; --cap-mid: #facc15; --cap-matrix-feature: #fb923c; --cap-matrix-cut: #ef4444; --cap-demo-strip-bg: linear-gradient(90deg, rgba(251, 146, 60, 0.18), rgba(251, 146, 60, 0.03)); --cap-demo-strip-border: rgba(251, 146, 60, 0.45); --chart-feature: #fb923c; --chart-promote: #60a5fa; --chart-reprice: #38bdf8; --chart-cut: #ef4444; --chart-gridline: rgba(148, 163, 184, 0.45); } /* ----------------------------------------------------------------------------- Landscaping — route green + lime safety pop ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--landscaping { --cap-page-bg: #071408; --cap-body-text: #b8c9b4; --cap-hero-glow1: rgba(163, 230, 53, 0.42); --cap-hero-dot: rgba(210, 255, 180, 0.035); --cap-hero-heading: #f3ffe8; --cap-hero-sub: #a8bc9f; --cap-nav-bg: rgba(7, 20, 8, 0.95); --cap-nav-border: rgba(163, 230, 53, 0.16); --cap-logo-a: #f3ffe8; --cap-logo-s: #a3e635; --cap-nav-link: #d8e8d0; --cap-nav-link-hover: #bef264; --cap-nav-link-hover-bg: rgba(163, 230, 53, 0.12); --cap-nav-dropdown-bg: #0e2410; --cap-nav-dropdown-border: rgba(163, 230, 53, 0.2); --cap-dropdown-link: #f3ffe8; --cap-dropdown-link-hover-bg: rgba(163, 230, 53, 0.1); --cap-dropdown-link-hover: #bef264; --cap-accent: #84cc16; --cap-accent-hover: #bef264; --cap-btn-text-on-accent: #081308; --cap-nav-toggle-border: rgba(163, 230, 53, 0.3); --cap-nav-toggle-hover: #a3e635; --cap-nav-toggle-bar: #f3ffe8; --cap-drawer-overlay: rgba(2, 10, 3, 0.76); --cap-drawer-inner-bg: #0e2410; --cap-drawer-link: #f3ffe8; --cap-drawer-link-hover-bg: rgba(163, 230, 53, 0.1); --cap-band-bg: #0e2410; --cap-band-border: rgba(163, 230, 53, 0.12); --cap-band-heading: #f3ffe8; --cap-band-text: #a8bc9f; --cap-panel-bg: #0e2410; --cap-panel-heading: #f3ffe8; --cap-panel-text: #a8bc9f; --cap-panel-eyebrow: #a3e635; --cap-card-bg: #f1f8e8; --cap-card-border: rgba(50, 95, 25, 0.22); --cap-card-heading: #17310f; --cap-card-muted: #4f6a43; --cap-mockbar-bg: #ddebcb; --cap-mockbar-title: #2f4f23; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.52); --cap-footer-bg: #030a03; --cap-footer-border: rgba(163, 230, 53, 0.12); --cap-footer-text: #aebfa7; --cap-footer-muted: #72856b; --cap-footer-link-hover: #bef264; --cap-cta-bg: linear-gradient(165deg, #1f3f14 0%, #071408 100%); --cap-cta-heading: #f3ffe8; --cap-cta-text: #a8bc9f; --cap-mock-dot: #84cc16; --cap-mock-dot-shadow: rgba(132, 204, 22, 0.42); --cap-mock-dot-secondary: #72856b; --cap-warn: #eab308; --cap-good: #22c55e; --cap-mid: #84cc16; --cap-matrix-feature: #84cc16; --cap-matrix-cut: #ca8a04; --cap-demo-strip-bg: linear-gradient(90deg, rgba(132, 204, 22, 0.18), rgba(132, 204, 22, 0.03)); --cap-demo-strip-border: rgba(132, 204, 22, 0.45); --chart-feature: #84cc16; --chart-promote: #65a30d; --chart-reprice: #22c55e; --chart-cut: #ca8a04; --chart-gridline: rgba(148, 163, 120, 0.45); } /* ----------------------------------------------------------------------------- PE — midnight boardroom + fund gold ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--pe { --cap-page-bg: #05060a; --cap-body-text: #b4b8c8; --cap-hero-glow1: rgba(201, 168, 100, 0.32); --cap-hero-dot: rgba(220, 220, 255, 0.03); --cap-hero-heading: #faf8f3; --cap-hero-sub: #9ca0b0; --cap-nav-bg: rgba(5, 6, 10, 0.95); --cap-nav-border: rgba(201, 168, 100, 0.12); --cap-logo-a: #faf8f3; --cap-logo-s: #c9a86c; --cap-nav-link: #c8cad8; --cap-nav-link-hover: #e8d5a3; --cap-nav-link-hover-bg: rgba(201, 168, 100, 0.1); --cap-nav-dropdown-bg: #0c0e18; --cap-nav-dropdown-border: rgba(201, 168, 100, 0.15); --cap-dropdown-link: #e8e9f0; --cap-dropdown-link-hover-bg: rgba(201, 168, 100, 0.08); --cap-dropdown-link-hover: #e8d5a3; --cap-accent: #c9a86c; --cap-accent-hover: #dfc78a; --cap-btn-text-on-accent: #0a0c14; --cap-nav-toggle-border: rgba(201, 168, 100, 0.25); --cap-nav-toggle-hover: #dfc78a; --cap-nav-toggle-bar: #e8e9f0; --cap-drawer-overlay: rgba(0, 0, 0, 0.75); --cap-drawer-inner-bg: #080a12; --cap-drawer-link: #e8e9f0; --cap-drawer-link-hover-bg: rgba(201, 168, 100, 0.08); --cap-band-bg: #080a12; --cap-band-border: rgba(201, 168, 100, 0.08); --cap-band-heading: #faf8f3; --cap-band-text: #9ca0b0; --cap-panel-bg: #080a12; --cap-panel-heading: #faf8f3; --cap-panel-text: #9ca0b0; --cap-panel-eyebrow: #c9a86c; --cap-card-bg: #faf8f3; --cap-card-border: rgba(40, 44, 64, 0.12); --cap-card-heading: #0f1118; --cap-card-muted: #4b5068; --cap-mockbar-bg: #ece8df; --cap-mockbar-title: #2d3142; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #020204; --cap-footer-border: rgba(201, 168, 100, 0.08); --cap-footer-text: #9ca0b0; --cap-footer-muted: #6b7088; --cap-footer-link-hover: #e8d5a3; --cap-cta-bg: linear-gradient(165deg, #121420 0%, #05060a 100%); --cap-cta-heading: #faf8f3; --cap-cta-text: #9ca0b0; --cap-mock-dot: #c9a86c; --cap-mock-dot-shadow: rgba(201, 168, 100, 0.4); --cap-mock-dot-secondary: #6b7088; --cap-warn: #c2410c; --cap-good: #15803d; --cap-mid: #ca8a04; --cap-matrix-feature: #c9a86c; --cap-matrix-cut: #b45309; --cap-demo-strip-bg: linear-gradient(90deg, rgba(201, 168, 100, 0.12), rgba(201, 168, 100, 0.02)); --cap-demo-strip-border: rgba(201, 168, 100, 0.35); --chart-feature: #c9a86c; --chart-promote: #64748b; --chart-reprice: #16a34a; --chart-cut: #b45309; --chart-gridline: rgba(120, 124, 140, 0.45); } /* ----------------------------------------------------------------------------- Equine — deep forest + brass ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--equine { --cap-page-bg: #0b1410; --cap-body-text: #c4c8b8; --cap-hero-glow1: rgba(184, 146, 58, 0.32); --cap-hero-dot: rgba(240, 232, 210, 0.04); --cap-hero-heading: #f5f0e0; --cap-hero-sub: #9aa396; --cap-nav-bg: rgba(11, 20, 16, 0.95); --cap-nav-border: rgba(184, 146, 58, 0.14); --cap-logo-a: #f5f0e0; --cap-logo-s: #b8923a; --cap-nav-link: #c4c8b8; --cap-nav-link-hover: #d4b564; --cap-nav-link-hover-bg: rgba(184, 146, 58, 0.1); --cap-nav-dropdown-bg: #121c18; --cap-nav-dropdown-border: rgba(184, 146, 58, 0.18); --cap-dropdown-link: #e8e4d0; --cap-dropdown-link-hover-bg: rgba(184, 146, 58, 0.08); --cap-dropdown-link-hover: #d4b564; --cap-accent: #b8923a; --cap-accent-hover: #d4b564; --cap-btn-text-on-accent: #0b1410; --cap-nav-toggle-border: rgba(184, 146, 58, 0.28); --cap-nav-toggle-hover: #b8923a; --cap-nav-toggle-bar: #e8e4d0; --cap-drawer-overlay: rgba(5, 10, 8, 0.7); --cap-drawer-inner-bg: #0f1a16; --cap-drawer-link: #e8e4d0; --cap-drawer-link-hover-bg: rgba(184, 146, 58, 0.08); --cap-band-bg: #0f1a16; --cap-band-border: rgba(184, 146, 58, 0.08); --cap-band-heading: #f5f0e0; --cap-band-text: #9aa396; --cap-panel-bg: #0f1a16; --cap-panel-heading: #f5f0e0; --cap-panel-text: #9aa396; --cap-panel-eyebrow: #b8923a; --cap-card-bg: #f7f3e6; --cap-card-border: rgba(60, 80, 50, 0.14); --cap-card-heading: #1e2418; --cap-card-muted: #54604a; --cap-mockbar-bg: #ece4cc; --cap-mockbar-title: #3a4430; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.5); --cap-footer-bg: #060c0a; --cap-footer-border: rgba(184, 146, 58, 0.1); --cap-footer-text: #9aa396; --cap-footer-muted: #6a7466; --cap-footer-link-hover: #d4b564; --cap-cta-bg: linear-gradient(165deg, #1c2a20 0%, #0b1410 100%); --cap-cta-heading: #f5f0e0; --cap-cta-text: #9aa396; --cap-mock-dot: #b8923a; --cap-mock-dot-shadow: rgba(184, 146, 58, 0.4); --cap-mock-dot-secondary: #6a7466; --cap-warn: #c94c4c; --cap-good: #4a8d5f; --cap-mid: #d4a020; --cap-matrix-feature: #b8923a; --cap-matrix-cut: #c94c4c; --cap-demo-strip-bg: linear-gradient(90deg, rgba(184, 146, 58, 0.12), rgba(184, 146, 58, 0.02)); --cap-demo-strip-border: rgba(184, 146, 58, 0.35); --chart-feature: #b8923a; --chart-promote: #6a7466; --chart-reprice: #4a8d5f; --chart-cut: #c94c4c; --chart-gridline: rgba(120, 130, 110, 0.45); } /* ----------------------------------------------------------------------------- Row Crop — loam + harvest gold + chlorophyll ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--rowcrop { --cap-page-bg: #0d120a; --cap-body-text: #c8cab0; --cap-hero-glow1: rgba(212, 167, 44, 0.32); --cap-hero-dot: rgba(240, 232, 180, 0.04); --cap-hero-heading: #f6f2d8; --cap-hero-sub: #9ea38a; --cap-nav-bg: rgba(13, 18, 10, 0.95); --cap-nav-border: rgba(212, 167, 44, 0.15); --cap-logo-a: #f6f2d8; --cap-logo-s: #d4a72c; --cap-nav-link: #c8cab0; --cap-nav-link-hover: #e8c85a; --cap-nav-link-hover-bg: rgba(212, 167, 44, 0.1); --cap-nav-dropdown-bg: #141c10; --cap-nav-dropdown-border: rgba(212, 167, 44, 0.18); --cap-dropdown-link: #e8e8ce; --cap-dropdown-link-hover-bg: rgba(212, 167, 44, 0.08); --cap-dropdown-link-hover: #e8c85a; --cap-accent: #d4a72c; --cap-accent-hover: #e8c85a; --cap-btn-text-on-accent: #0d120a; --cap-nav-toggle-border: rgba(212, 167, 44, 0.28); --cap-nav-toggle-hover: #d4a72c; --cap-nav-toggle-bar: #e8e8ce; --cap-drawer-overlay: rgba(6, 10, 4, 0.7); --cap-drawer-inner-bg: #111810; --cap-drawer-link: #e8e8ce; --cap-drawer-link-hover-bg: rgba(212, 167, 44, 0.08); --cap-band-bg: #111810; --cap-band-border: rgba(212, 167, 44, 0.08); --cap-band-heading: #f6f2d8; --cap-band-text: #9ea38a; --cap-panel-bg: #111810; --cap-panel-heading: #f6f2d8; --cap-panel-text: #9ea38a; --cap-panel-eyebrow: #d4a72c; --cap-card-bg: #f8f4de; --cap-card-border: rgba(60, 70, 30, 0.14); --cap-card-heading: #1f2414; --cap-card-muted: #555f38; --cap-mockbar-bg: #ede4c0; --cap-mockbar-title: #3b4420; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.5); --cap-footer-bg: #070a06; --cap-footer-border: rgba(212, 167, 44, 0.1); --cap-footer-text: #9ea38a; --cap-footer-muted: #6a7260; --cap-footer-link-hover: #e8c85a; --cap-cta-bg: linear-gradient(165deg, #1e2610 0%, #0d120a 100%); --cap-cta-heading: #f6f2d8; --cap-cta-text: #9ea38a; --cap-mock-dot: #d4a72c; --cap-mock-dot-shadow: rgba(212, 167, 44, 0.4); --cap-mock-dot-secondary: #6a7260; --cap-warn: #c94c4c; --cap-good: #4a7c1f; --cap-mid: #d4a020; --cap-matrix-feature: #d4a72c; --cap-matrix-cut: #c94c4c; --cap-demo-strip-bg: linear-gradient(90deg, rgba(212, 167, 44, 0.12), rgba(212, 167, 44, 0.02)); --cap-demo-strip-border: rgba(212, 167, 44, 0.35); --chart-feature: #d4a72c; --chart-promote: #6a7260; --chart-reprice: #4a7c1f; --chart-cut: #c94c4c; --chart-gridline: rgba(120, 128, 108, 0.45); } /* ----------------------------------------------------------------------------- Estimator — graphite + blueprint blue + trowel copper ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--estimator { --cap-page-bg: #0e1014; --cap-body-text: #b8bfcc; --cap-hero-glow1: rgba(59, 130, 246, 0.30); --cap-hero-dot: rgba(220, 230, 255, 0.04); --cap-hero-heading: #f0f4fa; --cap-hero-sub: #8e9aad; --cap-nav-bg: rgba(14, 16, 20, 0.95); --cap-nav-border: rgba(59, 130, 246, 0.14); --cap-logo-a: #f0f4fa; --cap-logo-s: #3b82f6; --cap-nav-link: #b8bfcc; --cap-nav-link-hover: #7ba8fb; --cap-nav-link-hover-bg: rgba(59, 130, 246, 0.1); --cap-nav-dropdown-bg: #141820; --cap-nav-dropdown-border: rgba(59, 130, 246, 0.18); --cap-dropdown-link: #e2e8f0; --cap-dropdown-link-hover-bg: rgba(59, 130, 246, 0.08); --cap-dropdown-link-hover: #7ba8fb; --cap-accent: #3b82f6; --cap-accent-hover: #60a5fa; --cap-btn-text-on-accent: #0e1014; --cap-nav-toggle-border: rgba(59, 130, 246, 0.28); --cap-nav-toggle-hover: #3b82f6; --cap-nav-toggle-bar: #e2e8f0; --cap-drawer-overlay: rgba(5, 8, 14, 0.72); --cap-drawer-inner-bg: #11141a; --cap-drawer-link: #e2e8f0; --cap-drawer-link-hover-bg: rgba(59, 130, 246, 0.08); --cap-band-bg: #11141a; --cap-band-border: rgba(59, 130, 246, 0.08); --cap-band-heading: #f0f4fa; --cap-band-text: #8e9aad; --cap-panel-bg: #11141a; --cap-panel-heading: #f0f4fa; --cap-panel-text: #8e9aad; --cap-panel-eyebrow: #3b82f6; --cap-card-bg: #f3f6fb; --cap-card-border: rgba(30, 40, 60, 0.12); --cap-card-heading: #0f172a; --cap-card-muted: #475569; --cap-mockbar-bg: #dde4f0; --cap-mockbar-title: #334155; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #07090c; --cap-footer-border: rgba(59, 130, 246, 0.1); --cap-footer-text: #8e9aad; --cap-footer-muted: #64748b; --cap-footer-link-hover: #7ba8fb; --cap-cta-bg: linear-gradient(165deg, #101a2e 0%, #0e1014 100%); --cap-cta-heading: #f0f4fa; --cap-cta-text: #8e9aad; --cap-mock-dot: #3b82f6; --cap-mock-dot-shadow: rgba(59, 130, 246, 0.4); --cap-mock-dot-secondary: #64748b; --cap-warn: #ef4444; --cap-good: #22c55e; --cap-mid: #c0784a; --cap-matrix-feature: #3b82f6; --cap-matrix-cut: #ef4444; --cap-demo-strip-bg: linear-gradient(90deg, rgba(59, 130, 246, 0.12), rgba(59, 130, 246, 0.02)); --cap-demo-strip-border: rgba(59, 130, 246, 0.35); --chart-feature: #3b82f6; --chart-promote: #64748b; --chart-reprice: #22c55e; --chart-cut: #ef4444; --chart-gridline: rgba(100, 116, 139, 0.45); } /* ----------------------------------------------------------------------------- Retail — charcoal plum + magenta + cream ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--retail { --cap-page-bg: #140a12; --cap-body-text: #d4c4cc; --cap-hero-glow1: rgba(201, 67, 126, 0.32); --cap-hero-dot: rgba(255, 235, 245, 0.04); --cap-hero-heading: #fbeee2; --cap-hero-sub: #b89ca8; --cap-nav-bg: rgba(20, 10, 18, 0.95); --cap-nav-border: rgba(201, 67, 126, 0.14); --cap-logo-a: #fbeee2; --cap-logo-s: #c9437e; --cap-nav-link: #d4c4cc; --cap-nav-link-hover: #e87fa9; --cap-nav-link-hover-bg: rgba(201, 67, 126, 0.1); --cap-nav-dropdown-bg: #1c101a; --cap-nav-dropdown-border: rgba(201, 67, 126, 0.18); --cap-dropdown-link: #f4e4ec; --cap-dropdown-link-hover-bg: rgba(201, 67, 126, 0.08); --cap-dropdown-link-hover: #e87fa9; --cap-accent: #c9437e; --cap-accent-hover: #e26ba0; --cap-btn-text-on-accent: #140a12; --cap-nav-toggle-border: rgba(201, 67, 126, 0.28); --cap-nav-toggle-hover: #c9437e; --cap-nav-toggle-bar: #f4e4ec; --cap-drawer-overlay: rgba(8, 3, 6, 0.72); --cap-drawer-inner-bg: #180e16; --cap-drawer-link: #f4e4ec; --cap-drawer-link-hover-bg: rgba(201, 67, 126, 0.08); --cap-band-bg: #180e16; --cap-band-border: rgba(201, 67, 126, 0.08); --cap-band-heading: #fbeee2; --cap-band-text: #b89ca8; --cap-panel-bg: #180e16; --cap-panel-heading: #fbeee2; --cap-panel-text: #b89ca8; --cap-panel-eyebrow: #c9437e; --cap-card-bg: #f4ebdf; --cap-card-border: rgba(80, 30, 50, 0.14); --cap-card-heading: #281018; --cap-card-muted: #5a3f4c; --cap-mockbar-bg: #edd8df; --cap-mockbar-title: #4a2030; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #0a050a; --cap-footer-border: rgba(201, 67, 126, 0.1); --cap-footer-text: #b89ca8; --cap-footer-muted: #7a6570; --cap-footer-link-hover: #e87fa9; --cap-cta-bg: linear-gradient(165deg, #2c1020 0%, #140a12 100%); --cap-cta-heading: #fbeee2; --cap-cta-text: #b89ca8; --cap-mock-dot: #c9437e; --cap-mock-dot-shadow: rgba(201, 67, 126, 0.4); --cap-mock-dot-secondary: #7a6570; --cap-warn: #c94c4c; --cap-good: #4a9d6f; --cap-mid: #d4a020; --cap-matrix-feature: #c9437e; --cap-matrix-cut: #c94c4c; --cap-demo-strip-bg: linear-gradient(90deg, rgba(201, 67, 126, 0.12), rgba(201, 67, 126, 0.02)); --cap-demo-strip-border: rgba(201, 67, 126, 0.35); --chart-feature: #c9437e; --chart-promote: #8b6574; --chart-reprice: #4a9d6f; --chart-cut: #c94c4c; --chart-gridline: rgba(140, 120, 130, 0.45); } /* ----------------------------------------------------------------------------- Brokerage — ivory-on-ink + heritage green + champagne ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--brokerage { --cap-page-bg: #0a0e14; --cap-body-text: #c0c4b8; --cap-hero-glow1: rgba(31, 90, 58, 0.35); --cap-hero-dot: rgba(240, 240, 220, 0.035); --cap-hero-heading: #f4f1e4; --cap-hero-sub: #9a9f8c; --cap-nav-bg: rgba(10, 14, 20, 0.95); --cap-nav-border: rgba(205, 187, 146, 0.14); --cap-logo-a: #f4f1e4; --cap-logo-s: #cdbb92; --cap-nav-link: #c0c4b8; --cap-nav-link-hover: #e2d7b3; --cap-nav-link-hover-bg: rgba(205, 187, 146, 0.1); --cap-nav-dropdown-bg: #101520; --cap-nav-dropdown-border: rgba(205, 187, 146, 0.18); --cap-dropdown-link: #ece8d8; --cap-dropdown-link-hover-bg: rgba(205, 187, 146, 0.08); --cap-dropdown-link-hover: #e2d7b3; --cap-accent: #1f5a3a; --cap-accent-hover: #2f7a50; --cap-btn-text-on-accent: #f4f1e4; --cap-nav-toggle-border: rgba(205, 187, 146, 0.28); --cap-nav-toggle-hover: #cdbb92; --cap-nav-toggle-bar: #ece8d8; --cap-drawer-overlay: rgba(4, 6, 10, 0.72); --cap-drawer-inner-bg: #0e121c; --cap-drawer-link: #ece8d8; --cap-drawer-link-hover-bg: rgba(205, 187, 146, 0.08); --cap-band-bg: #0e121c; --cap-band-border: rgba(205, 187, 146, 0.08); --cap-band-heading: #f4f1e4; --cap-band-text: #9a9f8c; --cap-panel-bg: #0e121c; --cap-panel-heading: #f4f1e4; --cap-panel-text: #9a9f8c; --cap-panel-eyebrow: #cdbb92; --cap-card-bg: #f4f0e0; --cap-card-border: rgba(30, 50, 40, 0.14); --cap-card-heading: #141a18; --cap-card-muted: #4d5a52; --cap-mockbar-bg: #e6ddc3; --cap-mockbar-title: #2a3a30; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.55); --cap-footer-bg: #05070a; --cap-footer-border: rgba(205, 187, 146, 0.1); --cap-footer-text: #9a9f8c; --cap-footer-muted: #656a5e; --cap-footer-link-hover: #e2d7b3; --cap-cta-bg: linear-gradient(165deg, #102418 0%, #0a0e14 100%); --cap-cta-heading: #f4f1e4; --cap-cta-text: #9a9f8c; --cap-mock-dot: #1f5a3a; --cap-mock-dot-shadow: rgba(31, 90, 58, 0.35); --cap-mock-dot-secondary: #8a8274; --cap-warn: #b84a3e; --cap-good: #1f5a3a; --cap-mid: #cdbb92; --cap-matrix-feature: #1f5a3a; --cap-matrix-cut: #b84a3e; --cap-demo-strip-bg: linear-gradient(90deg, rgba(205, 187, 146, 0.14), rgba(205, 187, 146, 0.02)); --cap-demo-strip-border: rgba(205, 187, 146, 0.35); --chart-feature: #1f5a3a; --chart-promote: #8a8274; --chart-reprice: #2f7a50; --chart-cut: #b84a3e; --chart-gridline: rgba(140, 138, 120, 0.45); } /* ----------------------------------------------------------------------------- Dairy — barn green + cream + copper ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--dairy { --cap-page-bg: #0a1410; --cap-body-text: #c4c8bc; --cap-hero-glow1: rgba(184, 115, 51, 0.30); --cap-hero-dot: rgba(240, 234, 223, 0.04); --cap-hero-heading: #f0eadf; --cap-hero-sub: #9ca596; --cap-nav-bg: rgba(10, 20, 16, 0.95); --cap-nav-border: rgba(184, 115, 51, 0.14); --cap-logo-a: #f0eadf; --cap-logo-s: #b87333; --cap-nav-link: #c4c8bc; --cap-nav-link-hover: #d49158; --cap-nav-link-hover-bg: rgba(184, 115, 51, 0.1); --cap-nav-dropdown-bg: #121c16; --cap-nav-dropdown-border: rgba(184, 115, 51, 0.18); --cap-dropdown-link: #e4ddce; --cap-dropdown-link-hover-bg: rgba(184, 115, 51, 0.08); --cap-dropdown-link-hover: #d49158; --cap-accent: #b87333; --cap-accent-hover: #d49158; --cap-btn-text-on-accent: #0a1410; --cap-nav-toggle-border: rgba(184, 115, 51, 0.28); --cap-nav-toggle-hover: #b87333; --cap-nav-toggle-bar: #e4ddce; --cap-drawer-overlay: rgba(5, 10, 8, 0.72); --cap-drawer-inner-bg: #0e1814; --cap-drawer-link: #e4ddce; --cap-drawer-link-hover-bg: rgba(184, 115, 51, 0.08); --cap-band-bg: #0e1814; --cap-band-border: rgba(184, 115, 51, 0.08); --cap-band-heading: #f0eadf; --cap-band-text: #9ca596; --cap-panel-bg: #0e1814; --cap-panel-heading: #f0eadf; --cap-panel-text: #9ca596; --cap-panel-eyebrow: #b87333; --cap-card-bg: #f5efe0; --cap-card-border: rgba(60, 70, 40, 0.14); --cap-card-heading: #1a2418; --cap-card-muted: #4e5a42; --cap-mockbar-bg: #e8dec4; --cap-mockbar-title: #30402c; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.5); --cap-footer-bg: #050a08; --cap-footer-border: rgba(184, 115, 51, 0.1); --cap-footer-text: #9ca596; --cap-footer-muted: #6a7266; --cap-footer-link-hover: #d49158; --cap-cta-bg: linear-gradient(165deg, #1a2a1e 0%, #0a1410 100%); --cap-cta-heading: #f0eadf; --cap-cta-text: #9ca596; --cap-mock-dot: #b87333; --cap-mock-dot-shadow: rgba(184, 115, 51, 0.4); --cap-mock-dot-secondary: #6a7266; --cap-warn: #c94c4c; --cap-good: #4a8d5f; --cap-mid: #d4a020; --cap-matrix-feature: #b87333; --cap-matrix-cut: #c94c4c; --cap-demo-strip-bg: linear-gradient(90deg, rgba(184, 115, 51, 0.12), rgba(184, 115, 51, 0.02)); --cap-demo-strip-border: rgba(184, 115, 51, 0.35); --chart-feature: #b87333; --chart-promote: #6a7266; --chart-reprice: #4a8d5f; --chart-cut: #c94c4c; --chart-gridline: rgba(120, 130, 110, 0.45); } /* ----------------------------------------------------------------------------- Small Practice — clinical slate + medical teal + warm off-white ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--practice { --cap-page-bg: #0a1018; --cap-body-text: #b8c4cc; --cap-hero-glow1: rgba(20, 184, 166, 0.30); --cap-hero-dot: rgba(220, 240, 235, 0.04); --cap-hero-heading: #eef3f2; --cap-hero-sub: #8ea0a4; --cap-nav-bg: rgba(10, 16, 24, 0.95); --cap-nav-border: rgba(20, 184, 166, 0.14); --cap-logo-a: #eef3f2; --cap-logo-s: #14b8a6; --cap-nav-link: #b8c4cc; --cap-nav-link-hover: #5eead4; --cap-nav-link-hover-bg: rgba(20, 184, 166, 0.1); --cap-nav-dropdown-bg: #121820; --cap-nav-dropdown-border: rgba(20, 184, 166, 0.18); --cap-dropdown-link: #e0e8ec; --cap-dropdown-link-hover-bg: rgba(20, 184, 166, 0.08); --cap-dropdown-link-hover: #5eead4; --cap-accent: #14b8a6; --cap-accent-hover: #2dd4bf; --cap-btn-text-on-accent: #0a1018; --cap-nav-toggle-border: rgba(20, 184, 166, 0.28); --cap-nav-toggle-hover: #14b8a6; --cap-nav-toggle-bar: #e0e8ec; --cap-drawer-overlay: rgba(4, 8, 14, 0.72); --cap-drawer-inner-bg: #0d131c; --cap-drawer-link: #e0e8ec; --cap-drawer-link-hover-bg: rgba(20, 184, 166, 0.08); --cap-band-bg: #0d131c; --cap-band-border: rgba(20, 184, 166, 0.08); --cap-band-heading: #eef3f2; --cap-band-text: #8ea0a4; --cap-panel-bg: #0d131c; --cap-panel-heading: #eef3f2; --cap-panel-text: #8ea0a4; --cap-panel-eyebrow: #14b8a6; --cap-card-bg: #f5f7f8; --cap-card-border: rgba(20, 50, 60, 0.12); --cap-card-heading: #0f1c24; --cap-card-muted: #456068; --cap-mockbar-bg: #dce8e6; --cap-mockbar-title: #1e3a42; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.5); --cap-footer-bg: #05080c; --cap-footer-border: rgba(20, 184, 166, 0.1); --cap-footer-text: #8ea0a4; --cap-footer-muted: #627278; --cap-footer-link-hover: #5eead4; --cap-cta-bg: linear-gradient(165deg, #0f2a2a 0%, #0a1018 100%); --cap-cta-heading: #eef3f2; --cap-cta-text: #8ea0a4; --cap-mock-dot: #14b8a6; --cap-mock-dot-shadow: rgba(20, 184, 166, 0.4); --cap-mock-dot-secondary: #627278; --cap-warn: #ef4444; --cap-good: #22c55e; --cap-mid: #f59e0b; --cap-matrix-feature: #14b8a6; --cap-matrix-cut: #ef4444; --cap-demo-strip-bg: linear-gradient(90deg, rgba(20, 184, 166, 0.12), rgba(20, 184, 166, 0.02)); --cap-demo-strip-border: rgba(20, 184, 166, 0.35); --chart-feature: #14b8a6; --chart-promote: #64748b; --chart-reprice: #22c55e; --chart-cut: #ef4444; --chart-gridline: rgba(100, 120, 128, 0.45); } /* ----------------------------------------------------------------------------- Nursery — deep leaf + terracotta + sand ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--nursery { --cap-page-bg: #0b1510; --cap-body-text: #c0c8b8; --cap-hero-glow1: rgba(198, 93, 58, 0.30); --cap-hero-dot: rgba(236, 220, 194, 0.04); --cap-hero-heading: #f4ecdd; --cap-hero-sub: #94a28f; --cap-nav-bg: rgba(11, 21, 16, 0.95); --cap-nav-border: rgba(198, 93, 58, 0.14); --cap-logo-a: #f4ecdd; --cap-logo-s: #c65d3a; --cap-nav-link: #c0c8b8; --cap-nav-link-hover: #e08060; --cap-nav-link-hover-bg: rgba(198, 93, 58, 0.1); --cap-nav-dropdown-bg: #121d16; --cap-nav-dropdown-border: rgba(198, 93, 58, 0.18); --cap-dropdown-link: #e4ddc8; --cap-dropdown-link-hover-bg: rgba(198, 93, 58, 0.08); --cap-dropdown-link-hover: #e08060; --cap-accent: #c65d3a; --cap-accent-hover: #e08060; --cap-btn-text-on-accent: #0b1510; --cap-nav-toggle-border: rgba(198, 93, 58, 0.28); --cap-nav-toggle-hover: #c65d3a; --cap-nav-toggle-bar: #e4ddc8; --cap-drawer-overlay: rgba(5, 10, 7, 0.72); --cap-drawer-inner-bg: #0f1913; --cap-drawer-link: #e4ddc8; --cap-drawer-link-hover-bg: rgba(198, 93, 58, 0.08); --cap-band-bg: #0f1913; --cap-band-border: rgba(198, 93, 58, 0.08); --cap-band-heading: #f4ecdd; --cap-band-text: #94a28f; --cap-panel-bg: #0f1913; --cap-panel-heading: #f4ecdd; --cap-panel-text: #94a28f; --cap-panel-eyebrow: #c65d3a; --cap-card-bg: #ecdcc2; --cap-card-border: rgba(60, 70, 40, 0.16); --cap-card-heading: #1f2818; --cap-card-muted: #525d40; --cap-mockbar-bg: #dcc9a8; --cap-mockbar-title: #2e3c22; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.5); --cap-footer-bg: #070c08; --cap-footer-border: rgba(198, 93, 58, 0.1); --cap-footer-text: #94a28f; --cap-footer-muted: #667264; --cap-footer-link-hover: #e08060; --cap-cta-bg: linear-gradient(165deg, #1e2c18 0%, #0b1510 100%); --cap-cta-heading: #f4ecdd; --cap-cta-text: #94a28f; --cap-mock-dot: #c65d3a; --cap-mock-dot-shadow: rgba(198, 93, 58, 0.4); --cap-mock-dot-secondary: #667264; --cap-warn: #c94c4c; --cap-good: #4a8d5f; --cap-mid: #d4a020; --cap-matrix-feature: #c65d3a; --cap-matrix-cut: #c94c4c; --cap-demo-strip-bg: linear-gradient(90deg, rgba(198, 93, 58, 0.12), rgba(198, 93, 58, 0.02)); --cap-demo-strip-border: rgba(198, 93, 58, 0.35); --chart-feature: #c65d3a; --chart-promote: #667264; --chart-reprice: #4a8d5f; --chart-cut: #c94c4c; --chart-gridline: rgba(120, 130, 108, 0.45); } /* ----------------------------------------------------------------------------- Visual punch pass — distinct signature colors per new page Each override set rewires the full accent chain so hero glow, mock bars, card trim, and CTAs all share a single vivid, page-specific color. ----------------------------------------------------------------------------- */ /* Equine — deep forest + brass (bolder, warmer brass + deeper forest base) */ body.cap-theme.cap-theme--equine { --cap-page-bg: #0a1a12; --cap-hero-glow1: rgba(212, 148, 46, 0.55); --cap-accent: #d4942e; --cap-accent-hover: #ecb456; --cap-nav-link-hover: #ecb456; --cap-nav-link-hover-bg: rgba(212, 148, 46, 0.14); --cap-panel-eyebrow: #d4942e; --cap-mock-dot: #d4942e; --cap-mock-dot-shadow: rgba(212, 148, 46, 0.42); --cap-matrix-feature: #d4942e; --cap-card-bg: #f4ebd4; --cap-card-border: rgba(90, 60, 20, 0.22); --cap-mockbar-bg: #e6d9b4; --cap-demo-strip-bg: linear-gradient(90deg, rgba(212, 148, 46, 0.18), rgba(212, 148, 46, 0.03)); --cap-demo-strip-border: rgba(212, 148, 46, 0.48); --cap-band-border: rgba(212, 148, 46, 0.14); --cap-cta-bg: linear-gradient(165deg, #1f3424 0%, #0a1a12 100%); } /* Row Crop — rich loam earth + harvest gold with more depth */ body.cap-theme.cap-theme--rowcrop { --cap-page-bg: #121a0c; --cap-hero-glow1: rgba(230, 176, 36, 0.55); --cap-accent: #e6b024; --cap-accent-hover: #f2c84e; --cap-nav-link-hover: #f2c84e; --cap-nav-link-hover-bg: rgba(230, 176, 36, 0.14); --cap-panel-eyebrow: #e6b024; --cap-mock-dot: #e6b024; --cap-mock-dot-shadow: rgba(230, 176, 36, 0.42); --cap-matrix-feature: #e6b024; --cap-card-bg: #f4ecc8; --cap-card-border: rgba(95, 75, 18, 0.22); --cap-mockbar-bg: #e7d8a4; --cap-demo-strip-bg: linear-gradient(90deg, rgba(230, 176, 36, 0.18), rgba(230, 176, 36, 0.03)); --cap-demo-strip-border: rgba(230, 176, 36, 0.48); --cap-band-border: rgba(230, 176, 36, 0.14); --cap-cta-bg: linear-gradient(165deg, #2a3414 0%, #121a0c 100%); } /* Estimator — cobalt blueprint with stronger saturation */ body.cap-theme.cap-theme--estimator { --cap-page-bg: #081224; --cap-hero-glow1: rgba(56, 132, 255, 0.55); --cap-accent: #2f7ff7; --cap-accent-hover: #5a9cff; --cap-nav-link-hover: #7db1ff; --cap-nav-link-hover-bg: rgba(56, 132, 255, 0.14); --cap-panel-eyebrow: #2f7ff7; --cap-mock-dot: #2f7ff7; --cap-mock-dot-shadow: rgba(56, 132, 255, 0.42); --cap-matrix-feature: #2f7ff7; --cap-card-bg: #eef3fb; --cap-card-border: rgba(20, 50, 110, 0.22); --cap-mockbar-bg: #d3deee; --cap-demo-strip-bg: linear-gradient(90deg, rgba(56, 132, 255, 0.18), rgba(56, 132, 255, 0.03)); --cap-demo-strip-border: rgba(56, 132, 255, 0.48); --cap-band-border: rgba(56, 132, 255, 0.14); --cap-cta-bg: linear-gradient(165deg, #0f2550 0%, #081224 100%); } /* Retail — plum ink + hot magenta */ body.cap-theme.cap-theme--retail { --cap-page-bg: #1a0a1a; --cap-hero-glow1: rgba(228, 60, 132, 0.55); --cap-accent: #e43c84; --cap-accent-hover: #f06aa5; --cap-nav-link-hover: #f48fbd; --cap-nav-link-hover-bg: rgba(228, 60, 132, 0.14); --cap-panel-eyebrow: #e43c84; --cap-mock-dot: #e43c84; --cap-mock-dot-shadow: rgba(228, 60, 132, 0.42); --cap-matrix-feature: #e43c84; --cap-card-bg: #f7e8ee; --cap-card-border: rgba(100, 20, 55, 0.22); --cap-mockbar-bg: #ead1dc; --cap-demo-strip-bg: linear-gradient(90deg, rgba(228, 60, 132, 0.18), rgba(228, 60, 132, 0.03)); --cap-demo-strip-border: rgba(228, 60, 132, 0.48); --cap-band-border: rgba(228, 60, 132, 0.14); --cap-cta-bg: linear-gradient(165deg, #33142a 0%, #1a0a1a 100%); } /* Brokerage — emerald jewel on deep ink */ body.cap-theme.cap-theme--brokerage { --cap-page-bg: #061812; --cap-hero-glow1: rgba(50, 165, 110, 0.55); --cap-accent: #2ea371; --cap-accent-hover: #4fc291; --cap-nav-link-hover: #7dd7ae; --cap-nav-link-hover-bg: rgba(50, 165, 110, 0.14); --cap-panel-eyebrow: #2ea371; --cap-mock-dot: #2ea371; --cap-mock-dot-shadow: rgba(50, 165, 110, 0.42); --cap-matrix-feature: #2ea371; --cap-card-bg: #e8f4ec; --cap-card-border: rgba(15, 70, 45, 0.22); --cap-mockbar-bg: #d0e5d8; --cap-demo-strip-bg: linear-gradient(90deg, rgba(50, 165, 110, 0.18), rgba(50, 165, 110, 0.03)); --cap-demo-strip-border: rgba(50, 165, 110, 0.48); --cap-band-border: rgba(50, 165, 110, 0.14); --cap-cta-bg: linear-gradient(165deg, #10301f 0%, #061812 100%); --cap-btn-text-on-accent: #061812; --cap-good: #2ea371; } /* Dairy — milking-parlor red on cream + deep barn green base (distinct from MFG) */ body.cap-theme.cap-theme--dairy { --cap-page-bg: #100a0a; --cap-hero-glow1: rgba(210, 66, 58, 0.52); --cap-accent: #d2423a; --cap-accent-hover: #e66a62; --cap-nav-link-hover: #f0928a; --cap-nav-link-hover-bg: rgba(210, 66, 58, 0.14); --cap-panel-eyebrow: #d2423a; --cap-logo-s: #d2423a; --cap-mock-dot: #d2423a; --cap-mock-dot-shadow: rgba(210, 66, 58, 0.42); --cap-matrix-feature: #d2423a; --cap-card-bg: #f5ebde; --cap-card-border: rgba(100, 40, 30, 0.22); --cap-mockbar-bg: #ead7c2; --cap-demo-strip-bg: linear-gradient(90deg, rgba(210, 66, 58, 0.18), rgba(210, 66, 58, 0.03)); --cap-demo-strip-border: rgba(210, 66, 58, 0.48); --cap-band-border: rgba(210, 66, 58, 0.14); --cap-cta-bg: linear-gradient(165deg, #2a0e0a 0%, #100a0a 100%); --cap-matrix-cut: #9a2e2a; } /* Nursery — deep leaf green accent on terracotta earth base (distinct from MFG/Dairy) */ body.cap-theme.cap-theme--nursery { --cap-page-bg: #0d1a0c; --cap-hero-glow1: rgba(88, 170, 72, 0.52); --cap-accent: #58aa48; --cap-accent-hover: #7ec26f; --cap-nav-link-hover: #9fd392; --cap-nav-link-hover-bg: rgba(88, 170, 72, 0.14); --cap-panel-eyebrow: #58aa48; --cap-logo-s: #58aa48; --cap-mock-dot: #58aa48; --cap-mock-dot-shadow: rgba(88, 170, 72, 0.42); --cap-matrix-feature: #58aa48; --cap-card-bg: #f0e7d2; --cap-card-border: rgba(40, 70, 25, 0.22); --cap-mockbar-bg: #ddcca6; --cap-demo-strip-bg: linear-gradient(90deg, rgba(88, 170, 72, 0.18), rgba(88, 170, 72, 0.03)); --cap-demo-strip-border: rgba(88, 170, 72, 0.48); --cap-band-border: rgba(88, 170, 72, 0.14); --cap-cta-bg: linear-gradient(165deg, #18301a 0%, #0d1a0c 100%); --cap-btn-text-on-accent: #0d1a0c; --cap-good: #58aa48; } /* ============================================================================= Shared application (all cap-theme pages) ============================================================================= */ body.cap-theme .copper, body.cap-theme .cta-headline .copper { color: var(--cap-accent) !important; } /* Hero */ body.cap-theme .cap-hero { background: var(--cap-page-bg); color: var(--cap-hero-heading); position: relative; isolation: isolate; } body.cap-theme .cap-hero .hero-bg { background-image: radial-gradient(ellipse 65% 55% at 50% 30%, var(--cap-hero-glow1), transparent 70%), radial-gradient(circle at 1px 1px, var(--cap-hero-dot) 1px, transparent 1.2px); background-size: auto, 28px 28px; mask-image: radial-gradient(ellipse 90% 80% at 50% 40%, #000 50%, transparent 100%); -webkit-mask-image: radial-gradient(ellipse 90% 80% at 50% 40%, #000 50%, transparent 100%); } body.cap-theme .cap-hero::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse 120% 80% at 50% 120%, rgba(0, 0, 0, 0.45), transparent 60%); z-index: 0; } body.cap-theme .cap-hero .w { position: relative; z-index: 1; } body.cap-theme .cap-hero-eyebrow { color: var(--cap-accent); border-color: var(--cap-eyebrow-border, rgba(255, 255, 255, 0.2)); background: var(--cap-eyebrow-bg, rgba(255, 255, 255, 0.06)); } body.cap-theme .cap-hero h1 { color: var(--cap-hero-heading); text-shadow: 0 10px 30px rgba(0, 0, 0, 0.32); } body.cap-theme .cap-hero h1 .copper { color: var(--cap-accent) !important; } body.cap-theme .cap-hero-sub { color: var(--cap-hero-sub); } body.cap-theme .cap-hero-kicker { font-size: 1.125rem; font-weight: 500; line-height: 1.5; margin: 0.5rem auto 0; max-width: 520px; color: var(--cap-hero-heading); } body.cap-theme .cap-hero-kicker-link { color: var(--cap-accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; } body.cap-theme .cap-hero-kicker-link:hover { color: var(--cap-accent-hover); } body.cap-theme .cap-hero-kicker-sep { color: var(--cap-hero-sub); padding: 0 0.25rem; } body.cap-theme .ai-band-section .ai-proof a { color: var(--cap-accent); text-decoration: underline; text-underline-offset: 3px; } body.cap-theme .ai-band-section .ai-proof a:hover { color: var(--cap-accent-hover); } body.cap-theme a.cap-tile, body.cap-theme a.cap-tile:visited { color: inherit; } body.cap-theme a.cap-tile:focus-visible { outline: 2px solid var(--cap-accent); outline-offset: 3px; } body.cap-theme .cap-hero-decision { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.12); color: var(--cap-hero-sub); } body.cap-theme .cap-hero-decision::before { background: var(--cap-accent); box-shadow: 0 0 0 4px var(--cap-accent-glow, rgba(255, 255, 255, 0.12)); } /* Mockup shell */ body.cap-theme .cap-mockup { background: var(--cap-card-bg); border-color: var(--cap-card-border); box-shadow: var(--cap-shadow-mockup), 0 0 0 1px rgba(255, 255, 255, 0.03) inset; border-top: 3px solid var(--cap-accent); } body.cap-theme .cap-mockup-bar { background: var(--cap-mockbar-bg); border-bottom-color: var(--cap-card-border); } body.cap-theme .cap-mockup-bar .title { color: var(--cap-mockbar-title); } body.cap-theme .cap-mockup-body { color: var(--cap-card-heading); } /* Mid band (detail pages) */ body.cap-theme main > section.s:not(.s-white):not(.s-cta) .s-eyebrow { color: var(--cap-accent); } /* Index: light panel section */ body.cap-theme .s.s-white .s-eyebrow { color: var(--cap-accent); } /* Three-column cards */ body.cap-theme .cap-three-card { background: var(--cap-card-bg); border-color: var(--cap-card-border); border-top-color: var(--cap-accent); box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22); } body.cap-theme .cap-three-label { color: var(--cap-accent); } body.cap-theme .cap-three-card h3 { color: var(--cap-card-heading); } body.cap-theme .cap-three-card li { color: var(--cap-card-muted); } body.cap-theme .cap-three-card li::before { background: var(--cap-accent); } body.cap-theme .cap-delivery { background: var(--cap-delivery-bg, var(--cap-mockbar-bg)); border-color: var(--cap-card-border); border-left-color: var(--cap-accent); color: var(--cap-card-heading); box-shadow: 0 10px 26px rgba(0, 0, 0, 0.2); } body.cap-theme .cap-delivery strong { color: var(--cap-accent); } body.cap-theme .cap-delivery-icon { background: var(--cap-delivery-icon-bg, rgba(255, 255, 255, 0.08)); color: var(--cap-accent); } body.cap-theme .cap-demo-strip { background: var(--cap-demo-strip-bg); border-color: var(--cap-demo-strip-border); } body.cap-theme .cap-demo-strip-left { color: var(--cap-card-heading); } body.cap-theme .cap-demo-strip-left strong { color: var(--cap-accent); } body.cap-theme .cap-demo-strip-btn { background: var(--cap-accent); color: var(--cap-btn-text-on-accent); } body.cap-theme .cap-demo-strip-btn:hover { background: var(--cap-accent-hover); } /* AI bands / briefs */ body.cap-theme .ai-band-section { background: var(--cap-band-bg, var(--cap-page-bg)); border-top-color: var(--cap-band-border); border-bottom-color: var(--cap-band-border); } body.cap-theme .ai-band .s-intro h2 { color: var(--cap-band-heading); } body.cap-theme .ai-band .s-intro > p { color: var(--cap-band-text); } body.cap-theme .ai-card { background: var(--cap-panel-bg); border-color: var(--cap-band-border, var(--cap-card-border)); box-shadow: 0 20px 42px rgba(0, 0, 0, 0.26); } body.cap-theme .ai-card-eyebrow, body.cap-theme .ai-proof strong, body.cap-theme .ai-brief-label, body.cap-theme .ai-assist-label { color: var(--cap-accent); } body.cap-theme .ai-card h3 { color: var(--cap-band-heading); } body.cap-theme .ai-card p, body.cap-theme .ai-proof { color: var(--cap-band-text); } body.cap-theme .ai-brief-copy h3 { color: var(--cap-card-heading); } body.cap-theme .ai-brief-copy p { color: var(--cap-card-muted); } body.cap-theme .ai-brief-card { background: var(--cap-card-bg); border-color: var(--cap-card-border); box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22); } body.cap-theme .ai-brief-meta { border-bottom-color: var(--cap-card-border); color: var(--cap-card-muted); } body.cap-theme .ai-brief-list li { color: var(--cap-card-muted); } body.cap-theme .ai-brief-title, body.cap-theme .ai-brief-note, body.cap-theme .ai-assist p { color: var(--cap-card-heading); } body.cap-theme .ai-brief-list li::before { background: var(--cap-accent); } body.cap-theme .ai-brief-note { border-top-color: var(--cap-card-border); } body.cap-theme .ai-brief-note strong, body.cap-theme .ai-assist strong { color: var(--cap-accent); } body.cap-theme .ai-assist { background: var(--cap-delivery-bg, var(--cap-mockbar-bg)); border-color: var(--cap-card-border); border-left-color: var(--cap-accent); } /* Tiles */ body.cap-theme .cap-tile { background: var(--cap-card-bg); border-color: var(--cap-card-border); } body.cap-theme .cap-tile:hover { border-color: var(--cap-accent); box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3), 0 0 0 1px var(--cap-card-border); } body.cap-theme .cap-tile-tag { color: var(--cap-accent); } body.cap-theme .cap-group-eyebrow { color: var(--cap-accent); } body.cap-theme .cap-group-intro { color: var(--cap-panel-text); } body.cap-theme .nav-dropdown-label { color: var(--cap-nav-link); opacity: 0.6; } body.cap-theme .nav-dropdown-label:not(:first-child) { border-top-color: var(--cap-nav-dropdown-border); } body.cap-theme .cap-tile h3 { color: var(--cap-card-heading); } body.cap-theme .cap-tile p { color: var(--cap-card-muted); } body.cap-theme .cap-tile-meta { border-top-color: var(--cap-card-border); } body.cap-theme .cap-tile-outcome { color: var(--cap-card-heading); } body.cap-theme .cap-tile-outcome strong { color: var(--cap-accent); } body.cap-theme .cap-tile-arrow { color: var(--cap-accent); } body.cap-theme .cap-tile-custom .cap-tile-cta { color: var(--cap-accent); } body.cap-theme .cap-tile-custom .cap-tile-cta:hover { color: var(--cap-accent-hover); } body.cap-theme .cap-tile-live { background: var(--cap-accent); color: var(--cap-btn-text-on-accent); } /* CTA */ body.cap-theme .s-cta { background: var(--cap-cta-bg); } body.cap-theme .s-cta .cta-headline { color: var(--cap-cta-heading); } body.cap-theme .s-cta .cta-p { color: var(--cap-cta-text); } body.cap-theme .s-cta .btn-primary { background: var(--cap-accent); color: var(--cap-btn-text-on-accent); box-shadow: 0 4px 24px rgba(0, 0, 0, 0.25); } body.cap-theme .s-cta .btn-primary:hover { background: var(--cap-accent-hover); } body.cap-theme .mobile-nav-cta.btn-primary { background: var(--cap-accent); color: var(--cap-btn-text-on-accent); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); } body.cap-theme .mobile-nav-cta.btn-primary:hover { background: var(--cap-accent-hover); } /* Mockups inside capability cards */ body.cap-theme .mock-matrix-yaxis, body.cap-theme .mock-matrix-xaxis { color: var(--cap-card-muted); } body.cap-theme .mock-matrix-plot { background: linear-gradient(rgba(43, 43, 43, 0.08), rgba(43, 43, 43, 0.08)) center / 1px 100% no-repeat, linear-gradient(rgba(43, 43, 43, 0.08), rgba(43, 43, 43, 0.08)) center / 100% 1px no-repeat, var(--cap-mockbar-bg); border-color: var(--cap-card-border); } body.cap-theme .mock-matrix-quad.star { color: var(--cap-matrix-feature); } body.cap-theme .mock-matrix-quad.dog { color: var(--cap-matrix-cut); } body.cap-theme .mock-matrix-dot { background: var(--cap-mock-dot); box-shadow: 0 0 0 3px var(--cap-mock-dot-shadow); } body.cap-theme .mock-matrix-dot.lg { box-shadow: 0 0 0 5px var(--cap-mock-dot-shadow); } body.cap-theme .mock-matrix-dot.sm { background: var(--cap-mock-dot-secondary); box-shadow: 0 0 0 3px rgba(100, 100, 100, 0.2); } body.cap-theme .mock-matrix-dot.warn { background: var(--cap-warn); box-shadow: 0 0 0 3px rgba(200, 60, 60, 0.22); } body.cap-theme .mock-list-head { color: var(--cap-card-muted); border-bottom-color: var(--cap-card-border); } body.cap-theme .mock-list-row { background: var(--cap-mockbar-bg); color: var(--cap-card-heading); } body.cap-theme .mock-list-row.warn { background: rgba(239, 68, 68, 0.08); border-color: rgba(239, 68, 68, 0.28); } body.cap-theme .mock-bar { background: rgba(0, 0, 0, 0.06); } body.cap-theme .mock-bar span { background: var(--cap-mock-dot); } body.cap-theme .mock-bar.low span { background: var(--cap-warn); } body.cap-theme .mock-bar.mid span { background: var(--cap-mid); } body.cap-theme .mock-list-val.warn { color: var(--cap-warn); } body.cap-theme .mock-tag { background: rgba(0, 0, 0, 0.05); color: var(--cap-accent); } body.cap-theme .mock-tag.warn { background: rgba(239, 68, 68, 0.1); color: var(--cap-warn); } body.cap-theme .mock-tag.good { background: rgba(34, 197, 94, 0.1); color: var(--cap-good); } body.cap-theme .mock-tag.neutral { background: rgba(0, 0, 0, 0.05); color: var(--cap-mock-dot-secondary); } body.cap-theme .mock-table th { color: var(--cap-card-muted); border-bottom-color: var(--cap-card-border); } body.cap-theme .mock-table td { color: var(--cap-card-heading); border-bottom-color: rgba(0, 0, 0, 0.06); } body.cap-theme .mock-stack-label { color: var(--cap-card-heading); } body.cap-theme .mock-stack-bars { background: rgba(0, 0, 0, 0.06); } body.cap-theme .mock-stack-bars .est { background: var(--cap-mock-dot-secondary); } body.cap-theme .mock-stack-bars .act { background: var(--cap-mock-dot); } body.cap-theme .mock-stack-bars .act.over { background: var(--cap-warn); } body.cap-theme .mock-stack-variance.over { color: var(--cap-warn); } body.cap-theme .mock-stack-variance.good { color: var(--cap-good); } body.cap-theme .mock-signal-head { color: var(--cap-card-muted); border-bottom-color: var(--cap-card-border); } body.cap-theme .mock-signal-row { background: var(--cap-mockbar-bg); color: var(--cap-card-heading); } body.cap-theme .mock-signal-row.warn { background: rgba(239, 68, 68, 0.08); border-color: rgba(239, 68, 68, 0.28); } body.cap-theme .mock-signal-stat.good { color: var(--cap-good); } body.cap-theme .mock-signal-stat.warn { color: var(--cap-warn); } body.cap-theme .mock-waterline-label { color: var(--cap-card-heading); } body.cap-theme .mock-waterline-track { border-color: var(--cap-card-border); } body.cap-theme .mock-waterline-floor { background: rgba(0, 0, 0, 0.4); } body.cap-theme .mock-waterline-marker.above { background: var(--cap-good); } body.cap-theme .mock-waterline-marker.below { background: var(--cap-warn); } body.cap-theme .mock-waterline-action { color: var(--cap-card-heading); } body.cap-theme .mock-waterline-action.warn { color: var(--cap-warn); } body.cap-theme .mock-waterline-legend { color: var(--cap-card-muted); } body.cap-theme .mock-dash-tile, body.cap-theme .mock-funnel-step, body.cap-theme .mock-inv-row { background: var(--cap-mockbar-bg); border-color: var(--cap-card-border); color: var(--cap-card-heading); } body.cap-theme .mock-dash-tile { color: var(--cap-card-heading); } body.cap-theme .mock-dash-label, body.cap-theme .mock-line-legend, body.cap-theme .mock-line-caption, body.cap-theme .mock-field-map-key, body.cap-theme .mock-trend-axes, body.cap-theme .mock-cohort-legend, body.cap-theme .mock-scatter-axis, body.cap-theme .mock-inv-prob-label, body.cap-theme .mock-dash-sub, body.cap-theme .mock-dash-spark-foot, body.cap-theme .mock-scatter-qlab, body.cap-theme .mock-chart-yaxis, body.cap-theme .mock-chart-xaxis, body.cap-theme .mock-auto-hud-panel-meta, body.cap-theme .mock-auto-gauge-label, body.cap-theme .mock-auto-meter-scale, body.cap-theme .mock-auto-meter-score-max, body.cap-theme .mock-auto-bucket-label, body.cap-theme .mock-auto-bucket-note, body.cap-theme .mock-auto-tile-label, body.cap-theme .mock-auto-tile-sub, body.cap-theme .mock-auto-vin-meta { color: var(--cap-card-muted); } body.cap-theme .mock-dash-summary { border-color: var(--cap-card-border); color: var(--cap-card-heading); } body.cap-theme .mock-dash-summary strong { color: var(--cap-card-muted); } body.cap-theme .mock-stat-row { background: rgba(0, 0, 0, 0.04); border-color: var(--cap-card-border); color: var(--cap-card-heading); } body.cap-theme .mock-compact-table { color: var(--cap-card-heading); } body.cap-theme .mock-compact-table th { color: var(--cap-card-muted); border-bottom-color: var(--cap-card-border); } body.cap-theme .mock-compact-table td { border-bottom-color: var(--cap-card-border); } body.cap-theme .mock-heat-val { color: rgba(15, 23, 42, 0.82); } body.cap-theme .mock-heat-cell.w3 .mock-heat-val { color: rgba(255, 255, 255, 0.95); } body.cap-theme .mock-dash-val, body.cap-theme .mock-waterfall-val, body.cap-theme .mock-pe-heat-label { color: var(--cap-card-heading); } body.cap-theme .mock-dash-delta { color: var(--cap-good); } body.cap-theme .mock-dash-delta.down { color: var(--cap-warn); } body.cap-theme .mock-dash-spark { color: var(--cap-mock-dot); } body.cap-theme .mock-line-chart, body.cap-theme .mock-trend-chart, body.cap-theme .mock-cohort-chart { background: rgba(0, 0, 0, 0.04); border-color: var(--cap-card-border); } body.cap-theme .mock-scatter { background: linear-gradient(var(--cap-card-border), var(--cap-card-border)) center / 1px 100% no-repeat, linear-gradient(var(--cap-card-border), var(--cap-card-border)) center / 100% 1px no-repeat, rgba(0, 0, 0, 0.04); border-color: var(--cap-card-border); } body.cap-theme .mock-line-swatch { background: var(--cap-mock-dot); } body.cap-theme .mock-line-swatch.alt { background: var(--cap-mock-dot-secondary); opacity: 0.75; } body.cap-theme .mock-line-chart .mock-line-series-a { stroke: var(--cap-mock-dot); } body.cap-theme .mock-line-chart .mock-line-series-b { stroke: var(--cap-mock-dot-secondary); opacity: 0.75; } body.cap-theme .mock-trend-chart .mock-trend-line-a { stroke: var(--cap-mock-dot); } body.cap-theme .mock-trend-chart .mock-trend-line-b { stroke: var(--cap-mock-dot-secondary); opacity: 0.75; } body.cap-theme .mock-cohort-chart .mock-cohort-line { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; } body.cap-theme .mock-cohort-chart .mock-cohort-line.l1 { stroke: var(--cap-mock-dot); } body.cap-theme .mock-cohort-chart .mock-cohort-line.l2 { stroke: var(--cap-mid); } body.cap-theme .mock-cohort-chart .mock-cohort-line.l3 { stroke: var(--cap-warn); stroke-dasharray: 4 3; } body.cap-theme .mock-inv-head { color: var(--cap-card-muted); border-bottom-color: var(--cap-card-border); } body.cap-theme .mock-inv-row.warn { background: rgba(239, 68, 68, 0.08); border-color: rgba(239, 68, 68, 0.25); } body.cap-theme .mock-inv-prob span { background: var(--cap-mock-dot); } body.cap-theme .mock-inv-prob.warn span { background: var(--cap-warn); } body.cap-theme .mock-donut { box-shadow: inset 0 0 0 18px var(--cap-mockbar-bg); } body.cap-theme .mock-stall-meter { border-top-color: var(--cap-card-border); } body.cap-theme .mock-heat-colhead { color: var(--cap-card-muted); } body.cap-theme .mock-heat-rowlabel { color: var(--cap-card-heading); } body.cap-theme .mock-waterfall-label { color: var(--cap-card-heading); } body.cap-theme .mock-scatter-dot { border-color: var(--cap-mockbar-bg); } body.cap-theme .mock-waterline-marker { border-color: var(--cap-mockbar-bg); } body.cap-theme .mock-waterfall-bar.neg { background: var(--cap-warn); opacity: 0.65; } body.cap-theme .mock-waterfall-bar.pos { background: var(--cap-good); opacity: 0.65; } body.cap-theme .mock-waterfall-bar.neu { background: var(--cap-mock-dot-secondary); opacity: 0.55; } body.cap-theme .mock-inv-prob { background: rgba(0, 0, 0, 0.15); } body.cap-theme .mock-funnel-count { color: var(--cap-card-muted); } body.cap-theme .mock-heat-cell { border: 1px solid rgba(0, 0, 0, 0.06); } body.cap-theme .mock-heat-cell.w2 { border-color: rgba(202, 138, 4, 0.35); } body.cap-theme .mock-heat-cell.w3 { border-color: rgba(239, 68, 68, 0.35); } body.cap-theme .mock-pe-heat-cell { border: 1px solid rgba(0, 0, 0, 0.05); } body.cap-theme .mock-portfolio-card { background: var(--cap-mockbar-bg); border-color: var(--cap-card-border); } body.cap-theme .mock-portfolio-name { color: var(--cap-card-heading); } body.cap-theme .mock-portfolio-kpi { color: var(--cap-card-heading); } body.cap-theme .mock-portfolio-kpi-label { color: var(--cap-card-muted); } /* ----------------------------------------------------------------------------- Restaurant demo page (Tier 2) ----------------------------------------------------------------------------- */ body.cap-theme.demo-body { background: var(--cap-page-bg); } body.cap-theme .demo-hero { position: relative; overflow: hidden; background: radial-gradient(ellipse 75% 120% at 50% -20%, var(--cap-hero-glow1), transparent 55%), var(--cap-page-bg); color: var(--cap-hero-heading); } body.cap-theme .demo-hero .hero-bg { display: none; } body.cap-theme .demo-hero h1 { color: var(--cap-hero-heading); } body.cap-theme .demo-hero p { color: var(--cap-hero-sub); } body.cap-theme .demo-hero .back-link { color: var(--cap-hero-sub); } body.cap-theme .demo-hero .back-link:hover { color: var(--cap-accent); } body.cap-theme .demo-card { background: var(--cap-card-bg); border-color: var(--cap-card-border); box-shadow: var(--cap-shadow-mockup); } body.cap-theme .demo-card-head { background: var(--cap-mockbar-bg); border-bottom-color: var(--cap-card-border); } body.cap-theme .demo-card-title { color: var(--cap-card-heading); } body.cap-theme .demo-filter-btn { color: var(--cap-card-muted); background: var(--cap-card-bg); border-color: var(--cap-card-border); } body.cap-theme .demo-filter-btn:hover { border-color: var(--cap-accent); color: var(--cap-accent); } body.cap-theme .demo-filter-btn.active { background: var(--cap-accent); color: var(--cap-btn-text-on-accent); border-color: var(--cap-accent); } body.cap-theme .demo-chart { border-right-color: var(--cap-card-border); } body.cap-theme .demo-side { background: var(--cap-mockbar-bg); } body.cap-theme .demo-kpi { background: var(--cap-card-bg); border-color: var(--cap-card-border); } body.cap-theme .demo-kpi-label { color: var(--cap-card-muted); } body.cap-theme .demo-kpi-val { color: var(--cap-card-heading); } body.cap-theme .demo-kpi-val .copper { color: var(--cap-accent) !important; } body.cap-theme .demo-insight { background: var(--cap-card-bg); border-color: var(--cap-card-border); border-left-color: var(--cap-accent); } body.cap-theme .demo-insight-label { color: var(--cap-accent); } body.cap-theme .demo-insight h4 { color: var(--cap-card-heading); } body.cap-theme .demo-insight p { color: var(--cap-card-muted); } body.cap-theme .demo-table-wrap { background: var(--cap-card-bg); border-color: var(--cap-card-border); } body.cap-theme .demo-table th { background: var(--cap-mockbar-bg); color: var(--cap-card-muted); border-bottom-color: var(--cap-card-border); } body.cap-theme .demo-table td { color: var(--cap-card-heading); border-bottom-color: rgba(0, 0, 0, 0.06); } body.cap-theme .demo-table .q-star { color: var(--chart-feature); } body.cap-theme .demo-table .q-puzzle { color: var(--chart-promote); } body.cap-theme .demo-table .q-horse { color: var(--chart-reprice); } body.cap-theme .demo-table .q-dog { color: var(--chart-cut); } body.cap-theme .demo-footnote { background: var(--cap-mockbar-bg); border-top-color: var(--cap-card-border); color: var(--cap-card-muted); } @media (max-width: 860px) { body.cap-theme .demo-chart { border-bottom-color: var(--cap-card-border); } } /* ----------------------------------------------------------------------------- Voice operations pattern — crisp type + structured mock (no scroll-blur) ----------------------------------------------------------------------------- */ body.voice-pattern-demo.cap-theme .cap-hero h1 { text-shadow: none; } body.voice-pattern-demo.cap-theme .voice-mock { -webkit-font-smoothing: antialiased; display: flex; flex-direction: column; gap: 18px; margin-bottom: 4px; } body.voice-pattern-demo.cap-theme .voice-mock-head { display: flex; align-items: flex-start; gap: 14px; padding-bottom: 16px; border-bottom: 1px solid var(--cap-card-border); } body.voice-pattern-demo.cap-theme .voice-mock-head-icon { flex-shrink: 0; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 10px; background: var(--cap-mockbar-bg); border: 1px solid var(--cap-card-border); color: var(--cap-accent); } body.voice-pattern-demo.cap-theme .voice-mock-head-icon svg { display: block; } body.voice-pattern-demo.cap-theme .voice-mock-head-text { min-width: 0; } body.voice-pattern-demo.cap-theme .voice-mock-head-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 6px; } body.voice-pattern-demo.cap-theme .voice-mock-pill { display: inline-block; font-size: 0.625rem; font-weight: 600; letter-spacing: 1.1px; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--cap-accent) 14%, var(--cap-card-bg)); color: var(--cap-accent); border: 1px solid color-mix(in srgb, var(--cap-accent) 32%, var(--cap-card-border)); } body.voice-pattern-demo.cap-theme .voice-mock-timer { font-size: 0.8125rem; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--cap-card-muted); } body.voice-pattern-demo.cap-theme .voice-mock-customer { margin: 0; font-size: 0.9375rem; line-height: 1.45; color: var(--cap-card-heading); font-weight: 500; } body.voice-pattern-demo.cap-theme .voice-mock-thread { display: flex; flex-direction: column; gap: 12px; } body.voice-pattern-demo.cap-theme .voice-mock-msg { padding: 14px 16px; border-radius: 10px; border: 1px solid var(--cap-card-border); background: #fff; box-shadow: 0 1px 0 rgba(43, 43, 43, 0.04); } body.voice-pattern-demo.cap-theme .voice-mock-msg--caller { border-left: 3px solid var(--cap-card-muted); background: linear-gradient(180deg, #ffffff 0%, #faf9f6 100%); } body.voice-pattern-demo.cap-theme .voice-mock-msg--agent { border-left: 3px solid var(--cap-accent); background: linear-gradient(180deg, #fbfaf7 0%, #f5f3ef 100%); } body.voice-pattern-demo.cap-theme .voice-mock-msg-label { display: block; font-size: 0.625rem; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; color: var(--cap-card-muted); margin-bottom: 8px; } body.voice-pattern-demo.cap-theme .voice-mock-msg p { margin: 0; font-size: 0.9375rem; line-height: 1.65; color: var(--cap-card-heading); } body.voice-pattern-demo.cap-theme .voice-mock-outcomes { display: flex; flex-wrap: wrap; gap: 8px; } body.voice-pattern-demo.cap-theme .voice-mock-chip { display: inline-block; font-size: 0.6875rem; font-weight: 500; line-height: 1.3; letter-spacing: 0.02em; padding: 7px 11px; border-radius: 8px; background: var(--cap-mockbar-bg); border: 1px solid var(--cap-card-border); color: var(--cap-card-muted); } body.voice-pattern-demo.cap-theme .voice-mock-chip--primary { background: color-mix(in srgb, var(--cap-accent) 12%, var(--cap-card-bg)); border-color: color-mix(in srgb, var(--cap-accent) 38%, var(--cap-card-border)); color: var(--cap-accent); font-weight: 600; } body.voice-pattern-demo.cap-theme .cap-mockup-body .mock-stat-row { margin-top: 6px; } body.voice-pattern-demo.cap-theme .cap-mockup-body .mock-line-caption { margin-top: 12px; } /* ----------------------------------------------------------------------------- CAS (Outsourced Accounting) — deep indigo + gold accent ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--cas { --cap-page-bg: #09090e; --cap-body-text: #c4c4d4; --cap-hero-glow1: rgba(245, 158, 11, 0.25); --cap-hero-dot: rgba(245, 158, 11, 0.04); --cap-hero-heading: #f8fafc; --cap-hero-sub: #9ca3af; --cap-nav-bg: rgba(9, 9, 14, 0.95); --cap-nav-border: rgba(245, 158, 11, 0.15); --cap-logo-a: #f8fafc; --cap-logo-s: #f59e0b; --cap-nav-link: #e2e8f0; --cap-nav-link-hover: #fbbf24; --cap-nav-link-hover-bg: rgba(245, 158, 11, 0.1); --cap-nav-dropdown-bg: #0f0f17; --cap-nav-dropdown-border: rgba(245, 158, 11, 0.18); --cap-dropdown-link: #f8fafc; --cap-dropdown-link-hover-bg: rgba(245, 158, 11, 0.08); --cap-dropdown-link-hover: #fbbf24; --cap-accent: #f59e0b; --cap-accent-hover: #fbbf24; --cap-btn-text-on-accent: #050508; --cap-nav-toggle-border: rgba(245, 158, 11, 0.28); --cap-nav-toggle-hover: #f59e0b; --cap-nav-toggle-bar: #f8fafc; --cap-drawer-overlay: rgba(5, 5, 8, 0.75); --cap-drawer-inner-bg: #0f0f17; --cap-drawer-link: #f8fafc; --cap-drawer-link-hover-bg: rgba(245, 158, 11, 0.08); --cap-band-bg: #0f0f17; --cap-band-border: rgba(245, 158, 11, 0.08); --cap-band-heading: #f8fafc; --cap-band-text: #9ca3af; --cap-panel-bg: #0f0f17; --cap-panel-heading: #f8fafc; --cap-panel-text: #9ca3af; --cap-panel-eyebrow: #f59e0b; --cap-card-bg: #fcfcfc; --cap-card-border: rgba(40, 40, 60, 0.14); --cap-card-heading: #0f172a; --cap-card-muted: #475569; --cap-mockbar-bg: #eef2f6; --cap-mockbar-title: #334155; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.6); --cap-footer-bg: #050508; --cap-footer-border: rgba(245, 158, 11, 0.1); --cap-footer-text: #9ca3af; --cap-footer-muted: #64748b; --cap-footer-link-hover: #fbbf24; --cap-cta-bg: linear-gradient(165deg, #1a1505 0%, #09090e 100%); --cap-cta-heading: #f8fafc; --cap-cta-text: #9ca3af; --cap-mock-dot: #f59e0b; --cap-mock-dot-shadow: rgba(245, 158, 11, 0.4); --cap-mock-dot-secondary: #64748b; --cap-warn: #ef4444; --cap-good: #22c55e; --cap-mid: #f59e0b; --cap-matrix-feature: #f59e0b; --cap-matrix-cut: #ef4444; --cap-demo-strip-bg: linear-gradient(90deg, rgba(245, 158, 11, 0.12), rgba(245, 158, 11, 0.02)); --cap-demo-strip-border: rgba(245, 158, 11, 0.35); --chart-feature: #f59e0b; --chart-promote: #64748b; --chart-reprice: #22c55e; --chart-cut: #ef4444; --chart-gridline: rgba(100, 116, 139, 0.45); } /* ----------------------------------------------------------------------------- RIA (Wealth Management) — slate base + emerald accent ----------------------------------------------------------------------------- */ body.cap-theme.cap-theme--ria { --cap-page-bg: #0b111a; --cap-body-text: #cbd5e1; --cap-hero-glow1: rgba(16, 185, 129, 0.25); --cap-hero-dot: rgba(16, 185, 129, 0.04); --cap-hero-heading: #f8fafc; --cap-hero-sub: #94a3b8; --cap-nav-bg: rgba(11, 17, 26, 0.95); --cap-nav-border: rgba(16, 185, 129, 0.15); --cap-logo-a: #f8fafc; --cap-logo-s: #10b981; --cap-nav-link: #e2e8f0; --cap-nav-link-hover: #34d399; --cap-nav-link-hover-bg: rgba(16, 185, 129, 0.1); --cap-nav-dropdown-bg: #0f172a; --cap-nav-dropdown-border: rgba(16, 185, 129, 0.18); --cap-dropdown-link: #f8fafc; --cap-dropdown-link-hover-bg: rgba(16, 185, 129, 0.08); --cap-dropdown-link-hover: #34d399; --cap-accent: #10b981; --cap-accent-hover: #34d399; --cap-btn-text-on-accent: #020617; --cap-nav-toggle-border: rgba(16, 185, 129, 0.28); --cap-nav-toggle-hover: #10b981; --cap-nav-toggle-bar: #f8fafc; --cap-drawer-overlay: rgba(2, 6, 15, 0.75); --cap-drawer-inner-bg: #0f172a; --cap-drawer-link: #f8fafc; --cap-drawer-link-hover-bg: rgba(16, 185, 129, 0.08); --cap-band-bg: #0f172a; --cap-band-border: rgba(16, 185, 129, 0.08); --cap-band-heading: #f8fafc; --cap-band-text: #94a3b8; --cap-panel-bg: #0f172a; --cap-panel-heading: #f8fafc; --cap-panel-text: #94a3b8; --cap-panel-eyebrow: #10b981; --cap-card-bg: #f8fafc; --cap-card-border: rgba(30, 41, 59, 0.14); --cap-card-heading: #0f172a; --cap-card-muted: #475569; --cap-mockbar-bg: #e2e8f0; --cap-mockbar-title: #334155; --cap-shadow-mockup: 0 28px 70px rgba(0, 0, 0, 0.6); --cap-footer-bg: #020617; --cap-footer-border: rgba(16, 185, 129, 0.1); --cap-footer-text: #94a3b8; --cap-footer-muted: #64748b; --cap-footer-link-hover: #34d399; --cap-cta-bg: linear-gradient(165deg, #06241a 0%, #0b111a 100%); --cap-cta-heading: #f8fafc; --cap-cta-text: #94a3b8; --cap-mock-dot: #10b981; --cap-mock-dot-shadow: rgba(16, 185, 129, 0.4); --cap-mock-dot-secondary: #64748b; --cap-warn: #ef4444; --cap-good: #10b981; --cap-mid: #f59e0b; --cap-matrix-feature: #10b981; --cap-matrix-cut: #ef4444; --cap-demo-strip-bg: linear-gradient(90deg, rgba(16, 185, 129, 0.12), rgba(16, 185, 129, 0.02)); --cap-demo-strip-border: rgba(16, 185, 129, 0.35); --chart-feature: #10b981; --chart-promote: #64748b; --chart-reprice: #10b981; --chart-cut: #ef4444; --chart-gridline: rgba(100, 116, 139, 0.45); }