* { box-sizing: border-box; }

:root {
  color-scheme: light dark;
  --bg: #f6f7f9;
  --fg: #16181d;
  --muted: #626a76;
  --muted-2: #858d98;
  --surface: rgba(255,255,255,.86);
  --surface-solid: #ffffff;
  --surface-muted: #eef1f5;
  --border: #dde1e7;
  --border-strong: #cdd3dc;
  --accent: #2455d6;
  --accent-hover: #1e48b8;
  --accent-soft: #edf2ff;
  --accent-fg: #ffffff;
  --success: #159266;
  --shadow: 0 24px 64px rgba(28, 39, 61, .12);
  --shadow-soft: 0 10px 30px rgba(28, 39, 61, .07);
  --radius: 18px;
  --content: min(1180px, calc(100% - 48px));
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--bg);
  color: var(--fg);
}

html { scroll-behavior: smooth; background: var(--bg); overflow-x: clip; }
section[id] { scroll-margin-top: 88px; }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--fg); overflow-x: clip; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
svg { display: block; }

.skip-link { position: fixed; top: 8px; left: 8px; transform: translateY(-140%); z-index: 1000; padding: 8px 12px; background: var(--fg); color: var(--bg); border-radius: 8px; }
.skip-link:focus { transform: translateY(0); }

.brand { display: inline-flex; align-items: center; gap: 9px; font-weight: 720; letter-spacing: -.025em; white-space: nowrap; }
.brand img { width: 30px; height: 30px; }

.hero { position: relative; width: var(--content); min-height: 840px; margin: 0 auto; padding: 128px 0 88px; display: grid; grid-template-columns: .92fr 1.08fr; gap: 54px; align-items: center; }
.hero-orb { position: absolute; border-radius: 999px; filter: blur(1px); pointer-events: none; }
.hero-orb-one { width: 560px; height: 560px; right: -260px; top: 70px; background: radial-gradient(circle, rgba(36,85,214,.15), rgba(36,85,214,0) 70%); }
.hero-orb-two { width: 430px; height: 430px; left: -260px; bottom: 20px; background: radial-gradient(circle, rgba(107,140,255,.11), rgba(107,140,255,0) 70%); }
.hero-copy { position: relative; z-index: 2; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 23px; color: var(--accent); font-size: 13px; font-weight: 680; letter-spacing: .01em; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 5px rgba(36,85,214,.11); }
.hero h1, .section-heading h2, .closing h2 { margin: 0; font-weight: 730; letter-spacing: -.055em; line-height: .98; }
.hero h1 { max-width: 660px; font-size: clamp(52px, 5.6vw, 76px); }
.hero h1 span, .section-heading h2 span { color: var(--accent); }
.hero-lead { max-width: 590px; margin: 28px 0 0; color: var(--muted); font-size: 18px; line-height: 1.68; letter-spacing: -.012em; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 34px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 0 18px; border-radius: 10px; font-size: 14px; font-weight: 650; transition: transform .16s ease, background .16s ease, border-color .16s ease; }
.button:hover { transform: translateY(-1px); }
.button svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.button-primary { background: var(--accent); color: var(--accent-fg); box-shadow: 0 8px 22px rgba(36,85,214,.23); }
.button-primary:hover { background: var(--accent-hover); }
.button-secondary { border: 1px solid var(--border-strong); background: rgba(255,255,255,.66); color: var(--fg); }
.hero-social-proof { display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; color: var(--fg); text-decoration: none; width: fit-content; transition: opacity .16s ease, transform .16s ease; }
.hero-social-proof:hover { opacity: .78; transform: translateY(-1px); }
.hero-social-star { color: var(--accent); font-size: 18px; line-height: 1; }
.hero-social-copy { display: grid; gap: 3px; }
.hero-social-copy strong { font-size: 25px; line-height: .95; letter-spacing: -.045em; }
.hero-social-copy small { color: var(--muted); font-size: 11px; font-weight: 620; letter-spacing: .01em; }

