:root {
  --paper: #f5f4ee;
  --ink: #10201d;
  --muted: #53645f;
  --line: #c9cebf;
  --green: #1d6b56;
  --green-deep: #123d35;
  --amber: #d6a433;
  --coral: #d8634d;
  --sand: #e7e3d7;
  --white: #fffef9;
  --code: #e7efe9;
  --shadow: 0 20px 50px rgba(16, 32, 29, .14);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); line-height: 1.5; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.skip-link { position: fixed; top: -3rem; left: 1rem; z-index: 10; padding: .55rem .8rem; background: var(--amber); color: var(--ink); }
.skip-link:focus { top: 1rem; }
.shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.site-header { position: sticky; top: 0; z-index: 5; border-bottom: 1px solid var(--line); background: rgba(245, 244, 238, .97); }
.nav-row { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.brand { display: inline-flex; align-items: center; gap: .55rem; text-decoration: none; font-size: 1.04rem; font-weight: 760; letter-spacing: 0; }
.brand-mark { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--ink); border-radius: 5px; background: var(--green); color: var(--white); font-size: .92rem; font-weight: 850; }
nav { display: flex; flex-wrap: wrap; justify-content: end; gap: 1.25rem; }
nav a { color: var(--muted); text-decoration: none; font-size: .87rem; font-weight: 620; }
nav a:hover, nav a:focus-visible, .footer-row a:hover { color: var(--green); }

.hero { min-height: calc(100vh - 72px); display: grid; grid-template-columns: minmax(280px, .84fr) minmax(540px, 1.16fr); align-items: center; gap: 4rem; padding: 4.5rem 0 3.75rem; }
.eyebrow { margin: 0 0 .85rem; color: var(--green); font-size: .74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { letter-spacing: 0; }
h1 { max-width: 9ch; margin-bottom: 1rem; font-size: 4.75rem; line-height: .95; font-weight: 780; }
h2 { margin-bottom: 1.25rem; font-size: 2.5rem; line-height: 1.06; font-weight: 740; }
h3 { font-size: 1.1rem; line-height: 1.2; }
.hero-lede { max-width: 34rem; margin-bottom: 1.6rem; font-size: 1.18rem; color: #273b36; }
.actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-bottom: 1rem; }
.button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: .68rem .95rem; border: 1px solid var(--ink); border-radius: 5px; text-decoration: none; font-size: .91rem; font-weight: 720; }
.button-primary { background: var(--green); color: var(--white); border-color: var(--green); }
.button-primary:hover, .button-primary:focus-visible { background: var(--green-deep); }
.button-secondary { background: transparent; }
.button-secondary:hover, .button-secondary:focus-visible { background: var(--sand); }
.local-note { max-width: 31rem; margin: 0; color: var(--muted); font-size: .82rem; }

