/* Homepage assistant. Same tokens as home.css: white, black, charcoal, Inter, thin gray, pills. */

body:is(.home, .page) .ai-panel {
  position: relative;
  z-index: 1;
  background: var(--white);
  padding: 1.25rem 0 0.5rem;
  scroll-margin-top: 4.75rem;
}

body:is(.home, .page) .ai-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 1.25rem 1.1rem 1.15rem;
}

body:is(.home, .page) .ai-kicker { margin-bottom: 0.45rem; }

body:is(.home, .page) .ai-card h2 {
  max-width: 18ch;
  margin: 0 0 0.45rem;
}

body:is(.home, .page) .ai-intro {
  max-width: 38rem;
  margin: 0;
  color: var(--charcoal);
  font-size: 1.05rem;
}

body:is(.home, .page) .ai-identity {
  margin: 0.7rem 0 0;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 500;
}

body:is(.home, .page) .ai-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1.1rem 0 0.9rem;
}

body:is(.home, .page) .ai-chip {
  font-family: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: -0.011em;
  color: var(--black);
  background: var(--white);
  border: 1px solid var(--black);
  border-radius: 999px;
  padding: 0.55rem 0.9rem;
  cursor: pointer;
  line-height: 1.25;
}

body:is(.home, .page) .ai-chip:hover { background: var(--soft); }

body:is(.home, .page) .ai-toggle { margin: 0.2rem 0 0.4rem; }

body:is(.home, .page) .ai-status {
  margin: 0 0 0.85rem;
  color: var(--charcoal);
  font-size: 0.95rem;
}

body:is(.home, .page) .ai-log {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  min-height: 0;
  max-height: 22rem;
  overflow: auto;
  padding: 0.15rem;
  scroll-margin-bottom: 5.5rem;
}

body:is(.home, .page) .ai-log:empty { display: none; }

body:is(.home, .page) .ai-msg {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 0.75rem 0.85rem 0.7rem;
  background: var(--white);
}

body:is(.home, .page) .ai-msg-user { background: var(--soft); }

body:is(.home, .page) .ai-who {
  margin: 0 0 0.25rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

body:is(.home, .page) .ai-text {
  margin: 0;
  white-space: pre-wrap;
  color: var(--ink);
}

body:is(.home, .page) .ai-composer { margin-top: 0.9rem; }

body:is(.home, .page) .ai-composer label.ai-label {
  display: block;
  margin: 0 0 0.35rem;
  font-size: 0.92rem;
  font-weight: 600;
}

body:is(.home, .page) .ai-composer textarea {
  width: 100%;
  min-height: 6.5rem;
  resize: vertical;
  font: inherit;
  font-size: 1rem;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  padding: 0.75rem 0.8rem;
  scroll-margin-bottom: 5.5rem;
}

body:is(.home, .page) .ai-composer textarea:focus {
  outline: 2px solid var(--black);
  outline-offset: 2px;
}

body:is(.home, .page) .ai-send-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 0.7rem;
}

body:is(.home, .page) .ai-send-row .btn { width: auto; }

body:is(.home, .page) .ai-handoff {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.55rem;
  margin-top: 0.85rem;
}

body:is(.home, .page) .ai-fine {
  margin: 0.85rem 0 0;
  color: var(--muted);
  font-size: 0.86rem;
}

body:is(.home, .page) .ai-fine a { font-weight: 700; }

body:is(.home, .page) .ai-consent {
  margin-top: 0.9rem;
  border: 1px solid var(--black);
  border-radius: 16px;
  padding: 0.9rem 0.9rem 0.95rem;
}

body:is(.home, .page) .ai-consent p { margin: 0 0 0.75rem; }

body:is(.home, .page) .ai-result {
  margin-top: 0.9rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 0.9rem;
  background: var(--soft);
}

body:is(.home, .page) .ai-result pre {
  margin: 0.6rem 0 0;
  white-space: pre-wrap;
  font-family: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.92rem;
  line-height: 1.45;
}

body:is(.home, .page) .ai-netlify-form {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 719px) {
  /* The text box, quick starts, and handoff stay in the page flow.
     Only the transcript folds away so it does not push the nav or the hero. */
  body:is(.home, .page) .ai-log { display: none; }
  body:is(.home, .page) .ai-panel.is-open .ai-log { display: flex; }
  body:is(.home, .page) .ai-send-row .btn,
  body:is(.home, .page) .ai-handoff .btn,
  body:is(.home, .page) .ai-consent .btn { width: 100%; }
}

@media (min-width: 720px) {
  body:is(.home, .page) .ai-panel { padding: 1.75rem 0 0.25rem; }
  body:is(.home, .page) .ai-card { padding: 1.6rem 1.6rem 1.4rem; }
  body:is(.home, .page) .ai-toggle { display: none; }
  body:is(.home, .page) .ai-chat { display: block; }
  body:is(.home, .page) .ai-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    gap: 1.25rem 1.5rem;
    align-items: start;
  }
  body:is(.home, .page) .ai-log {
    min-height: 16rem;
    max-height: 28rem;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 0.85rem;
  }
  body:is(.home, .page) .ai-log:empty {
    display: flex;
  }
  body:is(.home, .page) .ai-log:empty::before {
    content: "The conversation will show up here. Type below, or use a quick start. This box does not answer by itself.";
    color: var(--faint);
    font-size: 0.95rem;
  }
  body:is(.home, .page) .ai-handoff { flex-direction: row; flex-wrap: wrap; }
}

@media (min-width: 1120px) {
  body:is(.home, .page) .ai-card { padding: 1.85rem 2rem 1.6rem; }
}

@media (max-width: 1119px) {
  /* The fixed Call Jimmy / Get Home Value bar is taller than the old
     4.6rem page padding once its own padding and the iPhone home
     indicator are included. Give the assistant room to scroll clear,
     including the status line on a ~400px screen. */
  body:is(.home, .page) {
    padding-bottom: calc(7rem + env(safe-area-inset-bottom));
    scroll-padding-bottom: calc(7rem + env(safe-area-inset-bottom));
  }
  body:is(.home, .page) .ai-panel,
  body:is(.home, .page) .ai-status,
  body:is(.home, .page) .ai-composer,
  body:is(.home, .page) .ai-composer textarea,
  body:is(.home, .page) .ai-handoff,
  body:is(.home, .page) .ai-consent,
  body:is(.home, .page) .ai-toggle {
    scroll-margin-bottom: calc(7rem + env(safe-area-inset-bottom));
  }
}

body:is(.home, .page) .ai-review {
  margin: 0 0 0.85rem;
  white-space: pre-wrap;
  font-family: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.92rem;
  line-height: 1.45;
}

body:is(.home, .page) .ai-ask-heading {
  max-width: 22ch;
  margin: 0 0 0.85rem;
}