.hero-showcase { position: relative; z-index: 1; min-width: 0; padding: 14px 8px 10px; }
.showcase-clients { position: relative; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; padding: 0 14px 30px; }
.showcase-clients::after { position: absolute; left: 50%; bottom: 0; width: 1px; height: 22px; background: linear-gradient(rgba(116,143,205,0),rgba(116,143,205,.45)); content: ""; transform: translateX(-50%); }
.showcase-client { min-width: 0; display: grid; justify-items: center; gap: 7px; padding: 4px; color: #303642; text-align: center; }
.showcase-client img,.showcase-robot { width: 32px; height: 32px; }.showcase-client img { object-fit: contain; }.showcase-client span:last-child { overflow: hidden; max-width: 100%; font-size: 8.5px; font-weight: 680; text-overflow: ellipsis; white-space: nowrap; }
.showcase-robot { display: grid; place-items: center; color: var(--accent); }.showcase-robot svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.showcase-core { position: relative; width: min(430px,82%); margin: 0 auto; padding: 19px 20px 17px; border: 1px solid rgba(178,195,232,.96); border-radius: 20px; background: linear-gradient(145deg,rgba(255,255,255,.98),rgba(243,247,255,.98)); box-shadow: 0 18px 40px rgba(36,85,214,.11), 0 2px 6px rgba(30,46,75,.04); }
.showcase-core-head { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; gap: 11px; align-items: center; padding-bottom: 14px; border-bottom: 1px solid rgba(186,199,227,.74); }.showcase-core-head > img { width: 42px; height: 42px; }.showcase-core-head strong,.showcase-core-head small { display: block; }.showcase-core-head strong { color: #162033; font-size: 18px; letter-spacing: -.03em; }.showcase-core-head small { margin-top: 3px; color: #69768e; font-size: 8px; }
.showcase-live { display: inline-flex; align-items: center; gap: 5px; color: #4f7668; font-size: 7px; font-weight: 700; white-space: nowrap; }.showcase-live i { width: 6px; height: 6px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(50,168,125,.09); }
.showcase-core-capabilities { display: grid; gap: 11px; padding-top: 14px; }.showcase-core-capability { display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: center; }.showcase-core-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; }.showcase-core-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }.showcase-core-memory { background: #eeeaff; color: #7257d9; }.showcase-core-workflow { background: #fff1dc; color: #d78a2f; }.showcase-core-workflow svg { fill: currentColor; stroke: none; }.showcase-core-capability b,.showcase-core-capability small { display: block; }.showcase-core-capability b { color: #2b3240; font-size: 9px; }.showcase-core-capability small { margin-top: 3px; color: #7b8594; font-size: 7.5px; line-height: 1.4; }
.showcase-device-shelf { position: relative; display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 30px; padding: 18px 18px 0; border-top: 1px solid rgba(210,219,232,.88); }.showcase-device-shelf::before { position: absolute; left: 50%; top: -30px; width: 1px; height: 30px; background: linear-gradient(rgba(116,143,205,.45),rgba(116,143,205,.08)); content: ""; transform: translateX(-50%); }
.showcase-device { min-width: 0; display: grid; grid-template-columns: 46px 1fr; gap: 8px; align-items: center; padding: 3px 4px; }.showcase-device-art { width: 46px; height: 42px; display: grid; place-items: center; color: #687383; }.showcase-device-art svg { width: 44px; height: 36px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }.showcase-phone svg { width: 30px; height: 40px; }.showcase-server svg { width: 42px; height: 37px; }
.showcase-device b,.showcase-device small { display: block; }.showcase-device b { overflow: hidden; color: #2d3440; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.showcase-device small { margin-top: 4px; color: #7b8694; font-size: 7px; }.showcase-device small i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: var(--success); vertical-align: 1px; }

.app-window { position: relative; z-index: 1; min-width: 0; border: 1px solid rgba(205,211,220,.95); border-radius: 17px; overflow: hidden; background: var(--surface-solid); box-shadow: 0 36px 90px rgba(30,46,75,.16), 0 2px 7px rgba(30,46,75,.08); max-width: 100%; transform: none; }
.app-window-bar { height: 42px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 13px; border-bottom: 1px solid var(--border); background: #fbfcfd; color: var(--muted-2); font-size: 10px; }
.window-dots { display: flex; gap: 5px; }.window-dots i { width: 7px; height: 7px; border-radius: 50%; background: #cfd4dc; }.window-dots i:nth-child(2){ background:#d8dce3; }.window-dots i:nth-child(3){ background:#e2e5ea; }
.window-user { justify-self: end; width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: var(--surface-muted); color: var(--muted); font-size: 9px; font-weight: 700; }
.app-shell-preview { display: grid; grid-template-columns: 132px 1fr; min-height: 440px; }
.preview-sidebar { padding: 18px 10px; border-right: 1px solid var(--border); background: #f8f9fb; }
.preview-brand { display: flex; align-items: center; gap: 7px; padding: 0 7px 22px; font-size: 11px; font-weight: 700; }.preview-brand img { width: 19px; height: 19px; }
.preview-group { display: block; padding: 10px 8px 7px; color: #a0a7b2; font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.preview-nav { display: flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 8px; border-radius: 8px; color: #667080; font-size: 9px; }.preview-nav + .preview-nav { margin-top: 4px; }.preview-nav.active { background: #e9eefc; color: #204ebf; font-weight: 650; }.preview-icon { width: 14px; text-align: center; color: #8490a2; }
.preview-main { padding: 28px 28px 24px; background: #f6f7f9; }
.preview-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.preview-kicker { color: #2455d6; font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }.preview-heading h2 { margin: 5px 0 0; color: #171a1f; font-size: 20px; letter-spacing: -.04em; }.preview-heading p { max-width: 260px; margin: 6px 0 0; color: #7c8592; font-size: 8px; line-height: 1.45; }.preview-plan { padding: 5px 8px; border-radius: 999px; background: #e9eefc; color: #2455d6; font-size: 8px; font-weight: 700; }
.preview-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-top: 20px; }.preview-stats > div { min-width: 0; padding: 14px 13px 13px; border: 1px solid #dfe5ee; border-radius: 11px; background: #fff; box-shadow: 0 8px 18px rgba(30,46,75,.045); }.preview-stats span,.preview-stats small { display: block; color: #7f8996; font-size: 7.5px; }.preview-stats strong { display: block; margin: 5px 0 4px; color: #2455d6; font-size: 27px; font-weight: 780; letter-spacing: -.055em; }.preview-stats small { color: #919aa6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.preview-section-head { display: flex; justify-content: space-between; margin: 22px 1px 8px; color: #646d79; font-size: 8px; font-weight: 650; }.preview-section-head small { color: #2455d6; font-size: 8px; }
.device-row { display: grid; grid-template-columns: 28px 1fr auto; gap: 9px; align-items: center; min-height: 51px; padding: 8px 10px; border-top: 1px solid #e3e6eb; }.device-os { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; background: #edf0f4; color: #5c6675; font-size: 9px; font-weight: 750; }.device-row b,.device-row small { display: block; }.device-row b { color: #1e2228; font-size: 9px; }.device-row small { margin-top: 2px; color: #9198a2; font-size: 7.5px; }.device-row em { display: inline-flex; align-items: center; gap: 5px; color: #5f776e; font-size: 7.5px; font-style: normal; }.device-row em i { width: 5px; height: 5px; border-radius: 50%; background: #32a87d; }

.trust-strip { width: var(--content); min-height: 72px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 30px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); color: var(--muted); font-size: 13px; }.trust-strip i { width: 3px; height: 3px; border-radius: 50%; background: var(--border-strong); }

.section { width: var(--content); margin: 0 auto; padding: 124px 0; }
.section-heading { margin-bottom: 58px; }.section-index { display: block; margin-bottom: 18px; color: var(--accent); font-size: 11px; font-weight: 720; text-transform: uppercase; letter-spacing: .12em; }.section-heading h2 { max-width: 880px; font-size: clamp(38px, 4.5vw, 61px); }.split-heading { display: grid; grid-template-columns: 1.45fr .55fr; gap: 56px; align-items: end; }.split-heading p { margin: 0 0 4px; color: var(--muted); font-size: 16px; line-height: 1.65; }

.product-real-preview { max-width: 980px; margin: 0 auto; }.product-app-window .app-shell-preview { min-height: 500px; }.product-app-window .preview-sidebar { width: auto; }.product-app-window .preview-main { padding: 34px 36px 30px; }.product-app-window .preview-heading h2 { font-size: 24px; }.product-app-window .preview-heading p { font-size: 9px; }.product-app-window .preview-stats strong { font-size: 31px; }.product-app-window .device-row { min-height: 56px; }
.principle-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 34px; margin-top: 56px; }.principle-row article { padding-top: 21px; border-top: 1px solid var(--border-strong); }.principle-row article > span { color: var(--accent); font-size: 10px; font-weight: 720; }.principle-row h3 { margin: 20px 0 8px; font-size: 17px; letter-spacing: -.02em; }.principle-row p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }

.features { border-top: 1px solid var(--border); }
.feature-list { border-top: 1px solid var(--border-strong); }.feature-row { display: grid; grid-template-columns: 70px minmax(0,1fr) 330px; gap: 32px; align-items: center; min-height: 170px; padding: 28px 0; border-bottom: 1px solid var(--border); }.feature-number { align-self: start; padding-top: 3px; color: var(--muted-2); font-size: 11px; font-weight: 700; }.feature-row h3 { margin: 0 0 10px; font-size: 24px; letter-spacing: -.035em; }.feature-row p { max-width: 560px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.65; }.feature-visual { justify-self: end; width: 100%; max-width: 310px; color: var(--muted); font-size: 11px; }
.device-visual { display: grid; gap: 6px; }.device-visual span { display: flex; align-items: center; gap: 8px; padding: 9px 11px; border-radius: 8px; background: var(--surface-muted); }.device-visual i { width: 6px; height: 6px; border-radius: 50%; background: var(--success); }
.recall-visual { position: relative; display: flex; gap: 5px; flex-wrap: wrap; padding: 17px; border-radius: 12px; background: var(--surface-muted); }.recall-visual span { padding: 6px 8px; border-radius: 6px; background: var(--surface-solid); }.recall-visual i { width: 72%; height: 6px; margin-top: 6px; border-radius: 999px; background: linear-gradient(90deg, var(--border-strong), transparent); }
.workflow-visual { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }.workflow-visual span { padding: 9px 10px; border-radius: 8px; background: var(--surface-muted); }.workflow-visual b { color: var(--muted-2); font-weight: 400; }
.runtime-visual { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; }.runtime-visual > span { padding: 13px 8px; border-radius: 9px; background: var(--surface-muted); text-align: center; }.runtime-visual > span > span { display: block; }.runtime-visual b { display: block; margin-top: 3px; color: var(--success); font-size: 14px; }


.plans { border-top: 1px solid var(--border); }
.plan-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; max-width: 940px; margin: 0 auto; }.plan-card { position: relative; min-height: 440px; padding: 34px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface-solid); }.plan-card.featured { border-color: #b8c8ef; box-shadow: 0 18px 44px rgba(36,85,214,.09); }.plan-badge { position: absolute; top: -13px; left: 28px; padding: 6px 10px; border-radius: 999px; background: var(--accent); color: #fff; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }.plan-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }.plan-head span { color: var(--muted-2); font-size: 11px; }.plan-head h3 { margin: 6px 0 0; font-size: 34px; letter-spacing: -.045em; }.plan-head strong { color: var(--accent); font-size: 13px; }.plan-card > p { min-height: 50px; margin: 24px 0; color: var(--muted); font-size: 14px; line-height: 1.65; }.plan-card ul { display: grid; gap: 13px; margin: 0; padding: 21px 0; border-top: 1px solid var(--border); list-style: none; }.plan-card li { position: relative; padding-left: 20px; color: var(--muted); font-size: 13px; }.plan-card li::before { content: '✓'; position: absolute; left: 0; color: var(--success); font-weight: 700; }.plan-link { position: absolute; left: 34px; bottom: 32px; display: inline-flex; gap: 9px; color: var(--accent); font-size: 13px; font-weight: 700; }.plan-note { max-width: 940px; margin: 24px auto 0; color: var(--muted-2); text-align: center; font-size: 12px; }

.developer { border-top: 1px solid var(--border); }
.developer-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.developer-card { position: relative; min-height: 220px; padding: 28px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface-solid); transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.developer-card:hover { transform: translateY(-2px); border-color: var(--border-strong); box-shadow: var(--shadow-soft); }
.developer-card > span { color: var(--accent); font-size: 10px; font-weight: 720; }
.developer-card h3 { margin: 26px 0 9px; font-size: 20px; letter-spacing: -.03em; }
.developer-card p { max-width: 280px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.developer-card b { position: absolute; right: 25px; bottom: 22px; color: var(--accent); font-size: 17px; font-weight: 500; }

.closing { position: relative; overflow: hidden; padding: 100px max(24px, calc((100vw - 1180px) / 2)); background: #151922; color: #f5f7fb; }.closing::after { content: ''; position: absolute; width: 560px; height: 560px; top: -250px; right: -80px; border-radius: 50%; background: radial-gradient(circle, rgba(75,112,226,.36), transparent 70%); }.closing > div { position: relative; z-index: 1; max-width: 920px; }.closing-label { display: block; margin-bottom: 19px; color: #94aefa; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }.closing h2 { font-size: clamp(42px, 5vw, 65px); }.closing h2 span { color: #91aaf5; }.closing p { max-width: 700px; margin: 25px 0 0; color: #aeb6c5; font-size: 16px; line-height: 1.65; }.closing-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }.light-button { background: #f4f6fb; color: #171b23; box-shadow: none; }.light-button:hover { background: #fff; }.button-ghost { border: 1px solid #3a414f; color: #c4cbd7; }

footer { width: var(--content); min-height: 150px; margin: 0 auto; display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; }.footer-brand { font-size: 14px; }.footer-brand img { width: 25px; height: 25px; }footer p { margin: 0; color: var(--muted-2); font-size: 12px; }.footer-links { display: flex; gap: 20px; }.footer-links a { color: var(--muted); font-size: 12px; }.footer-links a:hover { color: var(--fg); }

@media (max-width: 1020px) {
  .hero { grid-template-columns: 1fr; gap: 48px; padding-top: 118px; }
  .hero-copy { max-width: 780px; }.hero-showcase { max-width: 760px; }.app-window { max-width: 760px; transform: none; }
  .split-heading { grid-template-columns: 1fr; gap: 25px; align-items: start; }.split-heading p { max-width: 700px; }
  .feature-row { grid-template-columns: 48px minmax(0,1fr) 250px; }.principle-row { gap: 22px; }
}

@media (max-width: 760px) {
  :root { --content: min(100% - 32px, 1180px); }
  .hero { min-height: auto; padding: 104px 0 60px; gap: 38px; }.hero h1 { font-size: clamp(44px, 13vw, 62px); }.hero-lead { margin-top: 22px; font-size: 16px; line-height: 1.65; }.hero-actions { margin-top: 28px; width: 100%; }.button { width: 100%; }.hero-social-proof { margin-top: 24px; }
  .hero-showcase { margin: 0 -4px; padding: 8px 2px; }.showcase-clients { grid-template-columns: repeat(4,1fr); gap: 4px; padding: 0 0 24px; }.showcase-client { gap: 5px; padding: 2px; }.showcase-client img,.showcase-robot { width: 28px; height: 28px; }.showcase-client span:last-child { font-size: 7.5px; }.showcase-core { width: calc(100% - 18px); padding: 16px 15px 14px; border-radius: 18px; }.showcase-core-head { grid-template-columns: 40px minmax(0,1fr) auto; gap: 9px; }.showcase-core-head > img { width: 38px; height: 38px; }.showcase-core-head strong { font-size: 16px; }.showcase-core-capabilities { gap: 10px; padding-top: 12px; }.showcase-device-shelf { gap: 5px; margin-top: 24px; padding: 14px 0 0; }.showcase-device { grid-template-columns: 1fr; justify-items: center; gap: 4px; padding: 1px; text-align: center; }.showcase-device-art { width: 42px; height: 38px; }.showcase-device-art svg { width: 40px; height: 34px; }.showcase-phone svg { width: 28px; height: 37px; }.showcase-device b { font-size: 8px; }.app-window { margin: 0 -4px; border-radius: 13px; }.app-window-bar { height: 36px; }.app-shell-preview { grid-template-columns: 1fr; min-height: 380px; }.preview-sidebar { display: none; }.preview-main { padding: 23px 18px 20px; }.preview-stats { gap: 6px; }.preview-stats > div { padding: 10px; }.preview-stats strong { font-size: 18px; }.product-app-window .preview-main { padding: 23px 18px 20px; }.product-app-window .preview-heading h2 { font-size: 20px; }.product-app-window .preview-stats strong { font-size: 20px; }
  .trust-strip { justify-content: flex-start; gap: 12px 20px; min-height: auto; padding: 22px 0; flex-wrap: wrap; font-size: 12px; }.trust-strip i { display: none; }
  .section { padding: 88px 0; }.section-heading { margin-bottom: 40px; }.section-heading h2 { font-size: clamp(35px, 10vw, 48px); }.split-heading { gap: 20px; }.split-heading p { font-size: 15px; }
  .principle-row { grid-template-columns: 1fr; gap: 26px; margin-top: 40px; }.principle-row h3 { margin-top: 13px; }
  .feature-row { grid-template-columns: 32px 1fr; gap: 10px 12px; min-height: 0; padding: 28px 0; }.feature-row > div:nth-child(2) { min-width: 0; }.feature-visual { grid-column: 2; justify-self: start; max-width: 100%; margin-top: 13px; }.feature-row h3 { font-size: 21px; }.workflow-visual { justify-content: flex-start; flex-wrap: wrap; }.runtime-visual { max-width: 300px; }
  .plan-grid { grid-template-columns: 1fr; }.developer-grid { grid-template-columns: 1fr; }.developer-card { min-height: 190px; }.plan-card { min-height: 410px; padding: 28px; }.plan-link { left: 28px; bottom: 28px; }.plan-card.featured { margin-top: 8px; }
  .closing { padding: 78px 16px; }.closing h2 { font-size: clamp(38px, 11vw, 54px); }.closing p { font-size: 15px; }
  footer { grid-template-columns: 1fr; gap: 13px; padding: 34px 0; }.footer-links { flex-wrap: wrap; gap: 11px 18px; }
}

@media (prefers-color-scheme: dark) {
  :root { --bg: #111317; --fg: #e8eaee; --muted: #9aa2ae; --muted-2: #7f8895; --surface: rgba(26,29,35,.88); --surface-solid: #1a1d23; --surface-muted: #20242b; --border: #2c313a; --border-strong: #363d48; --accent: #6b8cff; --accent-hover: #82a0ff; --accent-soft: #202a46; --accent-fg: #0b0d12; --success: #58c99f; --shadow: 0 24px 64px rgba(0,0,0,.35); --shadow-soft: 0 10px 30px rgba(0,0,0,.22); }
  .button-secondary { background: rgba(26,29,35,.72); }.app-window { border-color: #343a44; background: #181b21; }.app-window-bar { background: #171a20; }.app-shell-preview,.preview-main { background: #111317; }.preview-sidebar { border-color: #2b3039; background: #16191f; }.preview-nav.active { background: #202a46; color: #9ab0ff; }.preview-heading h2,.device-row b { color: #e8eaee; }.preview-stats > div { border-color: #2c313a; background: #1a1d23; }.preview-stats strong { color: #e8eaee; }.device-row { border-color: #292e36; }.device-os { background: #222730; color: #a7b0bd; }.showcase-client,.showcase-device b { color: #e8eaee; }.showcase-core { border-color: #344b82; background: linear-gradient(145deg,rgba(29,35,49,.98),rgba(27,36,64,.98)); box-shadow: 0 18px 38px rgba(0,0,0,.28); }.showcase-core-head { border-color: #33466f; }.showcase-core-head strong,.showcase-core-capability b { color: #eef2ff; }.showcase-core-head small,.showcase-core-capability small,.showcase-device small { color: #9cadcf; }.showcase-device-shelf { border-color: #2e3541; }.showcase-device-art { color: #a7b0bd; }.plan-card { background: #1a1d23; }.closing { background: #090b0f; }.light-button { background: #eff2f8; color: #12151b; }
}