.product-window { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #9ba9a1; border-radius: 7px; background: var(--white); box-shadow: var(--shadow); }
.window-top { height: 41px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 13px; border-bottom: 1px solid #d7dbd2; background: #eef0e9; color: #5d6b64; font-size: .71rem; }
.window-dots { display: flex; gap: 5px; }
.window-dots i { width: 8px; height: 8px; border-radius: 50%; background: #b2bab0; }
.window-dots i:nth-child(1) { background: var(--coral); }.window-dots i:nth-child(2) { background: var(--amber); }.window-dots i:nth-child(3) { background: var(--green); }
.window-title { font-weight: 700; }.window-state { justify-self: end; color: var(--green); font-weight: 750; }
.workspace-preview { min-height: 430px; display: grid; grid-template-columns: 168px minmax(0, 1fr); }
.preview-rail { display: flex; flex-direction: column; gap: .55rem; padding: 17px 11px; background: #edf0e8; border-right: 1px solid #d7dbd2; }
.preview-rail p { margin: 0; color: #718078; font-size: .58rem; font-weight: 800; letter-spacing: .08em; }
.preview-rail strong { margin-bottom: .45rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .72rem; }
.rail-item { width: 100%; padding: .47rem .52rem; border-radius: 4px; background: transparent; color: #52625b; font-size: .67rem; line-height: 1.25; }
.rail-active { background: #d8e6dc; color: var(--green-deep); font-weight: 720; }.rail-spacer { flex: 1; }
.rail-status { display: flex; align-items: center; gap: .35rem; color: #68766e; font-size: .59rem; }.rail-status b { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.preview-chat { min-width: 0; padding: 24px 25px 17px; background: #fcfcf7; }
.preview-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; }.mini-label { color: #718078; font-size: .58rem; font-weight: 800; letter-spacing: .08em; }.preview-heading h2 { margin: .2rem 0 0; font-size: 1.12rem; }.time-pill { padding: .22rem .4rem; border: 1px solid #d1d8cf; border-radius: 4px; color: #6a766f; font-size: .63rem; white-space: nowrap; }
.message { width: fit-content; max-width: 92%; margin-bottom: .82rem; padding: .72rem .82rem; border-radius: 6px; font-size: .75rem; line-height: 1.45; }.user-message { margin-left: auto; background: #dfeade; color: #19372d; }.sage-message { border: 1px solid #d4dbd1; background: var(--white); }.sage-message p { margin-bottom: .45rem; }.sage-message p:last-child { margin-bottom: 0; }.sage-message code, .steps code { padding: .08rem .26rem; border: 1px solid #d3ddd4; border-radius: 3px; background: var(--code); color: #174434; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .89em; }
.sage-name { display: flex; align-items: center; gap: .38rem; margin-bottom: .45rem; color: #4e6258; font-size: .65rem; font-weight: 780; }.sage-name span { width: 16px; height: 16px; display: grid; place-items: center; border-radius: 4px; background: var(--green); color: var(--white); font-size: .55rem; }
.activity { display: flex; align-items: center; gap: .38rem; margin: 0 0 .62rem; color: #6b7a72; font-size: .64rem; }.activity-dot { width: 7px; height: 7px; border: 2px solid var(--amber); border-radius: 50%; }
.proposal-row { display: flex; align-items: center; gap: .55rem; padding: .55rem .62rem; border: 1px solid #bfd0c4; border-left: 3px solid var(--green); background: #f2f7f2; color: #2c4c3e; font-size: .66rem; }.proposal-row span:nth-child(2) { display: grid; gap: .08rem; }.proposal-row small { color: #687a70; font-size: .58rem; }.proposal-icon { width: 17px; height: 17px; display: grid; place-items: center; border-radius: 3px; background: var(--green); color: var(--white); font-size: .88rem; }.proposal-diff { margin-left: auto; color: var(--green); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .61rem; font-weight: 700; white-space: nowrap; }
.prompt-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.1rem; padding: .62rem .72rem; border: 1px solid #cfd6cd; color: #89928c; font-size: .65rem; }.prompt-bar b { padding: .22rem .42rem; border-radius: 3px; background: var(--green); color: var(--white); font-size: .6rem; }
.product-window figcaption { padding: .55rem .75rem; border-top: 1px solid #d7dbd2; background: #f0f2eb; color: var(--muted); font-size: .7rem; }

.signal-band { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--sand); }.signal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }.signal-grid p { min-height: 108px; margin: 0; padding: 1.3rem 1.6rem 1.15rem 0; color: #3c5149; font-size: .86rem; }.signal-grid p + p { padding-left: 1.6rem; border-left: 1px solid #bec5b9; }.signal-grid b { display: block; margin-bottom: .35rem; color: var(--ink); }
.section { padding: 7.25rem 0; }.split-section { display: grid; grid-template-columns: .85fr 1.15fr; gap: 7rem; }.section-copy { max-width: 40rem; font-size: 1.05rem; color: #334941; }.section-copy p + p { margin-top: 1.1rem; }
.section-ink { background: var(--ink); color: var(--white); }.section-ink .eyebrow { color: #9dcfb7; }.section-ink h2 { max-width: 15ch; }.section-heading { max-width: 42rem; }.workflow-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 3.3rem; }.workflow-grid article { padding-top: 1.25rem; border-top: 1px solid #5d716a; }.workflow-number { display: block; margin-bottom: 2.3rem; color: var(--amber); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .72rem; }.workflow-grid h3 { margin-bottom: .7rem; color: #fffef9; }.workflow-grid p { margin: 0; color: #cad4ce; font-size: .92rem; }
.install-section { display: grid; grid-template-columns: .82fr 1.18fr; column-gap: 6rem; align-items: start; }.steps { grid-column: 2; display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }.steps li { display: grid; grid-template-columns: 40px 1fr; gap: 1rem; padding: 1.2rem 0; border-top: 1px solid var(--line); }.steps li:last-child { border-bottom: 1px solid var(--line); }.steps li > span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--green); border-radius: 4px; color: var(--green); font-size: .74rem; font-weight: 800; }.steps h3 { margin-bottom: .3rem; }.steps p { margin: 0; color: var(--muted); font-size: .9rem; }.requirements { grid-column: 2; margin: 1.25rem 0 0; color: #51635b; font-size: .84rem; }
.section-sand { background: var(--sand); }.privacy-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 6rem; }.privacy-layout h2 { max-width: 12ch; }.privacy-layout dl { margin: 0; }.privacy-layout dl div { display: grid; grid-template-columns: 145px 1fr; gap: 1rem; padding: 1rem 0; border-top: 1px solid #b8c0b4; }.privacy-layout dl div:last-child { border-bottom: 1px solid #b8c0b4; }.privacy-layout dt { color: var(--green-deep); font-size: .86rem; font-weight: 800; }.privacy-layout dd { margin: 0; color: #40544b; font-size: .9rem; }
.evidence-section { display: grid; grid-template-columns: .95fr 1.05fr; gap: 7rem; align-items: center; }.evidence-copy h2 { max-width: 13ch; }.evidence-copy p:last-child { max-width: 34rem; color: #3e5149; }.evidence-list { border-top: 1px solid var(--line); }.evidence-list p { display: flex; justify-content: space-between; gap: 1.25rem; margin: 0; padding: 1rem 0; border-bottom: 1px solid var(--line); font-size: .9rem; }.evidence-list span { color: var(--muted); text-align: right; font-size: .8rem; }
.section-coral { background: var(--coral); color: #251813; }.section-coral .eyebrow { color: #552a21; }.support-row { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: end; }.support-row h2 { max-width: 13ch; margin-bottom: 0; }.support-row > p { max-width: 31rem; margin: 0; font-size: 1rem; }
.site-footer { border-top: 1px solid #142d27; background: var(--green-deep); color: #dce8de; }.footer-row { min-height: 100px; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }.footer-row .brand { color: var(--white); }.footer-row .brand-mark { border-color: #cbe3d4; }.footer-row p { margin: 0; color: #b8cfc0; font-size: .82rem; }.footer-row > a:last-child { color: var(--white); font-size: .85rem; font-weight: 700; }

@media (max-width: 980px) {
  .hero { grid-template-columns: 1fr; gap: 2.75rem; min-height: 0; padding-top: 4rem; }.hero-copy { max-width: 42rem; }.product-window { max-width: 760px; }.split-section, .privacy-layout, .evidence-section, .support-row { gap: 3rem; }.install-section { column-gap: 3rem; }
}

@media (max-width: 720px) {
  .shell { width: min(100% - 32px, 1180px); }.nav-row { min-height: 64px; align-items: center; }.nav-row nav { gap: .7rem 1rem; }.nav-row nav a { font-size: .76rem; }.hero { padding: 3.3rem 0 2.7rem; }.hero h1 { font-size: 3.4rem; }.hero-lede { font-size: 1.03rem; }.workspace-preview { min-height: 390px; grid-template-columns: 118px minmax(0, 1fr); }.preview-rail { padding: 12px 8px; }.preview-chat { padding: 18px 14px 14px; }.preview-rail strong { font-size: .63rem; }.rail-item { font-size: .57rem; padding: .42rem .35rem; }.preview-heading h2 { font-size: .98rem; }.message { max-width: 100%; font-size: .68rem; }.proposal-row small { display: none; }.signal-grid, .workflow-grid { grid-template-columns: 1fr; }.signal-grid p { min-height: auto; padding: 1rem 0; }.signal-grid p + p { padding-left: 0; border-left: 0; border-top: 1px solid #bec5b9; }.section { padding: 4.4rem 0; }.split-section, .privacy-layout, .evidence-section, .support-row, .install-section { display: block; }.section h2 { font-size: 2.05rem; }.section-copy, .privacy-layout dl, .evidence-list, .steps, .requirements { margin-top: 2rem; }.workflow-grid { gap: 1.4rem; margin-top: 2.2rem; }.workflow-number { margin-bottom: 1rem; }.privacy-layout dl div { grid-template-columns: 1fr; gap: .25rem; }.evidence-list p { display: grid; gap: .25rem; }.evidence-list span { text-align: left; }.steps li { grid-template-columns: 32px 1fr; }.support-row > p { margin-top: 2rem; }.footer-row { min-height: 125px; align-items: flex-start; justify-content: center; flex-direction: column; gap: .5rem; padding: 1.25rem 0; }
}

@media (max-width: 430px) {
  .nav-row { align-items: flex-start; padding: .8rem 0; }.nav-row nav { padding-top: .2rem; }.nav-row .brand { flex-shrink: 0; }.workspace-preview { grid-template-columns: 92px minmax(0, 1fr); }.preview-rail strong { display: none; }.preview-rail p { margin-bottom: .45rem; }.rail-item { font-size: .54rem; }.rail-status { display: none; }.window-title { font-size: .62rem; }.window-state { font-size: .6rem; }.preview-chat { padding: 15px 11px 12px; }.sage-message code { font-size: .78em; }.proposal-diff { font-size: .54rem; }.actions .button { width: 100%; }.local-note { font-size: .77rem; }
}
