@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --ink: #183b2d;
  --ink-soft: #385448;
  --forest: #174c38;
  --forest-deep: #0e3429;
  --green: #bde0bc;
  --cream: #f7f5ef;
  --line: #dcded4;
  --peach: #f3d8b7;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'DM Sans', system-ui, sans-serif;
  --display: 'Manrope', 'DM Sans', system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font: 16px/1.55 var(--sans); }
button, input { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible { outline: 3px solid #eea55b; outline-offset: 4px; }
::selection { background: #c8e8c2; color: #123428; }
.page-shell { overflow: hidden; }
.section-wrap { max-width: 1256px; padding-left: 44px; padding-right: 44px; margin: 0 auto; }
.skip-link { position: absolute; top: -80px; left: 20px; z-index: 100; padding: 10px 18px; background: white; border-radius: 8px; }
.skip-link:focus { top: 12px; }

.site-header { height: 84px; max-width: 1340px; padding: 0 44px; margin: auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--forest); font: 800 30px/1 var(--display); letter-spacing: -.075em; }
.brand-dot { color: #e5a662; }
.brand-mark { width: 34px; height: 34px; border-radius: 11px; background: var(--forest); position: relative; display: grid; place-items: center; transform: rotate(-8deg); }
.brand-mark:before { content: ''; width: 16px; height: 16px; border: 4px solid #e8f3db; border-right-color: transparent; border-radius: 50%; transform: rotate(8deg); }
.brand-mark span { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #eeb96e; right: 7px; top: 14px; }
.site-nav { display: flex; align-items: center; gap: 34px; font-size: 14px; font-weight: 700; }
.site-nav a:not(.nav-cta) { transition: color .2s ease; }
.site-nav a:hover { color: #3d8e65; }
.site-nav .nav-cta { background: var(--forest); color: #fff; border: 1px solid var(--forest); padding: 11px 17px; border-radius: 9px; transition: transform .2s ease, background .2s ease; }
.site-nav .nav-cta:hover { background: var(--forest-deep); color: white; transform: translateY(-2px); }
.site-nav .nav-cta span { margin-left: 12px; }
.menu-toggle { display: none; }

.hero { min-height: 680px; display: grid; grid-template-columns: 47% 53%; align-items: center; position: relative; }
.hero-copy { position: relative; z-index: 2; padding: 80px 0 98px; min-width: 0; }
.eyebrow, .kicker { color: #527360; font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 10px; }
.eyebrow-line { width: 20px; height: 2px; background: #d6a570; display: inline-block; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--display); }
h1 { font-size: clamp(52px, 5.6vw, 80px); line-height: 1.09; letter-spacing: -.075em; margin: 26px 0 28px; max-width: 650px; }
h1 em, h2 em { font-family: var(--serif); font-weight: 400; letter-spacing: -.07em; }
h1 em { color: #54926b; }
.hero-lead { max-width: 510px; font-size: 18px; line-height: 1.75; color: #516257; margin-bottom: 22px; }
.hero-try { max-width: 540px; padding: 17px; margin-bottom: 24px; border: 1px solid #d5dfd2; border-radius: 13px; background: #fffefa; box-shadow: 0 12px 28px rgba(36, 73, 43, .06); }
.hero-try-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 10px; }
.hero-try-heading strong { color: var(--forest); font-size: 13px; }
.hero-try-heading span { color: #7e8e7f; font-size: 11px; }
.hero-command { position: relative; display: flex; align-items: center; min-height: 48px; padding: 11px 62px 11px 13px; border-radius: 8px; background: var(--forest-deep); }
.hero-command code { display: block; overflow-x: auto; white-space: nowrap; color: #e5f1df; font: 12px/1.5 'SFMono-Regular', Consolas, monospace; }
.hero-command .copy-button { right: 9px; top: 50%; transform: translateY(-50%); }
.hero-try p { margin: 11px 0 0; color: #718174; font-size: 11px; line-height: 1.5; }
.hero-try p a { color: var(--forest); font-weight: 800; }
.hero-try p a:hover { text-decoration: underline; }
.copy-button { position: absolute; border: 1px solid #5f8267; background: #285743; color: #e4f1df; border-radius: 6px; padding: 4px 10px; font-size: 10px; }
.copy-button:hover { background: #376b51; }
.hero-actions { display: flex; align-items: center; gap: 27px; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 28px; font-size: 14px; font-weight: 800; border-radius: 10px; transition: transform .2s ease, box-shadow .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--forest); color: white; padding: 16px 20px; box-shadow: 0 12px 20px rgba(24, 76, 56, .12); }
.button-primary:hover { box-shadow: 0 16px 24px rgba(24, 76, 56, .2); }
.button-text { gap: 12px; color: var(--forest); }
.hero-footnote { display: flex; align-items: center; gap: 8px; margin-top: 36px; font-size: 12px; font-weight: 700; color: #7a897d; }
.pulse-dot { display: inline-block; flex-shrink: 0; width: 7px; height: 7px; border-radius: 50%; background: #6eaf80; box-shadow: 0 0 0 4px #e0eddc; }

.hero-art { height: 630px; position: relative; display: flex; align-items: center; justify-content: center; margin-right: -72px; isolation: isolate; }
.art-glow { position: absolute; inset: 85px 45px 65px 30px; border-radius: 44% 54% 48% 50%; background: radial-gradient(circle at 50% 50%, #c5dec4 0, #d9e8d5 40%, transparent 76%); filter: blur(4px); z-index: -1; }
.orbit { position: absolute; border: 1px solid rgba(83, 135, 99, .2); border-radius: 50%; z-index: -1; }
.orbit-one { width: 550px; height: 550px; transform: rotate(19deg) scaleX(1.05); }
.orbit-two { width: 400px; height: 400px; transform: rotate(-30deg) scaleX(1.32); }
.mock-window { width: min(480px, 90%); border-radius: 17px; overflow: hidden; background: #fffefa; border: 1px solid #d1d9cb; box-shadow: 0 32px 70px rgba(32, 69, 42, .18), 0 4px 10px rgba(27, 67, 43, .07); transform: rotate(-3deg); }
.mock-topbar { height: 44px; background: #f3f3ed; border-bottom: 1px solid #e2e5db; color: #7e897e; font: 700 11px/1 var(--sans); display: flex; align-items: center; justify-content: space-between; padding: 0 15px; }
.window-dots { display: flex; gap: 5px; }
.window-dots i { width: 7px; height: 7px; background: #d6dccf; border-radius: 50%; }
.window-dots i:first-child { background: #e7b5a1; }
.window-dots i:nth-child(2) { background: #eecb8c; }
.window-dots i:last-child { background: #b7d6b0; }
.mock-topbar-icon { font-size: 18px; font-weight: 400; }
.mock-body { padding: 28px 28px 22px; }
.mock-label { display: flex; align-items: center; gap: 7px; color: #678377; font: 800 10px/1 var(--sans); letter-spacing: .13em; }
.label-square { display: inline-block; width: 8px; height: 8px; background: #80b98d; border-radius: 2px; }
.label-circle { display: inline-block; width: 8px; height: 8px; background: #d1a766; border-radius: 50%; }
.mock-live { margin-left: auto; color: #5fa47a; font-size: 9px; letter-spacing: .06em; }
.mock-title { font: 800 20px/1.35 var(--display); letter-spacing: -.04em; margin: 13px 0 23px; max-width: 310px; }
.status-row, .suggestion-row { display: flex; align-items: center; gap: 12px; border: 1px solid #dfe7d9; background: #f5f9f2; padding: 12px; border-radius: 9px; margin-bottom: 9px; }
.status-icon, .suggestion-icon { display: grid; place-items: center; flex: 0 0 32px; width: 32px; height: 32px; border-radius: 7px; background: #d9ebd7; color: #477d59; }
.suggestion-row { background: #fffaf0; border-color: #efe6d8; }
.suggestion-icon { background: #f8e9c9; color: #ba8750; }
.status-row div, .suggestion-row div { flex: 1; }
.status-row strong, .suggestion-row strong, .status-row small, .suggestion-row small { display: block; }
.status-row strong, .suggestion-row strong { font-size: 11px; }
.status-row small, .suggestion-row small { color: #839084; font-size: 9px; margin-top: 1px; }
.status-tick, .suggestion-arrow { color: #7b9d7e; font-size: 15px; }
.mock-divider { height: 1px; background: #e8e9df; margin: 22px 0 19px; }
.memory-card { display: flex; gap: 13px; margin-top: 13px; background: #f2f5ed; border: 1px solid #e1e8da; border-radius: 9px; padding: 14px; }
.memory-spark { display: grid; place-items: center; flex: 0 0 27px; width: 27px; height: 27px; border-radius: 7px; background: var(--forest); color: #dcf5d5; }
.memory-card strong { font-size: 11px; }
.memory-card p { font-size: 11px; line-height: 1.5; margin: 5px 0; }
.memory-card div > span { color: #8b998c; font-size: 9px; }
.mock-command { color: #8fa091; font: 11px/1.4 monospace; margin-top: 18px; }
.mock-command > span:first-child { color: #376d4c; }
.cursor-block { display: inline-block; width: 5px; height: 11px; background: #659d74; vertical-align: middle; margin-left: 2px; }
.floating-note { position: absolute; bottom: 88px; left: 28px; display: flex; align-items: center; gap: 9px; padding: 10px 16px 10px 10px; border-radius: 10px; background: white; box-shadow: 0 12px 35px rgba(24, 68, 45, .13); color: #3e5e48; font-size: 10px; font-weight: 800; transform: rotate(4deg); }
.floating-icon { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 7px; background: #e6f1df; color: #4d8d5c; font-size: 15px; }

.agent-strip { border-block: 1px solid var(--line); background: #f1f2ea; }
.agent-strip-inner { min-height: 92px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.agent-strip-inner > span { font-size: 11px; text-transform: uppercase; letter-spacing: .15em; font-weight: 800; color: #8a988b; }
.agent-strip-inner > div { white-space: nowrap; font: 800 17px/1 var(--display); letter-spacing: -.04em; color: #405f4d; }
.agent-symbol { margin-right: 5px; font-size: 21px; color: #608768; vertical-align: -2px; }
.codex-symbol { font-size: 24px; }
.cursor-symbol { font-size: 19px; transform: rotate(-25deg); display: inline-block; }

.paths-section { padding-top: 105px; padding-bottom: 105px; border-bottom: 1px solid var(--line); }
.paths-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.path-card { min-height: 310px; padding: 34px; border: 1px solid #d7e1d4; border-radius: 16px; background: #fffefa; display: flex; flex-direction: column; }
.path-card-team { background: #e7f1e4; border-color: #d0dfcd; }
.path-number { color: #5b8866; font-size: 11px; font-weight: 800; letter-spacing: .13em; }
.path-card h3 { margin: 29px 0 11px; font-size: 25px; line-height: 1.25; letter-spacing: -.05em; }
.path-card p { max-width: 475px; color: #5e7465; font-size: 14px; line-height: 1.7; }
.path-card p a { color: var(--forest); text-decoration: underline; text-underline-offset: 3px; }
.path-card p code { color: var(--forest); font-size: .92em; font-weight: 700; }
.path-links { display: flex; flex-wrap: wrap; gap: 12px 25px; margin-top: auto; padding-top: 20px; }
.path-links a { color: var(--forest); font-size: 12px; font-weight: 800; }
.path-links a:hover { text-decoration: underline; text-underline-offset: 4px; }
.path-links span { margin-left: 5px; }

.product-section, .architecture-section { padding-top: 112px; padding-bottom: 122px; }
.section-intro { display: flex; justify-content: space-between; align-items: end; gap: 60px; margin-bottom: 50px; }
.section-intro h2, .workflow-heading h2 { font-size: clamp(38px, 4.1vw, 57px); line-height: 1.14; letter-spacing: -.07em; margin: 20px 0 0; }
.section-intro h2 em, .workflow-heading h2 em { color: #568b63; }
.section-intro > p { color: #66786b; max-width: 365px; font-size: 15px; line-height: 1.8; margin: 0 0 5px; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.feature-card { min-height: 405px; padding: 23px 25px 26px; border: 1px solid #d4e0d0; border-radius: 15px; display: flex; flex-direction: column; }
.feature-green { background: #e4efe2; }
.feature-cream { background: #f2eadb; border-color: #e6d8bf; }
.feature-peach { background: #f1e2d4; border-color: #ead5c2; }
.feature-number { display: flex; justify-content: space-between; align-items: center; font-size: 11px; font-weight: 800; color: #6c8c74; }
.feature-number span { font-size: 20px; font-weight: 400; color: var(--forest); }
.feature-visual { height: 155px; display: flex; flex-direction: column; justify-content: center; margin: 7px 0 23px; }
.status-visual { border-radius: 12px; background: #f8fcf4; border: 1px solid #d6e8d4; padding: 20px; transform: rotate(-2deg); box-shadow: 0 10px 16px rgba(58, 101, 68, .07); }
.mini-line { display: flex; justify-content: space-between; font-size: 10px; font-weight: 800; letter-spacing: .07em; color: #779183; }
.mini-line b { color: #3c8a53; font-size: 9px; }
.mini-line.muted { font-size: 10px; letter-spacing: 0; font-weight: 600; }
.meter { height: 9px; border-radius: 9px; background: #e5eee2; margin: 16px 0 13px; overflow: hidden; }
.meter span { display: block; height: 100%; width: 41%; background: #7fb985; border-radius: inherit; }
.memory-visual { position: relative; align-items: center; }
.memory-visual-card { width: 87%; height: 122px; padding: 16px 18px; border-radius: 12px; background: #fffdf8; border: 1px solid #ecdecc; box-shadow: 0 11px 18px rgba(92, 72, 43, .09); display: flex; flex-direction: column; justify-content: space-between; transform: rotate(3deg); z-index: 1; }
.memory-visual-card span { font-size: 9px; color: #9b8b70; font-weight: 800; letter-spacing: .08em; }
.memory-visual-card strong { font: 800 15px/1.3 var(--display); letter-spacing: -.03em; max-width: 220px; }
.memory-visual-card small { font-size: 9px; color: #9c9d8f; }
.memory-visual-shadow { position: absolute; width: 80%; height: 120px; background: #e4d3b8; border: 1px solid #d9c8ae; border-radius: 12px; transform: translate(-5px, 7px) rotate(-5deg); }
.preview-visual { padding: 17px; border-radius: 12px; background: #faf6f0; border: 1px solid #e7d5c5; transform: rotate(2deg); box-shadow: 0 10px 16px rgba(101, 73, 50, .06); }
.preview-visual > span { color: #a69487; font-size: 9px; font-weight: 800; letter-spacing: .12em; margin-bottom: 10px; }
.preview-line { font: 700 10px/1.8 monospace; color: #4a6c52; }
.preview-line i { font-style: normal; margin-right: 7px; }
.preview-line.dim { color: #8ba091; }
.preview-button { width: fit-content; background: #e5efdf; border-radius: 5px; color: #487655; font-size: 9px; font-weight: 800; padding: 5px 9px; margin-top: 10px; }
.feature-card h3 { font-size: 21px; letter-spacing: -.05em; line-height: 1.25; margin-bottom: 11px; }
.feature-card p { font-size: 13px; color: #5e7465; line-height: 1.65; margin-bottom: 18px; }
.feature-card a { margin-top: auto; font-size: 12px; font-weight: 800; color: var(--forest); }
.feature-card a span { margin-left: 5px; }
.feature-card a:hover, .inline-link:hover, .architecture-note a:hover { text-decoration: underline; text-underline-offset: 4px; }

.optimization-panel { margin-top: 74px; padding: 38px; border: 1px solid #d0dfcd; border-radius: 18px; background: #e7f1e4; }
.optimization-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 28px; }
.optimization-heading h3 { font-size: clamp(25px, 3vw, 35px); line-height: 1.2; letter-spacing: -.055em; margin: 11px 0 0; }
.optimization-heading p { max-width: 260px; color: #5e7465; font-size: 13px; line-height: 1.65; margin: 0; }
.optimization-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.optimization-grid article { padding: 23px; border: 1px solid #d6e5d3; border-radius: 12px; background: #fffefa; }
.optimization-grid span { color: #6b9975; font: 800 11px/1 var(--display); letter-spacing: .12em; }
.optimization-grid h4 { font: 800 17px/1.3 var(--display); letter-spacing: -.035em; margin: 17px 0 8px; }
.optimization-grid p { color: #647a6b; font-size: 12px; line-height: 1.65; margin: 0; }
.optimization-caveat { color: #647a6b; font-size: 12px; margin: 22px 0 0; }
.optimization-panel > .inline-link { margin-top: 25px; }

.workflow-section { background: #e9eee4; border-block: 1px solid #d9e4d8; }
.workflow-inner { padding-top: 105px; padding-bottom: 110px; display: grid; grid-template-columns: 43% 1fr; gap: 10%; }
.workflow-heading h2 { margin-bottom: 24px; }
.workflow-heading p { max-width: 410px; color: #667c6c; font-size: 15px; line-height: 1.8; }
.inline-link { display: inline-block; margin-top: 14px; font-size: 13px; font-weight: 800; color: var(--forest); }
.inline-link span { margin-left: 14px; }
.workflow-steps { border-top: 1px solid #cbd9ca; }
.workflow-steps article { display: grid; grid-template-columns: 57px 1fr; gap: 13px; padding: 25px 0; border-bottom: 1px solid #cbd9ca; }
.step-number { font: 800 13px/1.5 var(--display); color: #7ea18a; }
.workflow-steps h3 { font-size: 19px; letter-spacing: -.04em; margin: 0 0 7px; }
.workflow-steps p { color: #647a6b; font-size: 13px; line-height: 1.65; margin: 0; max-width: 400px; }

.architecture-section { padding-bottom: 125px; }
.architecture-flow { display: grid; grid-template-columns: 1fr 36px 1fr 36px 1fr; align-items: stretch; gap: 14px; margin-top: 64px; }
.flow-node { min-height: 170px; padding: 23px; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid #d9dfd2; border-radius: 13px; background: #fdfcf7; box-shadow: 0 10px 25px rgba(44, 70, 47, .04); }
.flow-icon { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 9px; background: #e2eee0; color: #4a805c; font-size: 23px; margin-bottom: 21px; }
.flow-node strong { font: 800 16px/1.2 var(--display); letter-spacing: -.03em; }
.flow-node small { color: #89988a; font-size: 11px; margin-top: 6px; }
.flow-node p { color: #647a6b; font-size: 13px; line-height: 1.65; margin: 14px 0 0; }
.flow-arrow { color: #8cac90; font-size: 25px; text-align: center; align-self: center; }
.architecture-note { margin: 30px 0 0; color: #718174; font-size: 12px; text-align: center; }
.architecture-note a { color: var(--forest); font-weight: 800; }
.hero-footnote a { color: var(--forest); text-decoration: underline; text-underline-offset: 3px; }
.memory-foundation { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 30px; padding: 28px; border: 1px solid #d0dfcd; border-radius: 13px; background: #e7f1e4; }
.memory-foundation > div { flex: 1 1 280px; }
.memory-foundation h3 { font: 800 23px/1.3 var(--display); letter-spacing: -.03em; margin: 12px 0; }
.memory-foundation p { color: #647a6b; font-size: 14px; line-height: 1.65; max-width: 680px; margin: 0; }

.testimonials-section { padding-block: 72px; background: #eef1e7; border-block: 1px solid var(--line); }
.community-heading { display: flex; align-items: center; justify-content: space-between; gap: 36px; }
.community-heading h2 { font: 800 clamp(36px, 4vw, 52px)/1.15 var(--display); letter-spacing: -.055em; margin: 18px 0; }
.community-heading p { color: #647a6b; font-size: 15px; margin: 0; }
.community-heading > button { border: 0; flex-shrink: 0; }
.testimonial-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 35px; color: #647a6b; font-size: 13px; }
.testimonial-controls { display: flex; gap: 10px; }
.testimonial-controls button { width: 44px; height: 44px; border: 1px solid #cbd9ca; border-radius: 50%; background: #fffefa; color: var(--forest); font-size: 22px; }
.testimonial-controls button:disabled { opacity: .35; cursor: default; }
.testimonial-track { display: flex; gap: 24px; overflow-x: auto; padding: 30px 5px 38px; scroll-snap-type: x mandatory; scroll-padding-inline: 5px; scrollbar-width: thin; scrollbar-color: #9ab29c transparent; }
.testimonial-track:focus-visible { outline: 3px solid #eea55b; outline-offset: 4px; }
.testimonial-card { flex: 0 0 min(360px, 85%); scroll-snap-align: start; padding: 28px; border: 1px solid #d8e1d2; border-radius: 18px; background: #fffefa; box-shadow: 0 18px 30px rgba(32, 69, 42, .08); display: flex; flex-direction: column; animation: testimonial-float 7s ease-in-out infinite; }
.testimonial-card:nth-child(2n) { background: #e4efdf; animation-delay: -2s; }
.testimonial-card:nth-child(3n) { background: #f3eadb; animation-delay: -4s; }
.quote-mark { color: #54926b; font: 64px/.8 var(--serif); margin-bottom: 16px; }
.testimonial-card blockquote { margin: 0 0 28px; font: 20px/1.6 var(--serif); overflow-wrap: anywhere; white-space: pre-wrap; }
.testimonial-person { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.testimonial-avatar { display: grid; place-items: center; width: 42px; height: 42px; flex-shrink: 0; border-radius: 50%; background: var(--forest); color: #e4efdf; font-weight: 800; }
.testimonial-avatar img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.testimonial-person strong, .testimonial-person small { display: block; overflow-wrap: anywhere; }
.testimonial-person strong { font-size: 13px; }
.testimonial-person small { color: #647a6b; font-size: 11px; margin-top: 3px; }
.testimonial-dialog { width: min(600px, calc(100% - 32px)); max-height: calc(100dvh - 48px); padding: 32px; border: 1px solid #d8e1d2; border-radius: 20px; background: #fffefa; color: var(--ink); box-shadow: 0 32px 100px rgba(14, 52, 41, .25); }
.testimonial-dialog::backdrop { background: rgba(14, 35, 26, .5); backdrop-filter: blur(4px); }
.testimonial-dialog-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 26px; }
.testimonial-dialog-header h3 { font: 800 28px/1.2 var(--display); letter-spacing: -.04em; margin: 12px 0 8px; }
.testimonial-dialog-header p { color: #647a6b; font-size: 14px; margin: 0; }
.testimonial-close { display: grid; place-items: center; flex-shrink: 0; width: 36px; height: 36px; border: 1px solid #d8e1d2; border-radius: 50%; color: var(--ink); background: transparent; font-size: 25px; line-height: 1; }
.testimonial-fields { display: grid; gap: 20px; min-width: 0; }
.testimonial-identity { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.testimonial-fields label { display: grid; gap: 8px; font-size: 12px; font-weight: 700; }
.testimonial-fields label > span:first-child:not(:last-child) { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.testimonial-fields small { font-size: 10px; font-weight: 400; color: #7b8b7e; }
.testimonial-fields input:not([type=checkbox]):not([type=file]), .testimonial-fields textarea { width: 100%; min-width: 0; border: 1px solid #d2ddce; border-radius: 9px; padding: 12px; background: #f9faf5; color: var(--ink); font: 14px/1.5 var(--sans); }
.testimonial-fields textarea { resize: vertical; min-height: 100px; }
.testimonial-fields input:focus-visible, .testimonial-fields textarea:focus-visible { outline: 2px solid #54926b; outline-offset: 2px; }
.testimonial-fields [hidden] { display: none !important; }
.testimonial-extras { border-block: 1px solid #e3e7dd; padding-block: 15px; }
.testimonial-extras summary { display: flex; justify-content: space-between; gap: 12px; list-style: none; cursor: pointer; color: #527360; font-size: 13px; font-weight: 700; }
.testimonial-extras summary::-webkit-details-marker { display: none; }
.testimonial-extras summary:focus-visible { outline: 2px solid #54926b; outline-offset: 5px; }
.testimonial-extras[open] summary > span { transform: rotate(45deg); }
.testimonial-extra-fields { display: grid; gap: 14px; margin-top: 20px; }
.testimonial-photo-row { display: flex; align-items: center; gap: 14px; }
.testimonial-photo-preview { display: grid; place-items: center; flex-shrink: 0; width: 52px; height: 52px; border: 1px solid #d2ddce; border-radius: 50%; background: #eaf0e4; color: #54926b; overflow: hidden; }
.testimonial-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.testimonial-photo-preview svg { width: 26px; height: 26px; display: block; }
.testimonial-fields .testimonial-upload { display: block; width: fit-content; position: relative; overflow: hidden; padding: 7px 12px; border: 1px solid #d2ddce; border-radius: 7px; cursor: pointer; font-size: 12px; }
.testimonial-upload:focus-within { outline: 2px solid #54926b; outline-offset: 2px; }
.testimonial-upload input { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }
#testimonial-photo-status { color: #7b8b7e; font-size: 11px; margin: 6px 0 0; }
.linkedin-import-row { display: flex; gap: 8px; }
.testimonial-fields .profile-import-button { flex-shrink: 0; color: var(--forest); background: #e4efdf; padding: 10px 14px; border: 0; border-radius: 9px; font: 700 12px var(--sans); }
.testimonial-field-help, #linkedin-import-status { color: #7b8b7e; font-size: 11px; margin: -6px 0 0; }
.testimonial-fields .testimonial-consent { display: flex; align-items: flex-start; gap: 9px; line-height: 1.6; color: #647a6b; font-size: 12px; font-weight: 400; }
.testimonial-consent input { accent-color: var(--forest); margin-top: 3px; }
.testimonial-form-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.testimonial-form-footer > span { color: #7b8b7e; font-size: 11px; }
.testimonial-form-footer button { border: 0; font-size: 13px; padding: 13px 16px; }
.testimonial-fields button:disabled { opacity: .6; cursor: wait; }
#testimonial-submit-status { color: #527360; font-size: 13px; margin: 0; }
#testimonial-submit-status:empty, #linkedin-import-status:empty { display: none; }
@keyframes testimonial-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

.site-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 35px; padding-top: 66px; padding-bottom: 28px; }
.site-footer p { color: #7b8b7e; font-size: 13px; margin-top: 17px; }
.footer-links { display: flex; gap: 94px; justify-content: flex-end; }
.footer-links > div { display: flex; flex-direction: column; gap: 10px; min-width: 110px; }
.footer-links strong { color: var(--ink); font-size: 11px; margin-bottom: 8px; }
.footer-links a { color: #748577; font-size: 12px; }
.footer-links a:hover { color: var(--forest); text-decoration: underline; }
.footer-bottom { grid-column: 1 / -1; display: flex; justify-content: space-between; border-top: 1px solid var(--line); padding-top: 21px; margin-top: 19px; color: #9aaa9a; font-size: 11px; }

@media (max-width: 1020px) {
  .site-header { padding-inline: 28px; }
  .section-wrap { padding-inline: 28px; }
  .site-nav { gap: 19px; }
  .hero { grid-template-columns: 51% 49%; }
  .hero-art { margin-right: -40px; }
  .floating-note { left: 4px; }
  .feature-card { padding-inline: 19px; }
}
@media (max-width: 760px) {
  .site-header { height: 72px; position: relative; }
  .brand { font-size: 27px; }
  .menu-toggle { display: flex; width: 42px; height: 42px; flex-direction: column; justify-content: center; align-items: center; gap: 5px; border: 1px solid var(--line); border-radius: 9px; background: #fffdf8; }
  .menu-toggle span { width: 17px; height: 2px; background: var(--forest); border-radius: 3px; }
  .site-nav { display: none; position: absolute; top: 72px; left: 0; right: 0; z-index: 20; padding: 18px 28px 24px; flex-direction: column; align-items: stretch; gap: 4px; background: #fdfbf6; border-bottom: 1px solid var(--line); box-shadow: 0 18px 24px rgba(29, 69, 43, .08); }
  .site-nav.is-open { display: flex; }
  .site-nav a { padding: 10px 3px; }
  .site-nav .nav-cta { text-align: center; margin-top: 8px; }
  .hero { grid-template-columns: 1fr; min-height: 0; }
  .hero-copy { padding: 78px 0 20px; }
  h1 { max-width: 600px; font-size: clamp(49px, 11vw, 72px); }
  .hero-art { height: 550px; margin: 0 -42px; }
  .mock-window { width: min(480px, 83%); }
  .floating-note { left: 12%; bottom: 48px; }
  .agent-strip-inner { flex-wrap: wrap; justify-content: center; padding-block: 20px; gap: 18px 28px; }
  .agent-strip-inner > span { width: 100%; text-align: center; }
  .agent-strip-inner > div { font-size: 14px; }
  .paths-section { padding-top: 78px; padding-bottom: 78px; }
  .paths-grid { grid-template-columns: 1fr; }
  .path-card { min-height: 285px; }
  .product-section, .architecture-section { padding-top: 78px; padding-bottom: 85px; }
  .section-intro { display: block; }
  .section-intro > p { margin-top: 24px; max-width: 530px; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 360px; }
  .feature-visual { max-width: 390px; width: 100%; align-self: center; }
  .optimization-panel { margin-top: 55px; padding: 28px; }
  .optimization-heading { display: block; }
  .optimization-heading p { max-width: 470px; margin-top: 13px; }
  .optimization-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workflow-inner { grid-template-columns: 1fr; gap: 42px; padding-block: 78px; }
  .architecture-flow { grid-template-columns: 1fr; gap: 12px; margin-top: 42px; }
  .flow-arrow { transform: rotate(90deg); line-height: 1; }
  .flow-node { min-height: 0; }
  .testimonials-section { padding-block: 55px; }
  .community-heading { align-items: flex-start; flex-direction: column; gap: 26px; }
  .site-footer { grid-template-columns: 1fr; padding-top: 55px; }
  .footer-links { justify-content: flex-start; gap: 60px; }
}
@media (max-width: 480px) {
  .section-wrap { padding-inline: 22px; }
  .site-header { padding-inline: 22px; }
  .hero-copy { padding-top: 60px; }
  .hero-lead { font-size: 16px; }
  .hero-actions { gap: 15px; flex-wrap: wrap; }
  .button-primary { padding: 14px 16px; }
  .hero-footnote { margin-top: 31px; }
  .testimonial-dialog { padding: 24px; max-height: calc(100dvh - 32px); }
  .testimonial-identity { grid-template-columns: 1fr; }
  .testimonial-form-footer { align-items: stretch; flex-direction: column-reverse; gap: 10px; }
  .testimonial-form-footer > span { text-align: center; }
  .hero-art { height: 480px; margin: 0 -22px; }
  .mock-window { width: 89%; }
  .mock-body { padding: 20px; }
  .floating-note { bottom: 20px; left: 3%; }
  .agent-strip-inner > div { font-size: 12px; }
  .path-card { padding: 25px; }
  .optimization-panel { padding: 22px; }
  .optimization-grid { grid-template-columns: 1fr; }
  .section-intro h2, .workflow-heading h2 { font-size: 39px; }
  .footer-bottom { flex-direction: column; gap: 7px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *:before, *:after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .testimonial-card { animation: none; }
}

/* Terminal mock in the hero */
.term-mock{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.78rem;line-height:1.5}
.term-agent{padding:.25rem 0 .6rem}
.term-dim{opacity:.6}
.term-bad{color:#b3412e}
.term-warn{color:#a8700c;font-weight:600}
.term-hud{display:flex;flex-wrap:wrap;gap:.35rem .75rem;border-top:1px solid currentColor;border-top-color:rgba(0,0,0,.18);padding:.45rem 0 .3rem}
.term-advice{padding:.35rem 0 .6rem}
.term-badge{display:inline-block;font-size:.66rem;letter-spacing:.06em;padding:.05rem .4rem;border-radius:.25rem;background:#f3d9a4;color:#5a3d00;margin-right:.35rem}

/* Compact example of the terminal’s three instrument groups. */
.term-instruments { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 10px 0; border-block: 1px solid #d8e2d3; font-size: 9px; }
.term-instruments > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.term-instruments strong { color: #376d4c; }
.term-instruments span { color: #536b59; overflow-wrap: anywhere; }
.term-example { font-size: 8px; color: #637765; padding: 5px 0; }
.harness-command { display: block; margin: 19px 0; color: #2e6643; font-size: 16px; font-weight: 700; overflow-wrap: anywhere; }
@media (max-width: 480px) {
  .term-instruments { gap: 6px; font-size: 8px; }
  .term-mock { font-size: 10px; }
}
