/* Product illustrations use X2AI's source palette and application vocabulary.
   Independent marketing HTML; no application code or live data is executed. */
:root { --paper:#fff; --soft:#f5f7fa; --ink:#202733; --muted:#606b7a; --line:#e0e5eb; --accent:#1976d2; --dark:#182c46; }
.site-header { background:#fff; }
.brand-name>span:first-child,.brand-dot { color:#1976d2; }
.header nav { gap:30px; }
.header nav .nav-cta { border-color:#1976d2; color:#1565c0; }
.visual-hero { background:#f4f7fb; border-bottom:1px solid var(--line); }
.visual-hero-inner { display:grid; grid-template-columns:.9fr 1.1fr; gap:58px; align-items:center; padding-block:48px; }
.visual-hero h1 { font-size:clamp(2.2rem,3.7vw,3.6rem); margin:0 0 22px; }
.visual-hero .eyebrow { color:#1565c0; letter-spacing:.07em; font-size:.65rem; }
.visual-hero-copy>p:not(.eyebrow) { max-width:470px; font-size:.96rem; line-height:1.75; }
.visual-hero .button { background:#1976d2; border-color:#1976d2; }
.visual-hero-copy>span { display:block; font-size:.74rem; color:var(--muted); margin-top:16px; }
.hero-product { min-width:0; }
.hero-product .tool-window { box-shadow:0 8px 24px #193c6010; }
.hero-product .tool-appbar { padding:10px 15px; }
.hero-product .chat-workspace { grid-template-columns:1fr; }
.hero-product .tool-chat { padding:18px; }
.hero-product .smartview-preview { display:none; }
.hero-product .tool-context { padding-block:10px; }
.hero-product .demo-caption { font-size:.66rem; margin:10px 0 0; }
.discover-section { padding-block:46px 0; }
.discover-intro { margin-bottom:24px; }
.discover-intro h2 { font-size:clamp(1.65rem,2.6vw,2.3rem); margin-bottom:14px; }
.discover-intro p:last-child { margin:0; font-size:.92rem; }
.product-guide { padding:22px 26px; background:#f8fafc; border:1px solid #dce4ed; border-radius:8px; margin-bottom:30px; }
.guide-label { display:flex; gap:14px; align-items:center; justify-content:space-between; margin-bottom:13px; }
.guide-label strong { font-size:.87rem; font-weight:600; }
.guide-label>span { font-size:.65rem; color:#596b82; text-transform:uppercase; letter-spacing:.06em; }
#guide-answer p { font-size:.9rem; margin-bottom:15px; line-height:1.7; max-width:970px; }
#guide-form { display:flex; gap:10px; max-width:850px; }
#guide-form input { flex:1; width:0; min-width:0; background:#fff; font-size:.87rem; border-color:#bbcbdc; border-radius:5px; }
#guide-form button { background:#1976d2; color:white; border:0; border-radius:5px; padding:10px 20px; font-size:.85rem; }
.guide-suggestions,.guide-followups { display:flex; flex-wrap:wrap; gap:9px; margin-top:17px; }
.guide-suggestions button,.guide-followups button,.guide-followups a { border:1px solid #cdd7e3; border-radius:25px; background:#fff; padding:10px 15px; font-size:.8rem; text-decoration:none; line-height:1.4; }
.guide-suggestions button:hover,.guide-followups button:hover,.guide-followups a:hover { border-color:#1976d2; color:#1565c0; }
.guide-suggestions button[aria-pressed=true] { background:#e3f2fd; border-color:#1976d2; color:#155da4; }
.guide-note { font-size:.71rem; line-height:1.65; color:#667588; margin:16px 0 0; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.experience-panel { border-top:1px solid #d8e0e9; padding-top:30px; }
.experience-heading .eyebrow { color:#1565c0; margin-bottom:12px; }
.experience-heading h3 { font-size:clamp(1.65rem,2.5vw,2.4rem); max-width:950px; margin-bottom:28px; }
.experience-detail { display:grid; grid-template-columns:.7fr 1.3fr; gap:45px; align-items:start; }
.experience-copy { padding:8px 0 0; }
.mini-label { font-size:.67rem; font-weight:650; letter-spacing:.05em; text-transform:uppercase; color:#607086; margin:0 0 11px; }
.experience-copy>p:not(.mini-label) { font-size:.91rem; line-height:1.8; margin-bottom:25px; }
.experience-copy .benefit-line { border-left:2px solid #90caf9; padding-left:16px; color:#29435d; }
.product-demo { min-width:0; }
.demo-play { font-size:.78rem; padding:11px 15px; border:1px solid #b8cbe0; color:#155da4; background:#fff; border-radius:5px; min-height:44px; margin-top:15px; }
.demo-play:disabled { color:#526578; background:#f4f7fa; }
.demo-output { border-left:2px solid #1976d2; background:#f4f8fc; padding:14px 17px; margin-top:16px; }
.demo-output p { font-size:.83rem; margin:0; line-height:1.7; }
.demo-caption { font-size:.69rem; color:#667588; line-height:1.7; margin:10px 0 0; }
.experience-next { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:28px 0; margin-top:24px; border-top:1px solid var(--line); }
.experience-next>p { margin:0; }
.experience-next strong { display:block; color:var(--ink); font-size:1rem; font-weight:600; }
.experience-next span { display:block; font-size:.76rem; margin-top:6px; }
.experience-next>div { display:flex; align-items:center; flex-wrap:wrap; gap:20px; }
.experience-next .button { background:#1976d2; border-color:#1976d2; font-size:.78rem; }
.feature-details { padding-bottom:28px; border-bottom:1px solid var(--line); }
.feature-details summary { font-size:.82rem; color:#365d84; min-height:36px; padding-block:8px; }
.feature-details ul { display:grid; grid-template-columns:1fr 1fr; gap:18px 30px; padding:0; list-style:none; }
.feature-details li { border-top:1px solid var(--line); padding-top:15px; }
.feature-details li strong { display:block; font-size:.88rem; line-height:1.6; }
.feature-details li span { display:block; font-size:.8rem; line-height:1.75; color:var(--muted); margin-top:5px; }
.feature-details>p { font-size:.74rem; margin:22px 0 0; }
.detail-tool { margin-bottom:55px; }
.detail-tool .product-demo { max-width:960px; margin-inline:auto; }
.tool-window { overflow:hidden; background:#fafafa; border:1px solid #d5dde6; border-radius:8px; font-family:'Segoe UI',Inter,sans-serif; color:#212121; }
.tool-appbar { display:flex; align-items:center; gap:16px; padding:12px 18px; color:#fff; background:#1976d2; }
.tool-appbar>strong { font-size:1rem; font-weight:700; letter-spacing:-.03em; }
.tool-appbar>span { font-size:.79rem; flex:1; }
.tool-appbar small { font-size:.66rem; color:#eff7ff; }
.tool-content { padding:18px; }
.tool-title { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:16px; }
.tool-title h4 { font-size:1rem; font-weight:650; letter-spacing:-.02em; }
.tool-title>span { font-size:.7rem; padding:5px 10px; background:#e3f2fd; color:#1565c0; border-radius:20px; }
.tool-card { background:#fff; border:1px solid #e0e0e0; border-radius:6px; padding:15px; margin-bottom:14px; }
.tool-card-title { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:16px; }
.tool-card-title strong { font-size:.86rem; font-weight:650; }
.tool-card-title>span { font-size:.69rem; color:#687481; }
.tool-card-title.green { border-left:3px solid #2e7d32; padding-left:10px; }
.tool-card-title.blue { border-left:3px solid #1565c0; padding-left:10px; }
.tool-kpis { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0; }
.tool-kpis>div { background:#fff; padding:13px 12px; border:1px solid #e0e5e9; border-radius:5px; min-width:0; }
.tool-kpis span { display:block; color:#627080; font-size:.68rem; line-height:1.5; }
.tool-kpis strong { display:block; font-size:1.28rem; color:#243a51; font-weight:600; margin-top:7px; line-height:1.2; }
.tool-small { color:#65717e; font-size:.69rem; line-height:1.65; margin:10px 0 0; }
.tool-context,.record-tabs { display:flex; flex-wrap:wrap; gap:8px 15px; border-bottom:1px solid #e0e5eb; background:white; padding:12px 17px; color:#6a7683; font-size:.71rem; }
.tool-context .selected,.record-tabs .selected { color:#1565c0; font-weight:650; border-bottom:2px solid #1976d2; }
.social-view-picker { display:flex; flex-wrap:wrap; gap:0; background:#fff; border-bottom:1px solid #dbe2e9; padding-inline:12px; }
.social-view-picker button { border:0; border-bottom:2px solid transparent; padding:12px 11px; background:transparent; color:#65717e; font-size:.75rem; min-height:44px; }
.social-view-picker button[aria-pressed=true] { border-bottom-color:#1976d2; color:#1565c0; font-weight:600; }
.social-preview section { animation:source-view-in .18s ease-out; }
.mood-scale { display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:3px; }
.scale-column { text-align:center; border-radius:4px; background:#f4f6f8; border-bottom:3px solid #90a4ae; }
.scale-column>div { height:57px; display:flex; flex-direction:column-reverse; align-items:center; padding:4px; gap:3px; }
.scale-column b { display:block; font-size:.72rem; font-weight:600; padding:5px 0; }
.scale-column.stable { background:#edf7ed; border-color:#43a047; }
.scale-column.watch { background:#fff8df; border-color:#f9a825; }
.scale-column.attention { background:#fff1e5; border-color:#ef6c00; }
.scale-column.critical { background:#feeeed; border-color:#e53935; }
.demo-resident { border-radius:50%; width:22px; height:22px; display:grid; place-items:center; color:#fff; background:#5a7892; font-size:.63rem; flex-shrink:0; }
.scale-legend { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 10px; margin-top:9px; font-size:.66rem; color:#65717e; }
.tool-heatmap { border-collapse:separate; border-spacing:4px; width:100%; table-layout:fixed; }
.tool-heatmap caption { text-align:left; font-size:.82rem; font-weight:650; margin-bottom:10px; }
.tool-heatmap th,.tool-heatmap td { padding:7px 2px; text-align:center; font-size:.65rem; border-radius:3px; }
.tool-heatmap th { color:#65717e; font-weight:550; overflow-wrap:anywhere; }
.tool-heatmap .heat-0 { background:#f0f1f3; color:#65717e; }
.tool-heatmap .heat-1 { background:#dcecf9; color:#164f83; }
.tool-heatmap .heat-2 { background:#78acd8; color:#123d61; }
.tool-heatmap .heat-3 { background:#1976d2; color:#fff; }
.tool-heatmap .heat-total { background:#f3f5f7; color:#3b4f63; font-weight:600; }
.record-tabs { padding:0 0 13px; background:transparent; margin-bottom:14px; gap:10px 15px; font-size:.72rem; }
.record-entry { border-top:1px solid #e5e9ee; padding-top:13px; margin-top:15px; }
.record-entry time { display:block; font-size:.67rem; color:#6b7887; margin-bottom:8px; }
.record-entry strong { font-size:.83rem; font-weight:600; }
.record-entry p { font-size:.78rem; margin:7px 0 9px; color:#526171; line-height:1.7; }
.tool-tag { display:inline-block; padding:4px 8px; color:#275c8d; background:#edf4fb; border-radius:4px; font-size:.66rem; }
.development-chart,.finance-chart { display:block; width:100%; height:auto; }
.chart-legend { display:flex; flex-wrap:wrap; gap:14px; margin-top:10px; font-size:.67rem; color:#64717f; }
.chart-legend span::before { content:''; display:inline-block; width:16px; height:3px; margin:0 5px 3px 0; background:#1976d2; }
.chart-legend .green-line::before { background:#2e7d32; }
.chart-legend .amber-line::before { background:#ff8f00; }
.chart-legend .grey-line::before { background:#90a4ae; }
.chart-legend .red-line::before { background:#d32f2f; }
.measure-bars { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; height:105px; padding:0 10px; }
.measure-bars>div { display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:7px; }
.measure-bars i { width:55%; max-width:40px; background:#1976d2; border-radius:3px 3px 0 0; }
.measure-bars .pct-60 { height:48px; }.measure-bars .pct-70 { height:56px; }.measure-bars .pct-80 { height:64px; }.measure-bars .pct-90 { height:72px; }
.measure-bars span { font-size:.67rem; color:#6c7885; }
.chat-workspace { display:grid; grid-template-columns:1fr .9fr; background:#fff; }
.tool-chat { padding:20px 16px; }
.user-bubble { margin-left:15%; background:#e3f2fd; border-radius:9px 9px 2px 9px; padding:12px; font-size:.79rem; line-height:1.6; }
.assistant-bubble { padding:16px 0; }
.assistant-bubble strong { font-size:.8rem; font-weight:600; line-height:1.6; display:block; }
.assistant-bubble p { font-size:.78rem; line-height:1.7; margin:8px 0 10px; color:#526171; }
.chat-input-preview { border:1px solid #cbd5df; border-radius:7px; padding:12px; color:#788391; font-size:.71rem; }
.smartview-preview { border-left:1px solid #dce3eb; background:#fafbfc; padding:18px 14px; }
.smartview-preview table { width:100%; border-collapse:collapse; font-size:.7rem; }
.smartview-preview th,.smartview-preview td { padding:10px 5px; border-bottom:1px solid #e0e5eb; text-align:left; line-height:1.6; }
.smartview-preview th { color:#52718f; font-weight:600; }
.document-workspace { display:grid; grid-template-columns:.7fr 1.3fr; gap:16px; padding:20px; }
.document-workspace aside { padding:5px 0; }
.document-workspace aside>strong { font-size:.78rem; }
.document-workspace aside>p { font-size:.75rem; line-height:1.9; margin:13px 0; }
.document-page { background:#fff; border:1px solid #dce3e9; padding:23px; box-shadow:0 2px 5px #1e406008; }
.document-page small { font-size:.58rem; letter-spacing:.06em; color:#68798a; }
.document-page h4 { font-size:1.05rem; line-height:1.4; margin:15px 0; }
.document-page p { font-size:.78rem; line-height:1.8; }
.paper-rule { height:3px; background:#edf0f3; margin:9px 0; }.paper-rule.short { width:65%; }
.document-review { display:block; font-size:.65rem; color:#1565c0; margin-top:30px; }
.tool-bottom { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; background:#fff; border-top:1px solid #e0e5eb; padding:12px 17px; font-size:.69rem; color:#5d6d7d; }
.export-note { padding:0 17px 13px; }
.roster-table { width:100%; border-collapse:collapse; table-layout:fixed; font-size:.73rem; }
.roster-table caption { caption-side:bottom; font-size:.68rem; color:#667588; text-align:left; padding-top:14px; }
.roster-table th,.roster-table td { padding:11px 3px; border-bottom:1px solid #e4e8ed; text-align:center; }
.roster-table th { font-size:.69rem; font-weight:550; color:#617080; }
.roster-table th:first-child { width:29%; text-align:left; }
.shift { display:block; border-radius:4px; background:#e3f2fd; color:#1565c0; padding:7px 0; font-weight:600; }
.shift-S { background:#e8f5e9; color:#2e7d32; }.shift-N { background:#ede7f6; color:#5e35b1; }.shift-empty { background:#f4f5f6; color:#8a929b; }
@keyframes source-view-in { from { opacity:.55; } to { opacity:1; } }
@media(max-width:1100px) {
  .visual-hero-inner { gap:35px; }.experience-detail { grid-template-columns:.75fr 1.25fr; gap:28px; }
  .chat-workspace { grid-template-columns:1fr; }.smartview-preview { border-left:0; border-top:1px solid #dce3eb; }
  .tool-kpis strong { font-size:1.1rem; }
}
@media(max-width:800px) {
  .header { flex-wrap:nowrap; gap:15px; }.header nav { width:auto; padding:0; flex-wrap:nowrap; gap:18px; }.header nav a { font-size:.74rem; }.header nav .nav-cta { padding:10px 12px; }
  .visual-hero-inner { grid-template-columns:1fr; padding-block:35px; }.visual-hero-copy { max-width:600px; }.visual-hero h1 { font-size:2.65rem; }.hero-product { display:none; }
  .discover-section { padding-top:35px; }.experience-detail { grid-template-columns:1fr; gap:8px; }.experience-copy { display:grid; grid-template-columns:1fr; }.experience-copy>p:not(.mini-label) { margin-bottom:20px; }
  .experience-next { align-items:flex-start; flex-direction:column; }.experience-heading h3 { font-size:1.9rem; }.feature-details ul { grid-template-columns:1fr; }
  .chat-workspace { grid-template-columns:1fr 1fr; }.smartview-preview { border-top:0; border-left:1px solid #dce3eb; }
  .tool-kpis strong { font-size:1.25rem; }
}
@media(max-width:500px) {
  .header { gap:10px; }.brand-name { font-size:1.5rem; }.brand-descriptor { font-size:.4rem; }.header nav { gap:11px; }.header nav a { font-size:.68rem; }.header nav .nav-cta { padding:9px 10px; }
  .visual-hero h1 { font-size:2.2rem; }.visual-hero .eyebrow { font-size:.58rem; }.visual-hero-copy>p:not(.eyebrow) { font-size:.91rem; }
  .product-guide { padding:18px; }.guide-label { gap:10px; }.guide-label strong { font-size:.77rem; }.guide-label>span { font-size:.59rem; }
  #guide-form { gap:6px; }#guide-form input { padding:10px; font-size:.8rem; }#guide-form button { padding:10px 12px; font-size:.78rem; }
  .guide-suggestions button,.guide-followups button,.guide-followups a { font-size:.75rem; padding:10px 12px; }.guide-note { font-size:.67rem; }
  .experience-heading h3 { font-size:1.65rem; }.experience-next>div { flex-direction:column; align-items:flex-start; gap:12px; }.experience-copy>p:not(.mini-label) { font-size:.87rem; }
  .tool-appbar { padding:11px 12px; gap:10px; }.tool-appbar>span { font-size:.72rem; }.tool-appbar small { font-size:.6rem; }.tool-appbar>strong { font-size:.9rem; }
  .tool-content { padding:12px; }.tool-card { padding:12px; }.tool-title h4 { font-size:.9rem; }.tool-kpis { gap:6px; }.tool-kpis>div { padding:10px 7px; }.tool-kpis span { font-size:.62rem; }.tool-kpis strong { font-size:1.04rem; }
  .social-view-picker { padding-inline:4px; }.social-view-picker button { padding:11px 9px; font-size:.69rem; }.tool-card-title strong { font-size:.77rem; }.tool-card-title>span { font-size:.63rem; }
  .scale-column>div { padding:3px 1px; }.demo-resident { width:17px; height:17px; font-size:.63rem; }.scale-legend { font-size:.66rem; }.scale-column b { font-size:.7rem; }
  .tool-heatmap { border-spacing:2px; }.tool-heatmap th,.tool-heatmap td { font-size:.65rem; padding:7px 0; }.tool-heatmap caption { font-size:.75rem; }.tool-small { font-size:.69rem; }
  .chat-workspace { grid-template-columns:1fr; }.smartview-preview { border-left:0; border-top:1px solid #dce3eb; }.tool-chat { padding:17px; }
  .document-workspace { grid-template-columns:1fr; padding:15px; }.document-workspace aside>p { margin:8px 0; }.document-page { padding:22px; }
  .roster-table th { font-size:.6rem; }.roster-table th:first-child { width:29%; }.roster-table td { padding-inline:2px; }.shift { font-size:.7rem; }
}
@media(prefers-reduced-motion:reduce) { .social-preview section { animation:none; } }