section[id] { scroll-margin-top: 90px; }
.demo-section, .everyday { padding-block: 72px; }
.demo-section .section-head p { color: var(--muted); }
.demo-layout { display: grid; grid-template-columns: 1fr 1.2fr; gap: 24px; }
.demo-choices { display: grid; gap: 8px; }
.demo-choices button, .demo-followups button { font: inherit; text-align: left; color: var(--text); background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 16px; cursor: pointer; min-height: 48px; }
.demo-choices button span { display: block; color: var(--muted); font-size: .875rem; }
.demo-choices button[aria-pressed=true] { border-color: var(--accent); background: var(--surface-raised); }
.demo-choices button:hover, .demo-followups button:hover { border-color: var(--accent); }
button:focus-visible, a:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.demo-status { color: var(--accent); font-size: .95rem; }
.demo-followups { display: flex; gap: 12px; }
.demo-followups[hidden], [data-followup][hidden] { display: none; }
.everyday h2, .compatibility h2 { font-size: clamp(2rem,4vw,3rem); line-height: 1.15; letter-spacing: -.035em; max-width: 800px; }
.everyday-grid, .compat-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
.everyday h3, .compat-grid h3 { font-size: 1.2rem; }
.everyday blockquote { margin: 16px 0; color: var(--accent); font-size: 1.2rem; }
.everyday p, .compat-grid p { color: var(--muted); }
.scenario-example { margin-top: 40px; padding: 28px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.scenario-example>p { grid-column: 1/-1; margin: 0; font-size: .875rem; }
.scenario-example ol { padding-left: 24px; line-height: 2; }
.compatibility { padding-bottom: 56px; border-bottom: 1px solid var(--line); margin-bottom: 56px; }
.availability { padding: 20px; border-left: 3px solid var(--accent); background: var(--surface); color: var(--text); }
@media (max-width:768px) {
  .demo-layout, .everyday-grid, .compat-grid, .scenario-example { grid-template-columns: 1fr; }
  .demo-output { min-width: 0; }
  .demo-choices button span, .quoted { overflow-wrap: anywhere; }
  .hero h1 { font-size: clamp(2.3rem,11vw,3.5rem); }
  .demo-section, .everyday { padding-block: 48px; }
  .hero-footnote { margin-top: 24px; }
  .signal { flex-shrink: 0; }
  .compat-grid { gap: 12px; }
  .scenario-example { padding: 20px; }
}
@media print {
  .topbar, .hero-image, .hero-scrim, .skip, .hero-actions, .demo-choices, .demo-followups { display: none; }
  body { background: white; color: #171a20; }
  .hero { min-height: auto; }
  .hero-content { padding: 24px 0; }
  .hero h1, .hero h1 em, h2, h3, strong { color: #171a20; }
  .page-width { width: 100%; }
  p, small, dd, .hero-copy, .panel-note { color: #393c41 !important; }
  section, .intro, .features, .install, .safety, .questions, .command-grid, .setup { padding-block: 24px; }
  .feature-card, .command-panel, .setup-list>div, .scenario-example { background: white; color: #171a20; break-inside: avoid; }
  .feature-card { min-height: 0; }
  .hero-footnote { color: #393c41; }
  .feature-grid, .demo-layout, .setup-grid, .command-grid, .intro-grid { grid-template-columns: 1fr; }
  .questions details p { display: block; }
  .panel-top, .card-code, .eyebrow { color: #5c5e62; }
}