:root {
  --blue: #4778df;
  --blue-dark: #3264ce;
  --blue-soft: #e9f0ff;
  --ink: #181b21;
  --ink-2: #2a2f38;
  --muted: #667085;
  --muted-2: #8c95a5;
  --line: #dde5f0;
  --line-soft: #edf1f6;
  --paper: #fff;
  --wash: #f6f8fc;
  --green: #11a36a;
  --purple: #7c5ce4;
  --orange: #dc8a26;
  --shadow: 0 24px 80px rgba(29, 45, 74, .11);
  --max: 1200px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, system-ui, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
code, pre { font-family: "Fira Code", monospace; }
::selection { background: #dbe7ff; }
.container { width: min(var(--max), calc(100% - 48px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 1000; top: 10px; left: 10px; transform: translateY(-180%); padding: 10px 14px; border-radius: 8px; background: var(--ink); color: #fff; }
.skip-link:focus { transform: none; }

.site-header { position: fixed; z-index: 100; inset: 0 0 auto; height: 76px; border-bottom: 1px solid rgba(221, 229, 240, .75); background: rgba(247, 249, 253, .82); backdrop-filter: blur(18px); }
.nav-wrap { max-width: var(--max); height: 100%; margin: auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 9px; flex: none; font-size: 1.28rem; font-weight: 900; letter-spacing: -.055em; }
.brand img { object-fit: contain; }
.brand > span > span { color: var(--blue); }
.brand em { margin-left: 4px; padding: 5px 7px; border-radius: 6px; background: var(--blue-soft); color: var(--blue); font: 600 .59rem/1 "Fira Code", monospace; letter-spacing: .04em; text-transform: uppercase; }
.desktop-nav { display: flex; align-items: center; gap: 25px; color: #687285; font-size: .86rem; font-weight: 650; }
.desktop-nav a, footer a { transition: color .2s ease; }
.desktop-nav a:hover, footer a:hover { color: var(--blue); }
.nav-actions { display: flex; align-items: center; gap: 11px; }
.language { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255, 255, 255, .65); }
.language button { border: 0; border-radius: 7px; padding: 6px 8px; background: transparent; color: var(--muted-2); cursor: pointer; font-size: .7rem; font-weight: 800; }
html[data-lang="es"] [data-set-lang="es"], html[data-lang="en"] [data-set-lang="en"] { color: var(--blue); background: var(--blue-soft); }
.button { display: inline-flex; min-height: 46px; padding: 0 19px; align-items: center; justify-content: center; gap: 9px; border: 1px solid transparent; border-radius: 13px; font-size: .9rem; font-weight: 800; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button svg { width: 17px; height: 17px; fill: currentColor; }
.button-dark { min-height: 40px; padding: 0 15px; color: white; background: var(--ink); }
.button-primary { color: #fff; background: linear-gradient(180deg, #527fdf, #3f70d8); box-shadow: 0 15px 32px rgba(71, 120, 223, .25); }
.button-primary:hover { box-shadow: 0 19px 42px rgba(71, 120, 223, .34); }
.button-light { border-color: var(--line); color: #4f5969; background: rgba(255, 255, 255, .83); box-shadow: 0 10px 28px rgba(26, 43, 74, .05); }
.button-light:hover { border-color: #c7d2e3; }
.menu-button, .mobile-menu { display: none; }

.hero { position: relative; overflow: hidden; padding: 160px 0 104px; background: linear-gradient(180deg, #f4f7fe 0%, #fbfcff 75%, #fff 100%); }
.hero::after { content: ""; position: absolute; inset: 0; opacity: .28; pointer-events: none; background-image: radial-gradient(#7a93be 1px, transparent 1px); background-size: 25px 25px; mask-image: linear-gradient(to bottom, black, transparent 62%); }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(10px); pointer-events: none; }
.glow-one { width: 650px; height: 500px; left: -260px; top: 40px; background: radial-gradient(circle, rgba(76, 125, 229, .22), transparent 68%); }
.glow-two { width: 560px; height: 500px; right: -210px; top: 70px; background: radial-gradient(circle, rgba(124, 92, 228, .14), transparent 68%); }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .93fr 1.07fr; align-items: center; gap: 70px; }
.eyebrow, .section-label { color: var(--blue); font: 600 .72rem/1.4 "Fira Code", monospace; letter-spacing: .095em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 10px; }
.eyebrow > span { width: 6px; height: 6px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 5px rgba(71, 120, 223, .1); }
.hero h1 { max-width: 650px; margin: 21px 0 25px; font-size: clamp(3.4rem, 5.35vw, 5.85rem); line-height: .96; letter-spacing: -.076em; }
.hero-copy > p { max-width: 625px; margin: 0; color: var(--muted); font-size: 1.12rem; line-height: 1.68; }
.hero-actions { display: flex; gap: 12px; margin-top: 31px; }
.hero-copy .hero-note { display: flex; align-items: center; gap: 9px; margin-top: 22px; color: #7b8595; font: 500 .72rem "Fira Code", monospace; }
.pulse { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(17, 163, 106, .1); }

.system-demo { border: 1px solid rgba(205, 216, 233, .9); border-radius: 24px; background: rgba(255, 255, 255, .82); box-shadow: var(--shadow); overflow: hidden; transform: perspective(1400px) rotateY(-2.5deg) rotateX(1deg); }
.demo-topbar { min-height: 51px; padding: 0 16px; border-bottom: 1px solid var(--line-soft); display: flex; align-items: center; gap: 14px; color: #818a99; background: rgba(250, 251, 254, .9); font: 500 .65rem "Fira Code", monospace; }
.demo-topbar > span { flex: 1; }
.demo-topbar b { color: var(--green); font-weight: 600; }
.window-dots { display: flex; gap: 5px; }
.window-dots span { width: 7px; height: 7px; border-radius: 50%; background: #d7dee9; }
.window-dots span:first-child { background: #efb4af; }.window-dots span:nth-child(2) { background: #f3d58f; }.window-dots span:last-child { background: #9edbbd; }
.demo-body { padding: 25px; }
.message { display: flex; gap: 11px; align-items: flex-start; }
.message .avatar { width: 36px; height: 36px; flex: none; border-radius: 11px; display: grid; place-items: center; color: #596477; background: #edf1f7; font-size: .66rem; font-weight: 800; }
.message .bee-avatar { background: var(--blue-soft); }.message .bee-avatar img { width: 23px; height: 20px; }
.message > div:last-child { max-width: 83%; }
.message small { display: block; margin: 0 0 6px 5px; color: #8b94a4; font: 500 .63rem "Fira Code", monospace; }
.message p { margin: 0; padding: 12px 14px; border-radius: 6px 16px 16px 16px; background: #f1f4f8; color: #414a58; font-size: .77rem; line-height: 1.5; }
.message.agent { margin-left: 38px; }.message.agent p { border-radius: 16px 6px 16px 16px; background: #e9f0ff; color: #354f81; }
.route-line { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 9px; margin: 14px 25px 14px 47px; }
.route-line span { height: 1px; background: repeating-linear-gradient(90deg, #ccd7e8 0 4px, transparent 4px 8px); }
.route-line code { color: var(--blue); font-size: .56rem; }
.actions-label { margin: 24px 0 10px; color: #8a94a5; font: 600 .58rem "Fira Code", monospace; letter-spacing: .08em; text-transform: uppercase; }
.action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.action-grid > div { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 9px; border: 1px solid var(--line-soft); border-radius: 12px; background: #fff; }
.icon { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; flex: none; color: #fff; font-style: normal; font-size: .62rem; font-weight: 800; }
.mail { background: #dc6c60; }.calendar { background: #4c79dc; }.crm { background: #ef8d3b; }.human { background: #7959db; }
.action-grid span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }.action-grid b { font-size: .67rem; }.action-grid small { overflow: hidden; color: #8b94a3; font-size: .57rem; text-overflow: ellipsis; white-space: nowrap; }
.action-grid em { margin-left: auto; color: var(--green); font: 500 .52rem "Fira Code", monospace; }

.idea-strip { border-block: 1px solid var(--line-soft); background: #fff; }
.idea-grid { min-height: 175px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 48px; }
.idea-grid > div:not(.idea-arrow) { padding: 28px 0; }
.idea-grid small { display: block; margin-bottom: 10px; color: var(--muted-2); font: 600 .66rem "Fira Code", monospace; text-transform: uppercase; }
.idea-grid strong { display: block; margin-bottom: 8px; font-size: 1.28rem; letter-spacing: -.03em; }.idea-grid p { margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.55; }
.idea-grid > div:first-child strong { color: #6d7581; }.idea-grid > div:last-child strong, .idea-grid > div:last-child small { color: var(--blue); }
.idea-arrow { width: 45px; height: 45px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; color: var(--blue); background: var(--wash); }

.section { padding: 120px 0; }
.section-head { max-width: 750px; margin-bottom: 49px; }.section-head.centered { margin-inline: auto; text-align: center; }
.section-head h2, .architecture-copy h2, .build-intro h2, .status-copy h2, .cta h2 { margin: 14px 0 19px; font-size: clamp(2.5rem, 4.2vw, 4.35rem); line-height: 1.02; letter-spacing: -.065em; }
.section-head p, .architecture-copy > p, .build-intro > p, .status-copy > p, .cta > p { margin: 0; color: var(--muted); font-size: 1.04rem; line-height: 1.68; }
.use-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.use-card { position: relative; min-height: 310px; padding: 35px; overflow: hidden; border: 1px solid var(--line); border-radius: 24px; background: linear-gradient(145deg, #fff, #fafcff); }
.use-card.featured { grid-row: span 2; min-height: 636px; padding-top: 56px; background: linear-gradient(155deg, #f7faff, #e8f0ff); }
.use-card:last-child { grid-column: 1 / -1; min-height: 245px; }
.use-card.featured::after { content: ""; position: absolute; right: -100px; bottom: -110px; width: 380px; height: 380px; border: 1px solid rgba(71, 120, 223, .14); border-radius: 50%; box-shadow: 0 0 0 50px rgba(71, 120, 223, .04), 0 0 0 100px rgba(71, 120, 223, .025); }
.card-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: var(--blue); background: var(--blue-soft); font-size: 1.3rem; }
.card-tag { position: absolute; top: 35px; right: 35px; color: #8c95a4; font: 600 .62rem "Fira Code", monospace; text-transform: uppercase; }.featured .card-tag { top: 56px; }
.use-card h3 { max-width: 510px; margin: 28px 0 14px; font-size: clamp(1.5rem, 2.2vw, 2.25rem); line-height: 1.08; letter-spacing: -.045em; }
.use-card p { max-width: 530px; margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.65; }
.featured h3 { margin-top: 105px; font-size: clamp(2.3rem, 3.9vw, 4.1rem); }.featured p { font-size: 1.01rem; }
.mini-flow { position: relative; z-index: 1; margin-top: 62px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mini-flow span { padding: 9px 11px; border: 1px solid rgba(71, 120, 223, .2); border-radius: 9px; color: #506789; background: rgba(255, 255, 255, .7); font: 500 .63rem "Fira Code", monospace; }.mini-flow i { color: var(--blue); font-style: normal; }

.how-section { background: var(--wash); }
.journey { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.journey-line { position: absolute; left: 10%; right: 10%; top: 67px; height: 1px; background: linear-gradient(90deg, transparent, #bccce7 8%, #bccce7 92%, transparent); }
.journey article { position: relative; z-index: 1; padding: 22px 17px; text-align: center; }
.journey article > b { display: block; margin-bottom: 19px; color: #a0a9b7; font: 500 .58rem "Fira Code", monospace; }
.node-badge { width: 52px; height: 52px; margin: 0 auto 21px; display: grid; place-items: center; border: 6px solid var(--wash); border-radius: 16px; color: #fff; box-shadow: 0 0 0 1px var(--line); font: 700 .75rem "Fira Code", monospace; }
.node-badge.io, .legend .io, .hive-nodes .io { background: var(--orange); }.node-badge.rt, .hive-nodes .rt { background: #4a5565; }.node-badge.ai, .legend .ai, .hive-nodes .ai { background: var(--blue); }.node-badge.wf, .legend .wf, .hive-nodes .wf { background: var(--purple); }.node-badge.sy, .legend .sy, .hive-nodes .sy { background: var(--green); }
.journey h3 { margin: 0 0 8px; font-size: .94rem; letter-spacing: -.025em; }.journey p { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.55; }
.principles { margin-top: 70px; display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); border-radius: 24px; overflow: hidden; background: #fff; }
.principles article { position: relative; min-height: 235px; padding: 34px 37px; }.principles article:nth-child(odd) { border-right: 1px solid var(--line-soft); }.principles article:nth-child(-n+2) { border-bottom: 1px solid var(--line-soft); }
.principles article > span { position: absolute; top: 35px; right: 35px; color: #b1bac7; font: 500 .63rem "Fira Code", monospace; }
.principles h3 { margin: 0 0 12px; font-size: 1.35rem; letter-spacing: -.035em; }.principles p { max-width: 455px; margin: 0 0 22px; color: var(--muted); font-size: .84rem; line-height: 1.6; }.principles code { padding: 7px 9px; border-radius: 7px; color: var(--blue); background: var(--blue-soft); font-size: .64rem; }

.architecture-section { padding: 120px 0; color: #fff; background: #1a1e25; }
.architecture-grid { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 80px; }
.architecture-copy .section-label { color: #88a8f0; }.architecture-copy > p { color: #9ca5b5; }
.text-link { display: inline-flex; gap: 7px; align-items: center; margin-top: 26px; color: var(--blue); font-size: .86rem; font-weight: 750; }
.legend { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 45px; }.legend > div { display: flex; align-items: center; gap: 10px; }.legend i { width: 10px; height: 10px; border-radius: 3px; }.legend span { display: flex; flex-direction: column; gap: 2px; }.legend b { font: 600 .67rem "Fira Code", monospace; }.legend small { color: #838d9d; font-size: .67rem; }
.hive-map { padding: 30px; border: 1px solid #313846; border-radius: 24px; background: #20252e; box-shadow: 0 35px 90px rgba(0, 0, 0, .25); }
.hive { border: 1px solid #343c49; border-radius: 15px; overflow: hidden; background: #252b35; }.hive header { min-height: 43px; padding: 0 14px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #343c49; font: 500 .62rem "Fira Code", monospace; }.hive header small { margin-left: auto; color: #687386; }.hive-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(17, 163, 106, .1); }
.hive-nodes { min-height: 85px; padding: 18px; display: flex; justify-content: center; align-items: center; gap: 10px; }.hive-nodes span { padding: 10px 12px; border-radius: 9px; color: #fff; font: 500 .58rem "Fira Code", monospace; }
.wan { min-height: 80px; display: flex; align-items: center; gap: 9px; }.wan span { height: 1px; flex: 1; background: repeating-linear-gradient(90deg, #42516b 0 5px, transparent 5px 9px); }.wan code { color: #7383a0; font-size: .53rem; }
.worker-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.worker .hive-nodes { align-items: stretch; flex-direction: column; }.worker .hive-nodes span { text-align: center; }
.map-note { display: flex; align-items: center; gap: 10px; margin-top: 23px; color: #858f9f; font-size: .68rem; }

.start-section { background: linear-gradient(180deg, #fff, #f8faff); }
.terminal-wrap { display: grid; grid-template-columns: 1.45fr .55fr; gap: 20px; align-items: stretch; }
.terminal { overflow: hidden; border-radius: 20px; color: #dce5f4; background: #1d222a; box-shadow: 0 25px 70px rgba(27, 38, 57, .17); }
.terminal-bar { min-height: 52px; padding: 0 17px; display: flex; align-items: center; gap: 15px; border-bottom: 1px solid #303744; color: #788496; font: 500 .62rem "Fira Code", monospace; }.terminal-bar > span { flex: 1; }.copy-button { padding: 6px 9px; border: 1px solid #3a4351; border-radius: 7px; color: #a8b3c5; background: transparent; cursor: pointer; font-size: .6rem; }
.terminal pre { margin: 0; padding: 30px; overflow-x: auto; color: #e4eaf4; font-size: .77rem; line-height: 1.9; }.terminal .comment { color: #6f7b8d; }
.requirements { padding: 28px; border: 1px solid var(--line); border-radius: 20px; background: #fff; }.requirements h3 { margin: 0 0 23px; font-size: 1.12rem; }.requirements ul { margin: 0; padding: 0; list-style: none; }.requirements li { display: flex; gap: 11px; align-items: flex-start; margin-bottom: 17px; }.requirements li > span { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; flex: none; color: var(--green); background: #e7f7f1; font-size: .66rem; font-weight: 800; }.requirements li p { margin: 1px 0 0; display: flex; flex-direction: column; gap: 4px; }.requirements li b { font-size: .79rem; }.requirements li small { color: var(--muted); font-size: .67rem; line-height: 1.4; }
.notice { margin-top: 26px; padding: 14px; border-radius: 11px; color: #576579; background: var(--wash); }.notice b { display: block; margin-bottom: 5px; color: var(--ink-2); font-size: .72rem; }.notice p { margin: 0; font-size: .67rem; line-height: 1.5; }.requirements .text-link { margin-top: 20px; font-size: .74rem; }

.build-section { color: #fff; background: linear-gradient(145deg, #242a34, #181c22); }
.build-intro { display: grid; grid-template-columns: 1.05fr .95fr; align-items: end; gap: 90px; }.build-intro .section-label { color: #8ca9eb; }.build-intro h2 { max-width: 620px; margin-bottom: 0; }.build-intro > p { padding-bottom: 6px; color: #a1aab8; }
.package-types { margin-top: 54px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }.package-types article { min-height: 240px; padding: 27px; border: 1px solid #353d49; border-radius: 18px; background: #242a33; }.package-types article.selected { border-color: rgba(93, 137, 231, .5); background: linear-gradient(145deg, #293545, #252c36); }.package-types article > div { min-height: 30px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }.package-types code { color: #90adee; font-size: .67rem; }.package-types article > div span { padding: 5px 7px; border-radius: 6px; color: #a9baDF; background: rgba(71, 120, 223, .15); font: 500 .5rem "Fira Code", monospace; }.package-types h3 { margin: 32px 0 11px; font-size: 1.25rem; letter-spacing: -.03em; }.package-types p { margin: 0; color: #949eae; font-size: .78rem; line-height: 1.6; }
.build-steps { margin-top: 18px; border: 1px solid #353d49; border-radius: 18px; overflow: hidden; }.build-steps article { min-height: 110px; display: grid; grid-template-columns: 75px 1fr; border-bottom: 1px solid #353d49; }.build-steps article:last-child { border-bottom: 0; }.build-steps article > b { display: grid; place-items: center; border-right: 1px solid #353d49; color: #707b8c; font: 500 .67rem "Fira Code", monospace; }.build-steps article > div { padding: 22px 27px; display: grid; grid-template-columns: 210px 1fr; align-items: center; gap: 30px; }.build-steps h3 { margin: 0; font-size: 1rem; }.build-steps p { margin: 0; color: #98a2b1; font-size: .77rem; line-height: 1.55; }.build-steps code { color: #a9bee9; font-size: .66rem; line-height: 1.7; }
.build-link { margin-top: 25px; border-color: #3c4552; color: #bec8d7; background: #292f38; }

.status-section { padding: 110px 0; background: #fff; }.status-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 95px; align-items: center; }.status-copy h2 { font-size: clamp(2.5rem, 4vw, 4.1rem); }.status-pill { width: fit-content; margin-top: 27px; padding: 10px 13px; border: 1px solid #d9e9e2; border-radius: 999px; display: flex; align-items: center; gap: 9px; color: #4e7165; background: #f6fbf9; font: 600 .64rem "Fira Code", monospace; }
.status-lists { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; }.status-lists > div { padding: 29px; }.status-lists > div:first-child { border-right: 1px solid var(--line); }.status-lists h3 { margin: 0 0 20px; display: flex; align-items: center; gap: 9px; font-size: .9rem; }.status-lists h3 > span:first-child { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 7px; color: var(--green); background: #eaf8f3; }.status-lists > div:last-child h3 > span:first-child { color: var(--blue); background: var(--blue-soft); }.status-lists ul { margin: 0; padding: 0; list-style: none; }.status-lists li { position: relative; margin: 0 0 14px; padding-left: 14px; color: var(--muted); font-size: .73rem; line-height: 1.5; }.status-lists li::before { content: ""; position: absolute; left: 0; top: .57em; width: 4px; height: 4px; border-radius: 50%; background: #a9b3c1; }

.cta-section { padding: 35px 0 105px; }.cta { padding: 70px 40px; border: 1px solid var(--line); border-radius: 30px; text-align: center; background: radial-gradient(circle at 50% 5%, rgba(71, 120, 223, .13), transparent 48%), var(--wash); }.cta > img { display: block; margin: 0 auto 23px; }.cta h2 { max-width: 800px; margin-inline: auto; }.cta > p { max-width: 650px; margin-inline: auto; }.cta > div { margin-top: 29px; display: flex; justify-content: center; gap: 12px; }

footer { border-top: 1px solid var(--line-soft); background: #fafbfc; }.footer-inner { min-height: 118px; display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 30px; }.footer-inner p { margin: 0; color: var(--muted); font-size: .72rem; }.footer-inner nav { display: flex; gap: 20px; color: #6e7888; font-size: .7rem; font-weight: 600; }.footer-inner > small { color: #9ca4b1; font-size: .62rem; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }.reveal.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.reveal { opacity: 1; transform: none; transition: none; }.button { transition: none; } }

@media (max-width: 1000px) {
  .desktop-nav { display: none; }.menu-button { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; background: rgba(255, 255, 255, .7); }.menu-button span { width: 17px; height: 1.5px; background: var(--ink); }.mobile-menu { position: absolute; top: 75px; left: 0; right: 0; padding: 18px 24px 24px; border-bottom: 1px solid var(--line); background: rgba(250, 251, 254, .98); box-shadow: 0 20px 35px rgba(26, 43, 74, .09); }.mobile-menu.open { display: grid; }.mobile-menu a { padding: 11px 0; color: #5f6979; font-size: .87rem; font-weight: 700; }
  .hero-grid { grid-template-columns: 1fr; gap: 60px; }.hero-copy { max-width: 790px; }.system-demo { max-width: 760px; transform: none; }
  .journey { grid-template-columns: repeat(3, 1fr); }.journey-line { display: none; }
  .architecture-grid { grid-template-columns: 1fr; }.architecture-copy { max-width: 730px; }
  .terminal-wrap { grid-template-columns: 1fr; }.requirements { display: grid; grid-template-columns: 1fr 1fr; gap: 0 35px; }.requirements h3 { grid-column: 1 / -1; }.requirements .text-link { align-self: start; }
  .build-intro { grid-template-columns: 1fr; gap: 22px; }.package-types { grid-template-columns: 1fr 1fr; }.package-types article:first-child { grid-column: 1 / -1; }
  .status-grid { grid-template-columns: 1fr; gap: 50px; }.status-copy { max-width: 720px; }
  .footer-inner { grid-template-columns: auto 1fr auto; }.footer-inner p { display: none; }.footer-inner > small { grid-column: 3; }
}

@media (max-width: 700px) {
  .container { width: calc(100% - 32px); }.site-header { height: 68px; }.nav-wrap { padding: 0 16px; gap: 10px; }.brand { font-size: 1.15rem; }.brand em, .desktop-github { display: none; }.nav-actions { gap: 6px; }.menu-button { width: 36px; height: 36px; }.mobile-menu { top: 67px; }.language button { padding: 5px 6px; }
  .hero { padding: 125px 0 75px; }.hero h1 { font-size: clamp(2.85rem, 13.5vw, 3.65rem); }.hero-copy > p { font-size: 1rem; }.hero-actions { align-items: stretch; flex-direction: column; }.hero-actions .button { width: 100%; }
  .demo-body { padding: 18px 14px; }.message.agent { margin-left: 14px; }.message > div:last-child { max-width: calc(100% - 47px); }.route-line { margin-left: 25px; }.route-line code { font-size: .47rem; }.action-grid { grid-template-columns: 1fr; }
  .idea-grid { grid-template-columns: 1fr; gap: 0; padding-block: 25px; }.idea-grid > div:not(.idea-arrow) { padding: 20px 0; }.idea-arrow { transform: rotate(90deg); }
  .section, .architecture-section { padding: 85px 0; }.section-head h2, .architecture-copy h2, .build-intro h2, .status-copy h2, .cta h2 { font-size: clamp(2.35rem, 11vw, 3.25rem); }
  .use-grid { grid-template-columns: 1fr; }.use-card.featured { grid-row: auto; min-height: 500px; }.use-card:last-child { grid-column: auto; min-height: 310px; }.featured h3 { margin-top: 70px; }.mini-flow { margin-top: 40px; }
  .journey { grid-template-columns: 1fr; }.journey article { display: grid; grid-template-columns: 55px 1fr; column-gap: 15px; text-align: left; }.journey article > b { display: none; }.node-badge { grid-row: 1 / 3; margin: 0; }.journey h3 { align-self: end; }.journey p { align-self: start; }
  .principles { grid-template-columns: 1fr; }.principles article:nth-child(odd) { border-right: 0; }.principles article { border-bottom: 1px solid var(--line-soft); }.principles article:last-child { border-bottom: 0; }
  .architecture-grid { gap: 50px; }.hive-map { padding: 16px; }.hive-nodes { align-items: stretch; flex-direction: column; }.hive-nodes span { text-align: center; }.worker-row { grid-template-columns: 1fr; }.wan code { text-align: center; }.legend { margin-top: 35px; }
  .terminal pre { padding: 24px 19px; font-size: .64rem; }.requirements { display: block; }
  .package-types { grid-template-columns: 1fr; }.package-types article:first-child { grid-column: auto; }.build-steps article { grid-template-columns: 47px 1fr; }.build-steps article > div { grid-template-columns: 1fr; gap: 12px; padding: 20px; }
  .status-lists { grid-template-columns: 1fr; }.status-lists > div:first-child { border-right: 0; border-bottom: 1px solid var(--line); }
  .cta { padding: 55px 20px; }.cta > div { flex-direction: column; }.footer-inner { padding: 30px 0; grid-template-columns: 1fr; justify-items: start; }.footer-inner nav { flex-wrap: wrap; }.footer-inner > small { grid-column: auto; }
}