/* November 4 Demo-only layout. Shared styles and other routes are unchanged. */
@media screen {
  body[data-route="/demo"] .demo-band { background: #D8D9C9; }
  body[data-route="/demo"] .demo-page {
    display: grid;
    grid-template-columns: minmax(0, .45fr) minmax(0, .55fr);
    grid-template-rows: auto max-content minmax(0, 1fr);
    column-gap: 64px;
    row-gap: 0;
    align-items: start;
    min-height: calc(100svh - 89px);
    padding: 24px 0 32px;
    font-size: 16px;
  }
  body[data-route="/demo"] .demo-prelude { grid-column: 1; grid-row: 1; min-width: 0; }
  body[data-route="/demo"] .demo-breadcrumb { font-size: 15px; line-height: 1.5; color: var(--muted); margin: 0 0 6px; }
  body[data-route="/demo"] .demo-prelude .eyebrow { font-size: 15px; line-height: 1.5; margin: 0 0 12px; }
  body[data-route="/demo"] .demo-pitch { grid-column: 1; grid-row: 2; display: block; padding: 0; min-width: 0; }
  body[data-route="/demo"] .demo-pitch-copy { container-type: inline-size; width: 100%; min-width: 0; }
  body[data-route="/demo"] .demo-pitch h1 { margin: 0; max-width: none; text-wrap: balance; }
  body[data-route="/demo"] .demo-headline-phrase { display: block; white-space: normal; }
  body[data-route="/demo"] .demo-pitch .subhead { font-size: 20px; line-height: 1.5; margin: 16px 0 0; max-width: none; }
  body[data-route="/demo"] .demo-pitch .fineprint { font-size: 15px; line-height: 1.5; margin: 16px 0 0; }
  body[data-route="/demo"] .demo-list { padding: 0; margin: 20px 0 0; }
  body[data-route="/demo"] .demo-list li { gap: 12px; padding: 8px 0; align-items: flex-start; font-size: 16px; line-height: 1.5; text-wrap: pretty; }
  body[data-route="/demo"] .demo-list .icon { width: 22px; height: 22px; flex: 0 0 22px; }

  body[data-route="/demo"] .demo-form-card {
    --demo-card-min-height: 690px;
    grid-column: 2;
    grid-row: 2 / 4;
    min-width: 0;
    min-height: var(--demo-card-min-height);
    background: #F5F5F0;
    border: 1px solid #C4C4A7;
    border-radius: 24px;
    overflow-wrap: normal;
  }
  body[data-route="/demo"] .demo-form-card > .form-panel { width: 100%; min-width: 0; margin: 0; padding: 32px; border: 0; border-radius: 24px; background: transparent; }
  body[data-route="/demo"] .demo-form-heading { margin: 0; max-width: none; }
  body[data-route="/demo"] .demo-form-heading h2 { margin: 0; font-size: 32px; line-height: 1.15; text-wrap: balance; }
  body[data-route="/demo"] .demo-form-heading p { font-size: 16px; line-height: 1.5; margin: 8px 0 0; max-width: none; }
  body[data-route="/demo"] .form-panel .form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin-top: 16px; align-items: start; }
  body[data-route="/demo"] .form-panel .field { min-width: 0; gap: 6px; line-height: 1.5; }
  body[data-route="/demo"] .field > span:first-child,
  body[data-route="/demo"] .field .muted { font-size: 15px; line-height: 1.5; }
  body[data-route="/demo"] .field input,
  body[data-route="/demo"] .field select { height: 48px; min-height: 48px; margin: 0; padding: 10px 12px; font-size: 16px; line-height: 1.5; }
  body[data-route="/demo"] .field textarea { height: 64px; min-height: 64px; padding: 8px 12px; font-size: 16px; line-height: 1.5; }
  body[data-route="/demo"] .form-panel .wide { grid-column: 1 / -1; }
  body[data-route="/demo"] .form-panel .form-notice { margin: 0; font-size: 15px; line-height: 1.3; color: var(--muted); }
  body[data-route="/demo"] .property-details { margin-top: 16px; padding-top: 12px; }
  body[data-route="/demo"] .property-details > summary { font-size: 15px; line-height: 1.5; padding: 0; }
  body[data-route="/demo"] .property-details .muted { font-size: 15px; }
  body[data-route="/demo"] .property-details[open] { padding: 12px; border-radius: 16px; }
  body[data-route="/demo"] .property-details .fineprint { font-size: 15px; line-height: 1.5; margin: 12px 0 0; }
  body[data-route="/demo"] .property-details .form-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
  body[data-route="/demo"] .property-details .wide { grid-column: auto; }
  body[data-route="/demo"] .property-details select { font-size: 15px; padding-inline: 8px; }
  body[data-route="/demo"] .demo-submit-row { display: flex; align-items: center; gap: 16px; margin-top: 16px; }
  body[data-route="/demo"] .demo-submit-row .consent { flex: 1 1 auto; gap: 8px; margin: 0; font-size: 15px; line-height: 1.5; }
  body[data-route="/demo"] .consent input { width: 16px; height: 16px; flex: 0 0 16px; margin: 3px 0 0; }
  body[data-route="/demo"] .demo-submit-row > .button { flex: 0 0 auto; width: auto; height: 52px; min-height: 52px; margin: 0; padding: 12px 18px; gap: 12px; font-size: 16px; }
  body[data-route="/demo"] .form-panel .form-message { font-size: 15px; line-height: 1.5; margin: 16px 0 0; }
  body[data-route="/demo"] .form-panel [data-form-confirmation] { margin: 0; font-size: 16px; line-height: 1.5; }

  body[data-route="/demo"] .demo-illustration { grid-column: 1; grid-row: 3; min-width: 0; margin-top: 32px; }
  body[data-route="/demo"] .demo-illustration .section-heading { margin: 12px 0 0; }
  body[data-route="/demo"] .demo-illustration h2 { margin: 0; font-size: 18px; line-height: 1.4; }
  body[data-route="/demo"] .demo-illustration > .visual-slot { width: 360px; max-width: 100%; margin: 0; aspect-ratio: auto; padding: 0; border: 0; border-radius: 0; background: transparent; }
  body[data-route="/demo"] .demo-home-art { display: block; width: 100%; min-width: 0; margin: 0; padding: 0; border-radius: 0; background: transparent; }
  body[data-route="/demo"] .demo-home-art > svg { display: block; width: 100%; height: auto; min-height: 0; }
  body[data-route="/demo"] .demo-home-controls { display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: 6px; margin-top: 12px; }
  body[data-route="/demo"] .demo-home-controls > span { display: inline-flex; flex: 0 0 auto; white-space: nowrap; align-items: center; gap: 3px; padding: 6px 4px; border: 1px solid #C4C4A7; border-radius: 999px; background: #F5F5F0; font-size: 15px; line-height: 1.3; }
  body[data-route="/demo"] .demo-home-controls .icon { width: 14px; height: 14px; }
  body[data-route="/demo"] .demo-illustration > .fineprint { font-size: 15px; line-height: 1.5; margin: 12px 0 0; max-width: 240px; }
}

@media screen and (max-width: 800px) {
  body[data-route="/demo"] .demo-page { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto auto; column-gap: 0; padding: 24px 0 48px; }
  body[data-route="/demo"] .demo-prelude { grid-column: 1; grid-row: 1; }
  body[data-route="/demo"] .demo-pitch { grid-column: 1; grid-row: 2; }
  body[data-route="/demo"] .demo-headline-phrase { display: inline; }
  body[data-route="/demo"] .demo-form-card { --demo-card-min-height: 1175px; grid-column: 1; grid-row: 3; margin-top: 32px; }
  body[data-route="/demo"] .demo-form-card > .form-panel { padding: 32px; }
  body[data-route="/demo"] .form-panel .form-grid,
  body[data-route="/demo"] .property-details .form-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-route="/demo"] .property-details .wide { grid-column: 1; }
  body[data-route="/demo"] .demo-submit-row { flex-direction: column; align-items: stretch; gap: 16px; }
  body[data-route="/demo"] .demo-submit-row > .button { width: 100%; }
  body[data-route="/demo"] .demo-illustration { grid-column: 1; grid-row: 4; margin-top: 32px; }
}
