:root {
  color-scheme:light; --paper:#f4f4ed; --ink:#192820; --muted:#59675d; --line:#d1d8ce; --green:#087c59;
  --dark:#0e1713; --mint:#a9efcb; font-family:"Segoe UI",sans-serif; font-synthesis:none;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth; scroll-padding-top:1.5rem;
}
body {
  margin:0; background:var(--paper); color:var(--ink); font-size:1rem; line-height:1.6;
}
a {
  color:inherit; text-underline-offset:5px;
}
button,input,textarea {
  font:inherit;
}
button,a {
  touch-action:manipulation;
}
button {
  cursor:pointer;
}
button:disabled {
  cursor:default; opacity:.65;
}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible {
  outline:3px solid #23bc83; outline-offset:4px;
}
img {
  max-width:100%; height:auto; display:block;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3 {
  line-height:1.1;
}
h2 {
  font-size:clamp(1.9rem,3.5vw,3rem); font-weight:500; letter-spacing:-.045em;
}
h3 {
  font-size:1.5rem; letter-spacing:-.03em; font-weight:550;
}
.wrap {
  width:min(1240px,calc(100% - 64px)); margin-inline:auto;
}
.header {
  display:flex; justify-content:space-between; align-items:center; gap:1rem; padding-block:25px;
  border-bottom:1px solid var(--line);
}
.brand {
  text-decoration:none; display:flex; align-items:center; gap:10px;
}
.mark {
  font:bold 1.8rem Georgia,serif; width:40px; height:42px; border:1px solid #98a99b; border-radius:10px;
  text-align:center;
}
.brand strong {
  font-size:1.5rem; letter-spacing:-.08em;
}
.byline {
  font-size:.8rem; margin-left:6px; color:var(--muted);
}
nav {
  display:flex; align-items:center; gap:26px; font-size:.9rem;
}
nav a {
  text-decoration:none;
}
.language {
  border:1px solid var(--line); border-radius:50%; width:40px; height:40px; background:transparent;
  font-size:.8rem;
}
.skip {
  position:absolute; top:-100px; left:1rem; background:var(--ink); color:white; padding:12px;
  z-index:10;
}
.skip:focus {
  top:10px;
}
.hero {
  display:grid; grid-template-columns:1fr 1.06fr; gap:56px; padding-block:88px 90px; align-items:center;
}
.eyebrow {
  font:600 .75rem/1.6 Consolas,"Courier New",monospace; letter-spacing:.12em; color:var(--green);
  margin-bottom:20px;
}
.hero h1 {
  font-size:clamp(3rem,5.4vw,5.2rem); letter-spacing:-.065em; line-height:1.01; font-weight:500;
}
.hero h1 em {
  font:italic 1em/1.04 Georgia,serif; color:var(--green);
}
.lead {
  font-size:1.14rem; line-height:1.7; max-width:470px; margin-top:28px; color:var(--muted);
}
.actions {
  display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin-top:30px;
}
.button {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem; border:1px solid
  var(--line); border-radius:6px; padding:12px 19px; background:transparent; text-decoration:none;
  font-weight:600; font-size:.94rem;
}
.primary {
  background:var(--green); border-color:var(--green); color:white;
}
.button:hover {
  filter:brightness(1.1);
}
.text-link {
  font-size:.94rem; font-weight:550;
}
.meta {
  font:.75rem/1.6 Consolas,monospace; color:var(--muted); margin-top:25px;
}
.hero-evidence {
  background:var(--dark); border:1px solid #304638; border-radius:12px; overflow:hidden; box-shadow:18px
  22px 0 #dce3d8; transform:rotate(-1.2deg);
}
.evidence-label {
  display:flex; gap:10px; align-items:center; padding:17px 18px; color:#d6e4db; font-size:.78rem;
}
.hero-evidence img {
  border-block:1px solid #334138;
}
.hero-evidence>p {
  padding:14px 18px; color:#a4b7a9; font-size:.77rem;
}
.live-dot {
  display:inline-block; width:7px; height:7px; flex:0 0 7px; background:#59d59c; border-radius:100%;
}
.demo-section {
  background:#e4e9df; border-block:1px solid #d0d9ca; padding-block:66px 76px;
}
.section-heading {
  display:flex; justify-content:space-between; gap:36px; align-items:end; margin-bottom:30px;
}
.section-heading h2 {
  max-width:650px;
}
.simulation {
  max-width:270px; color:var(--muted); font: .76rem/1.7 Consolas,monospace;
}
.workbench {
  background:var(--dark); color:#e5eee7; border:1px solid #435c49; border-radius:11px; box-shadow:0 26px
  65px #253b2920; overflow:hidden;
}
.workbench-top {
  display:flex; align-items:center; gap:20px; background:#17241c; padding:14px 20px; font-size:.78rem;
  color:#bdcdbf; border-bottom:1px solid #304537;
}
.mini-brand {
  font:1.2rem Georgia,serif; color:var(--mint);
}
.mini-brand strong {
  font:600 1rem "Segoe UI",sans-serif; color:#eef5ef; margin-left:5px;
}
.workbench-top>.quiet {
  margin-left:auto;
}
.quiet {
  border:0; background:none; color:inherit; text-decoration:underline; text-underline-offset:4px;
  font-size:.8rem; padding:6px;
}
.scene-tabs {
  display:flex; gap:2px; background:#131e18; border-bottom:1px solid #304537; padding-inline:12px;
}
.scene-tabs button {
  border:0; border-bottom:2px solid transparent; background:transparent; color:#b8c6bd;
  font-size:.84rem; padding:18px 17px;
}
.scene-tabs button[aria-selected=true] {
  color:var(--mint); border-color:#80d6a7;
}
.scene {
  padding:24px; min-height:430px;
}
.scene[hidden] {
  display:none;
}
.chat-launcher {
  display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px;
}
.chat-launcher p {
  font-size:.87rem; max-width:600px; color:#bdcbbf;
}
.chat-launcher>div {
  display:flex; gap:8px;
}
.chip {
  border:1px solid #4f715b; border-radius:5px; background:#1b2c21; color:#d4e3d7; white-space:nowrap;
  font-size:.8rem; padding:8px 11px;
}
.chip:hover {
  background:#2a4434;
}
.chat-windows {
  display:grid; grid-template-columns:1fr 1fr; gap:16px;
}
.chat-window {
  border:1px solid #3d5746; border-radius:8px; overflow:hidden; min-width:0; background:#121d16;
}
.chat-window.active {
  border-color:#80d6a7;
}
.window-heading {
  display:flex; align-items:center; gap:7px; padding:12px 15px; background:#1c2c22; border-bottom:1px
  solid #344d3d;
}
.window-heading h3 {
  flex:1; font-size:.88rem; line-height:1.4; white-space:nowrap; text-overflow:ellipsis;
  overflow:hidden; letter-spacing:0;
}
.window-heading button {
  border:0; background:none; color:#bfccbf; font-size:.86rem; min-width:30px; min-height:30px;
}
.chat-messages {
  height:160px; overflow:auto; padding:18px; display:flex; flex-direction:column;
  align-items:flex-start; gap:12px;
}
.message {
  font-size:.84rem; line-height:1.55; max-width:94%; background:#1c2b21; border:1px solid #304437;
  padding:10px 12px; border-radius:2px 10px 10px 10px; overflow-wrap:anywhere;
}
.message.user {
  align-self:flex-end; background:#163f30; border-color:#286c51; border-radius:10px 2px 10px 10px;
}
.message-author {
  font:.66rem/1.6 Consolas,monospace; color:#92b9a0; display:block; margin-bottom:4px;
  text-transform:uppercase; letter-spacing:.1em;
}
.composer {
  border-top:1px solid #304437; padding:12px; display:flex; gap:9px; align-items:end;
}
.composer textarea {
  resize:vertical; min-height:63px; max-height:140px; min-width:0; flex:1; background:#0e1812;
  color:#e5eee7; border:1px solid #405b47; border-radius:5px; padding:9px; font-size:.84rem;
}
.composer button {
  border:1px solid #24966e; border-radius:5px; padding:8px 12px; background:#087c59; color:white;
  font-size:.8rem; min-height:42px;
}
.scene-note {
  font-size:.75rem; color:#9ab19f; margin-top:15px;
}
.task-layout {
  display:grid; grid-template-columns:1fr 1fr; gap:60px; padding:35px 20px;
}
.task-layout .eyebrow {
  color:#85cfa6; margin-bottom:14px;
}
.task-layout h3 {
  font-size:2rem; max-width:390px;
}
.task-layout p {
  color:#b4c9bc; margin-top:18px; font-size:.96rem;
}
.task-layout .button {
  margin-top:24px;
}
.task-layout .result {
  font-size:.86rem; color:#9fe3b9; min-height:3em;
}
.record {
  border:1px solid #3d5946; border-radius:8px; align-self:start; margin-top:15px;
}
.record>div {
  padding:18px; display:flex; gap:16px; justify-content:space-between; border-bottom:1px solid #2c4635;
  font-size:.87rem;
}
.record>div:last-child {
  border:0;
}
.record span {
  color:#9cb5a4;
}
.record code {
  color:#b3e3c6; font-family:Consolas,monospace; overflow-wrap:anywhere;
}
.record strong {
  font-weight:500;
}
.timeline {
  list-style:none; margin:12px 0 0; padding:0;
}
.timeline li {
  display:flex; gap:20px; margin-bottom:24px;
}
.timeline li>span {
  display:flex; align-items:center; justify-content:center; width:34px; height:34px; flex:0 0 34px;
  border:1px solid #496a53; border-radius:100%; font:.75rem Consolas,monospace; color:#9ab19f;
}
.timeline strong {
  font-size:.92rem; font-weight:500;
}
.timeline p {
  font-size:.83rem; margin-top:4px; max-width:320px;
}
.timeline .reviewed>span {
  background:#087c59; color:white; border-color:#42c092;
}
.workbench-bottom {
  border-top:1px solid #304537; padding:14px 20px; display:flex; align-items:center; gap:9px;
  color:#a1b7a8; font-size:.74rem;
}
.workbench-bottom a {
  margin-left:auto;
}
.details {
  padding-block:90px;
}
.details .section-heading {
  margin-bottom:46px;
}
.feature-row {
  display:grid; grid-template-columns:40px 1fr 320px; gap:30px; align-items:center; padding:34px 0;
  border-top:1px solid var(--line);
}
.feature-row .number {
  font: .8rem Consolas,monospace; color:var(--green);
}
.feature-row h3 {
  margin-bottom:12px;
}
.feature-row p {
  color:var(--muted); max-width:500px;
}
.feature-row img {
  border:1px solid var(--line); border-radius:7px; max-height:190px; object-fit:cover;
  object-position:top;
}
.caption {
  color:var(--muted); font-size:.8rem; margin-top:20px; max-width:750px;
}
.install-section {
  background:#e7ebdf; padding:65px 0; border-block:1px solid var(--line);
}
.install-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center;
}
.install-grid p:not(.eyebrow) {
  color:var(--muted); margin-top:22px;
}
.code-card {
  min-width:0; border:1px solid #c0cfbe; background:#f4f6f0; border-radius:8px; overflow:hidden;
}
.code-card>div {
  display:flex; justify-content:space-between; border-bottom:1px solid var(--line); font:.75rem
  Consolas,monospace; padding:15px 20px; color:var(--muted);
}
.code-card pre {
  margin:0; padding:25px 20px; white-space:pre-wrap; overflow-wrap:anywhere; font: .88rem/1.8
  Consolas,monospace; color:#135c3b;
}
.code-card p {
  padding:0 20px 22px; font-size:.82rem; margin-top:0!important;
}
.contact {
  display:flex; align-items:center; justify-content:space-between; gap:70px; padding-block:85px;
}
.contact h2 {
  font-size:2.4rem; max-width:560px;
}
.contact p:not(.eyebrow) {
  color:var(--muted); max-width:630px; margin-top:20px;
}
.contact .actions {
  flex-direction:column; align-items:flex-start; flex-shrink:0; margin:0;
}
footer {
  border-top:1px solid var(--line); padding-block:25px 35px; display:flex; gap:24px;
  justify-content:space-between; font-size:.76rem; color:var(--muted);
}
dialog {
  border:1px solid var(--line); border-radius:10px; padding:28px; max-width:460px; width:calc(100% -
  32px); background:var(--paper); color:var(--ink);
}
dialog::backdrop {
  background:#08170fb5;
}
dialog h2 {
  font-size:1.8rem; margin-bottom:24px;
}
dialog label {
  display:block; font-size:.9rem;
}
dialog input {
  width:100%; margin-top:8px; border:1px solid #90a18f; border-radius:5px; padding:10px;
  background:white;
}
dialog .actions {
  justify-content:flex-end;
}
.notice {
  border:1px solid #718b77; padding:16px; margin-bottom:20px;
}
@media(max-width:1000px) {
  .hero {
    gap:34px;
  }
  .hero h1 {
    font-size:3.8rem;
  }
  .task-layout {
    gap:28px; padding-inline:4px;
  }
  .feature-row {
    grid-template-columns:28px 1fr 240px;
  }
  .install-grid {
    gap:34px;
  }
  .byline {
    display:none;
  }
}
@media(max-width:760px) {
  .wrap {
    width:calc(100% - 36px);
  }
  .header {
    padding-block:18px;
  }
  nav {
    gap:17px; font-size:.8rem;
  }
  nav>a:first-child {
    display:none;
  }
  .hero {
    grid-template-columns:1fr; padding-block:48px 65px; gap:44px;
  }
  .hero h1 {
    font-size:clamp(3rem,11vw,4.5rem); max-width:600px;
  }
  .lead {
    max-width:100%;
  }
  .hero-evidence {
    transform:none; box-shadow:9px 12px 0 #dce3d8;
  }
  .section-heading {
    display:block;
  }
  .section-heading>.simulation,.section-heading>.text-link {
    display:block; margin-top:20px; max-width:100%;
  }
  .demo-section {
    padding-block:43px;
  }
  .workbench-top {
    gap:10px; padding:12px;
  }
  .workbench-top>span:nth-child(2) {
    display:none;
  }
  .scene-tabs {
    padding-inline:3px;
  }
  .scene-tabs button {
    padding:14px 8px; flex:1; font-size:.73rem;
  }
  .scene {
    padding:14px; min-height:460px;
  }
  .chat-launcher {
    display:block;
  }
  .chat-launcher>div {
    margin-top:14px;
  }
  .chat-windows {
    display:block;
  }
  .chat-window {
    display:none;
  }
  .chat-window.active {
    display:block;
  }
  .chat-messages {
    height:190px;
  }
  .workbench-bottom {
    font-size:.69rem; flex-wrap:wrap; padding:12px;
  }
  .workbench-bottom a {
    margin-left:16px;
  }
  .task-layout {
    grid-template-columns:1fr; padding-block:12px; gap:15px;
  }
  .task-layout h3 {
    font-size:1.8rem;
  }
  .record {
    margin-top:0;
  }
  .record>div {
    padding:12px;
  }
  .timeline {
    margin:5px 0;
  }
  .task-layout .result {
    min-height:0;
  }
  .details {
    padding-block:55px;
  }
  .feature-row {
    grid-template-columns:25px 1fr; gap:15px;
  }
  .feature-row img {
    grid-column:2; width:100%; max-height:240px; margin-top:10px;
  }
  .install-grid {
    grid-template-columns:1fr; gap:35px;
  }
  .contact {
    display:block; padding-block:55px;
  }
  .contact .actions {
    flex-direction:row; margin-top:28px; align-items:center;
  }
  .contact h2 {
    font-size:2rem;
  }
  footer {
    flex-wrap:wrap; gap:12px 20px;
  }
  .caption {
    font-size:.8rem;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important; transition:none!important;
  }
}