@charset "UTF-8";

@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/manrope-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: "Tenon Sans SC";
  src: url("/assets/fonts/tenon-sc.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  unicode-range: U+3000-9FFF, U+F900-FAFF, U+FF00-FFEF;
}

/* Tenon design system: precise surfaces, generous curves, restrained vermilion. */
:root {
  --canvas: #f7f8fa;
  --surface: #ffffff;
  --surface-soft: #f0f1f3;
  --ink: #202126;
  --muted: #626772;
  --subtle: #737985;
  --accent: #df4529;
  --accent-soft: #fceee9;
  --line: rgba(32, 33, 38, .09);
  --radius-sm: 14px;
  --radius-md: 20px;
  --radius-card: 28px;
  --radius-panel: 36px;
  --radius-pill: 999px;
  --shadow-card: 0 2px 4px rgba(20, 22, 30, .015), 0 12px 36px rgba(20, 22, 30, .035);
  --shadow-elevated: 0 3px 8px rgba(20, 22, 30, .025), 0 22px 60px rgba(20, 22, 30, .07);
  --ease: cubic-bezier(.22, .68, 0, 1.01);
  --font: "Manrope", "Tenon Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --display: var(--font);
  --text-meta: .8125rem;
  --text-label: .875rem;
  --text-ui: .9375rem;
  --text-body: 1rem;
  --text-lead: 1.125rem;
  --weight-body: 400;
  --weight-label: 500;
  --weight-heading: 600;
  --accent-text: #b73924;
  color-scheme: light;
  --max: 1240px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 124px; scrollbar-gutter: stable; overflow-x: clip; }
body { overflow-x: clip; }
body { margin: 0; background: var(--canvas); color: var(--ink); font: var(--weight-body) var(--text-body)/1.8 var(--font); -webkit-font-smoothing: antialiased;  font-kerning: normal;  font-synthesis: none;  text-rendering: optimizeLegibility; }
body.dialog-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
a, button, summary { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a:focus-visible, button:focus-visible, summary:focus-visible, [tabindex="0"]:focus-visible { outline: 3px solid var(--accent); outline-offset: 5px; }
button, a, summary { touch-action: manipulation; }
img { max-width: 100%; }
svg { display: block; width: 24px; height: 24px; }
[hidden] { display: none !important; }
::selection { background: #f7c8ba; color: var(--ink); }
.wrap { width: calc(100% - 112px); max-width: var(--max); margin-inline: auto; }
.mobile-only, .mobile-nav, .menu-toggle { display: none; }
.skip-link { position: fixed; top: -100px; left: 24px; z-index: 110; padding: 12px 24px; color: white; background: var(--ink); border-radius: var(--radius-pill); }
.skip-link:focus { top: 16px; }
.mono { font: 500 .75rem/1.5 var(--display); letter-spacing: .085em; }

/* Floating navigation. */
.site-header { position: sticky; top: 20px; z-index: 40; display: flex; align-items: center; gap: 28px; width: calc(100% - 112px); max-width: 1240px; height: 76px; margin: 20px auto 0; padding: 0 16px 0 28px; background: rgba(255, 255, 255, .82); border: 1px solid rgba(255, 255, 255, .85); border-radius: var(--radius-pill); backdrop-filter: blur(24px) saturate(145%); -webkit-backdrop-filter: blur(24px) saturate(145%); box-shadow: 0 1px 2px #1c20300a, 0 8px 30px #1c203008, inset 0 0 0 1px #24242a03; transition: box-shadow .25s, background .25s; }
.site-header.is-scrolled { background: rgba(255, 255, 255, .94); box-shadow: 0 6px 30px #1c20300e; }
.wordmark { display: inline-flex; align-items: center; flex-shrink: 0; font: 800 2rem/1 var(--display); letter-spacing: -.065em; }
.wordmark-ai { font-size: .75rem; letter-spacing: -.025em; margin: 0 0 1px 7px; align-self: flex-end;  font-weight: 750; }
.brand-period { color: var(--accent); }
.brand-mark { display: block; position: relative; flex-shrink: 0; width: 24px; height: 26px; margin-right: 12px; }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; background: var(--accent); border-radius: 1.5px; }
.brand-mark::before { width: 23px; height: 7px; top: 2px; }
.brand-mark::after { width: 7px; height: 22px; left: 8px; top: 2px; }
.site-header nav { display: flex; gap: 6px; margin-inline: auto; }
.site-header nav a { font-size: var(--text-label); color: #60636d; padding: 10px 18px; border-radius: var(--radius-pill); transition: background .2s, color .2s;  font-weight: 500; }
.site-header nav a:hover { background: #1e223008; color: var(--ink); }
.header-cta { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 11px 21px; border-radius: var(--radius-pill); background: var(--ink); color: white; font-size: var(--text-label); box-shadow: 0 2px 5px #181b2520; transition: background .2s, transform .2s;  font-weight: 550;  line-height: 1.4; }
.header-cta:hover { background: #40424a; transform: translateY(-1px); }
.header-cta .action-icon, .button .action-icon, .text-link .action-icon { transition: transform .22s var(--ease); }
.header-cta:hover .action-icon, .button:hover .action-icon, .text-link:hover .action-icon { transform: translate(2px, -2px); }

/* One sculptural object, one clear message. */
.hero { display: grid; grid-template-columns: 1.03fr 1fr; gap: 36px; align-items: center; padding-top: 78px; }
.hero-copy { min-width: 0; padding: 20px 0; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 29px; font-size: .875rem; color: #5f626b; }
.tiny-mark { display: block; width: 7px; height: 7px; background: var(--accent); border-radius: 2px; }
.hero h1 { margin: 0 0 28px; font-family: var(--display); font-size: clamp(2.75rem, 4.55vw, 4.4rem); font-weight: 650; line-height: 1.24; letter-spacing: -.038em; }
.hero-line { display: block; overflow: clip; padding-bottom: .18em; margin-bottom: -.18em; }
.hero-line-inner { display: inline-block; }
.hero-highlight { position: relative; white-space: nowrap; }
.hero-highlight::after { content: ""; position: absolute; left: 0; right: 0; bottom: -7px; height: 4px; border-radius: var(--radius-pill); background: var(--accent); }
.hero-description { font-size: var(--text-lead); line-height: 1.85; letter-spacing: 0; color: var(--muted); margin: 0 0 34px; }
.hero-actions { display: flex; gap: 26px; align-items: center; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 20px; min-height: 54px; padding: 15px 27px; border-radius: var(--radius-pill); font-size: var(--text-ui); font-weight: 550; border: 1px solid transparent; transition: transform .22s var(--ease), background .22s, box-shadow .22s;  line-height: 1.5; }
.button:hover { transform: translateY(-2px); }
.button-dark { color: #fff; background: var(--ink); box-shadow: 0 3px 8px #17192316; }
.button-dark:hover { background: #373943; box-shadow: 0 8px 20px #17192322; }
.text-link { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; font-size: var(--text-label); color: #5d626b; transition: color .2s;  font-weight: 500; }
.text-link:hover { color: var(--accent); }
.hero-note { margin: 23px 0 0; font-size: var(--text-meta); color: var(--muted); letter-spacing: 0; }
.hero-art { aspect-ratio: 1/1; position: relative; overflow: hidden; border-radius: 40px; background: #f0f1f1; border: 1px solid #ffffffb3; box-shadow: 0 1px 1px #20202603, 0 24px 70px -42px #1518222b; }
.hero-object { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s var(--ease); }
@media (hover:hover) { .hero-art:hover .hero-object { scale: 1.025; } }
.art-caption { position: absolute; display: flex; align-items: center; gap: 10px; left: 20px; right: 20px; bottom: 20px; padding: 12px 16px; color: #595d62; border: 1px solid #ffffffb3; border-radius: var(--radius-pill); background: #fffffff0; backdrop-filter: blur(14px); font-size: var(--text-meta); box-shadow: 0 4px 20px #191d2805; }
.art-caption .mono { margin-left: auto; font-size: .75rem; color: #797d82; white-space: nowrap; }
.art-caption-mark { font-family: var(--display); color: var(--accent); font-size: 1.25rem; line-height: 1; }
.hero-bottom { grid-column: 1/-1; display: flex; justify-content: space-between; gap: 24px; padding: 12px 0 26px; margin-top: 3px; color: var(--muted); font-size: var(--text-meta); }
.hero-bottom a { display: inline-flex; align-items: center; gap: 10px; }
.hero-bottom a .icon { display: grid; place-items: center; width: 32px; height: 32px; background: #eeeef1; border-radius: 50%; }
.intro-strip { margin-top: 12px; }
.intro-strip .wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding-block: 27px; color: var(--muted); font-size: var(--text-label); }
.intro-strip span { display: inline-flex; gap: 13px; align-items: center; }


/* Shared editorial rhythm. */
.section { padding-block: 108px; }
.section-label { display: flex; align-items: center; gap: 23px; flex-wrap: wrap; row-gap: 8px; color: var(--muted); font-size: .875rem; margin: 0 0 23px; }
.section-label > span { color: var(--accent-text); font: 650 .75rem/1.5 var(--display); letter-spacing: .1em; font-weight: 600; }
h2 { margin: 0 0 22px; font-size: clamp(2rem, 3.2vw, 2.9rem); line-height: 1.35; letter-spacing: -.025em; font-weight: var(--weight-heading);  font-family: var(--display);  text-wrap: balance; }
.section-lead { color: var(--muted); line-height: 1.85; font-size: var(--text-body); max-width: 650px; margin: 0 0 36px; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 50px; }
.section-heading .section-lead { margin-bottom: 25px; }

/* A unified control rail and a calm, tangible product preview. */
.scenario-tabs { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 18px; margin-top: 43px; padding: 0; border-bottom: 1px solid var(--line); }
.scenario-tabs button { position: relative; min-width: 0; border: 0; background: none; padding: 19px 0; font-size: var(--text-label); color: var(--muted); border-radius: 4px 4px 0 0; transition: color .2s; text-align: left; line-height: 1.55; }
.scenario-tabs button span { font: 600 .75rem/1 var(--display); color: #777c86; margin-right: 10px;  font-variant-numeric: tabular-nums; }
.scenario-tabs button:hover { color: var(--ink); }
.scenario-tabs button[aria-selected="true"] { color: var(--ink); font-weight: 600; }
.scenario-tabs button::after { content: ""; position: absolute; bottom: -1px; left: 0; right: 0; height: 2px; border-radius: 2px; background: var(--accent); opacity: 0; transform-origin: left; transition: opacity .15s ease; }
.scenario-tabs button[aria-selected="true"]::after { opacity: 1; }
.scenario-tabs button[aria-selected="true"] span { color: var(--accent); }
.scenario-panel { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: center; margin-top: 18px; min-height: 540px; padding: 36px 0; }
.scenario-copy { min-width: 0; }
.scenario-category { display: inline-flex; padding: 5px 12px; border-radius: var(--radius-pill); background: var(--accent-soft); color: #b3432b; font-size: var(--text-meta);  font-weight: 500; }
.scenario-copy h3 { font-size: 2rem; font-weight: 600; line-height: 1.42; letter-spacing: -.02em; margin: 19px 0 19px; }
.scenario-copy p { font-size: 1rem; color: var(--muted); line-height: 1.9; margin: 0; }
.check-list { padding: 0; margin: 23px 0 19px; list-style: none; font-size: .875rem; color: #5a5f68; }
.check-list li { display: flex; align-items: center; gap: 10px; margin-top: 10px; }

.scenario-copy .text-link { color: var(--ink); }
.demo { min-width: 0; align-self: center; border: 1px solid #dddfe5; border-radius: var(--radius-card); overflow: hidden; background: #f5f6f8; box-shadow: 0 2px 4px #24273405, 0 22px 55px -24px #2024351f, inset 0 1px 0 white; }
.demo-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 17px 23px; background: #ffffffbd; border-bottom: 1px solid #e7e8ed; font-size: var(--text-label);  font-weight: 550; }
.demo-top > span:first-child { display: inline-flex; align-items: center; gap: 10px; }
.demo-top > span:last-child { padding: 4px 9px; border: 1px solid #e5e7eb; border-radius: var(--radius-pill); font-size: .75rem; color: var(--muted); white-space: nowrap;  font-weight: 450; }
.demo-symbol { width: 30px; height: 30px; border: 1px solid #e9e5e2; border-radius: 10px; display: grid; place-items: center; background: linear-gradient(#fff, #f8eee8); }
.demo-symbol .brand-mark { margin: 0; transform: scale(.56); }
.demo-body { padding: 25px; }
.demo-question { background: #e9ebef; width: fit-content; max-width: 94%; margin: 0 0 23px auto; padding: 13px 18px; border: 1px solid #e0e3e8; border-radius: 20px 20px 6px 20px; color: #535965; font-size: .875rem; line-height: 1.8; }
.demo-answer { padding: 8px 0; }
.answer-label { font-size: .75rem; color: var(--muted);  font-weight: 500; }
.demo-answer h4 { font-size: 1.125rem; font-weight: 600; letter-spacing: -.015em; margin: 9px 0 19px;  line-height: 1.5; }
.answer-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; }
.answer-list li { display: flex; gap: 12px; }
.answer-list li > span { display: grid; place-items: center; width: 26px; height: 26px; flex-shrink: 0; border: 1px solid #e9eaee; border-radius: 9px; background: #f8f9fa; color: #7b818c; font: 600 .75rem/1 var(--display);  font-variant-numeric: tabular-nums; }
.answer-list strong { display: block; font-size: var(--text-label); font-weight: 550;  line-height: 1.65; }
.answer-list small { font-size: var(--text-label); line-height: 1.75; color: var(--muted);  display: block;  margin-top: 3px; }
.source-chips { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 23px; }
.source-chips span { display: inline-flex; padding: 4px 10px; border: 1px solid #e2e5e9; border-radius: var(--radius-pill); font-size: .75rem; line-height: 1.5; color: var(--muted);  gap: 5px;  align-items: center; }
.demo-bottom { border-top: 1px solid #e3e6eb; padding: 13px 23px; font-size: .75rem; color: var(--muted); }
.demo-footer-content { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.possibilities-foot { display: flex; justify-content: space-between; gap: 24px; margin-top: 24px; padding-inline: 5px; color: var(--muted); font-size: .8125rem; }
.possibilities-foot .mono { font-size: .75rem; }

/* Open columns describe the service without another layer of cards. */
.approach { padding-top: 26px; }
.steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; margin-top: 35px; border-top: 1px solid var(--line); }
.step { display: flex; flex-direction: column; padding: 36px; border-right: 1px solid var(--line); }
.step:first-child { padding-left: 0; }
.step:last-child { padding-right: 0; border-right: 0; }
.step-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.step-number { color: var(--subtle); font: 450 2.5rem/1.2 var(--display); letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.step-tag { padding: 5px 10px; font-size: var(--text-meta); color: #737882; border: 1px solid #e6e8ec; border-radius: var(--radius-pill);  font-weight: 500; }
.step:first-child .step-number { color: var(--accent-text); }
.step:first-child .step-tag { color: #b04931; border-color: #eedbd1; background: #fff9f5; }
.step h3 { font-weight: 600; font-size: 1.5rem; letter-spacing: -.02em; margin: 29px 0 15px;  line-height: 1.45; }
.step p { color: var(--muted); font-size: 1rem; line-height: 1.9; margin: 0 0 26px; }
.step-detail { display: flex; flex-direction: column; gap: 7px; border-top: 1px solid #eceef1; padding-top: 20px; margin-top: auto; }
.step-detail > span { color: var(--muted); font-size: var(--text-meta); }
.step-detail strong { font-size: var(--text-label); font-weight: 500; color: #535862; }

/* A dark stage for the enterprise control plane. */
.hub-section { width: 100%; overflow: clip; background: radial-gradient(ellipse at 75% 50%, #292c3480, transparent 65%), #18191e; color: #f5f5f7; padding-block: 112px; }
.hub-section .wrap { width: calc(100% - 112px); }
.hub-grid { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 68px; }
.hub-copy { min-width: 0; }
.hub-copy .section-label { color: #959aa6; }
.hub-copy .section-label > span { color: #f39077; }
.hub-copy h2 { font-weight: 600; }
.hub-copy > p:not(.section-label) { font-size: 1rem; color: #a6abb7; line-height: 1.95; max-width: 450px; }
.hub-points { display: flex; gap: 10px; flex-wrap: wrap; margin: 29px 0 20px; }
.hub-points span { border: 1px solid #3d404a; border-radius: var(--radius-pill); background: #ffffff03; padding: 7px 13px; font-size: var(--text-label); color: #c6cad3; }
.hub-copy .text-link { color: #eeeef3; }
.hub-diagram { width: 100%; border: 1px solid #42454f; border-radius: 28px; overflow: hidden; background: linear-gradient(130deg,#282b34c9,#1e2027e0); box-shadow: 0 24px 50px #00000030, inset 0 1px 0 #ffffff10; }
.diagram-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 24px; border-bottom: 1px solid #ffffff0c; background: #ffffff03; font-size: .75rem; color: #9ca2b0; }
.diagram-toolbar-brand { display: inline-flex; gap: 5px; align-items: center; font: 500 .875rem var(--display); color: #e5e7ed; }
.diagram-toolbar .brand-mark { margin: 0; width: 24px; transform: scale(.58); }
.diagram-flow { padding: 28px 28px 20px; }
.diagram-top { display: flex; align-items: center; gap: 12px; justify-content: center; }
.diagram-icon { display: grid; place-items: center; width: 43px; height: 43px; background: #2d3039; border: 1px solid #424652; border-radius: 14px; color: #c3c9d5; }
.diagram-icon svg { width: 21px; height: 21px; }
.diagram-top strong { display: block; font-size: var(--text-label); font-weight: 550; color: #e4e7ee; }
.diagram-top div > span { font-size: var(--text-meta); color: #989fad; }
.connector-line { width: 1px; height: 31px; margin-inline: auto; background: linear-gradient(#596273, #a7adbb); }
.hub-node { display: flex; align-items: center; gap: 15px; padding: 22px; border-radius: 20px; border: 1px solid #6c7080; background: linear-gradient(125deg,#3a3d46,#2a2d35); box-shadow: 0 3px 8px #00000017, 0 0 30px #edf1ff04, inset 0 1px 0 #ffffff0f; }
.hub-node-logo { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: 14px; background: linear-gradient(140deg,#f07450,#df4529); box-shadow: 0 4px 10px #00000025,inset 0 1px 1px #ffbd9b66; }
.hub-node-logo .brand-mark { margin: 0; transform: scale(.8); }
.hub-node-logo .brand-mark::before,.hub-node-logo .brand-mark::after { background: #fff4ee; }
.hub-node strong { display: block; font: 650 1.5rem/1.3 var(--display); letter-spacing: -.035em; }
.hub-node div > span { font-size: var(--text-meta); color: #b4bac8; }
.hub-node-plus { margin-left: auto; color: #a3abb9; }
.hub-node-plus svg { width: 21px; height: 21px; }
.branch-lines { height: 47px; width: 68%; margin-inline: auto; position: relative; background: linear-gradient(#626b7b,#626b7b) center top/1px 100% no-repeat; }
.branch-lines::after { content: ""; position: absolute; left: 0; right: 0; top: 22px; height: 25px; border: 1px solid #626b7b; border-bottom: none; border-radius: 12px 12px 0 0; }
.agent-nodes { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 11px; }
.agent-nodes > div { display: flex; align-items: center; flex-direction: column; gap: 12px; padding: 20px 6px 17px; border: 1px solid #444854; border-radius: 17px; background: linear-gradient(#3236408f,#2b2e378f); box-shadow: inset 0 1px 0 #ffffff04; }
.node-icon { color: #b7c0d1; }
.node-icon svg { width: 23px; height: 23px; }
.agent-nodes strong { font-size: var(--text-label); font-weight: 500; color: #c7cddb; white-space: normal;  text-align: center; }
.diagram-note { font-size: var(--text-meta); text-align: center; color: #989fae; margin: 23px 0 0; }
.hub-principles { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 32px; border-top: 1px solid #ffffff18; padding-top: 38px; }
.hub-principle { min-width: 0; --principle-delay: 0s; }
.hub-principle:nth-child(2) { --principle-delay: .12s; }
.hub-principle:nth-child(3) { --principle-delay: .24s; }
.hub-principle:nth-child(4) { --principle-delay: .36s; }
.hub-principle > .icon { width: 24px; height: 24px; color: #f39077; }
.hub-principle h3 { margin: 18px 0 12px; font-size: 1.125rem; font-weight: 550; line-height: 1.5; letter-spacing: -.02em; }
.hub-principle p { margin: 0; font-size: 1rem; line-height: 1.9; color: #a6abb7; }

/* A quiet list, with space reserved for the answer. */
.faq-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 62px; }
.faq-section h2 { font-size: 2.25rem; }
.faq-aside { font-size: 1rem; line-height: 1.9; color: var(--muted); margin-top: 25px; }
.faq-list { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; list-style: none; padding-block: 23px; cursor: pointer; font-size: 1rem; font-weight: 500; line-height: 1.7; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary > span { display: grid; place-items: center; flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; background: #f1f2f5; color: #7a808b; font: inherit; transition: transform .25s var(--ease), background .25s, color .25s; }
.faq-list details[open] summary > span { transform: rotate(45deg); color: var(--accent); background: var(--accent-soft); }
.faq-list details[open] summary { padding-bottom: 14px; }
.faq-list details p { font-size: 1rem; color: var(--muted); line-height: 1.95; margin: 0 22px 24px 0; }

/* Scan, enlarge, save: real contact entry points. */
.start-section { width: 100%; padding-block: 96px; background: radial-gradient(ellipse at 92% 6%, #f6a57380,transparent 55%), #ed5838; }
.start-section .wrap { width: calc(100% - 112px); }
.start-grid { display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: 62px; }
.start-copy .section-label { color: #643326; gap: 14px; }
.start-copy .section-label > span { color: #643326; font-size: .75rem; }
.start-copy h2 { font-weight: 600; font-size: clamp(2rem,3vw,2.8rem); line-height: 1.42;  letter-spacing: -.025em; }
.start-copy h2 > span { color: #fff9f1; white-space: nowrap; }
.start-copy > p:not(.section-label):not(.trial-caption) { color: #572d23; font-size: 1rem; line-height: 1.95; margin-top: 24px; }
.trial-facts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 28px; font-size: var(--text-meta); color: #633528;  font-weight: 500; }
.trial-facts span { border: 1px solid #b84c346b; border-radius: var(--radius-pill); background: #ffffff0e; padding: 6px 10px; }
.trial-caption { font-size: var(--text-meta); color: #623428; line-height: 1.8; margin-top: 15px; }
.contact-channels { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px; }
.contact-card { min-width: 0; padding: 22px 20px 19px; background: #ffffffed; border: 1px solid #ffffffc9; border-radius: var(--radius-card); box-shadow: 0 4px 7px #672f2203, 0 20px 45px #672f220c; transition: transform .3s var(--ease), box-shadow .3s; }
@media (hover:hover) { .contact-card:hover { transform: translateY(-4px); box-shadow: 0 22px 48px #672f2224; } }
.channel-heading { display: flex; align-items: center; gap: 10px; }
.channel-icon { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border: 1px solid #e8e4df; border-radius: 13px; background: linear-gradient(#fff, #f5f3ef); color: #63605c; }
.channel-icon svg { width: 20px; height: 20px; }
.channel-heading h3 { font-size: 1.0625rem; font-weight: 600; line-height: 1.5; margin: 0;  letter-spacing: -.015em; }
.channel-heading p { font-size: var(--text-meta); color: #7a7772; line-height: 1.6; margin: 2px 0 0; }
.qr-preview { display: block; position: relative; width: 100%; background: #fff; padding: 0; margin: 22px 0 18px; border: 1px solid #efeeeb; border-radius: var(--radius-md); box-shadow: 0 2px 3px #2e231b02; }
.qr-crop { display: block; aspect-ratio: 1; position: relative; width: 100%; overflow: hidden; background: #fff; border-radius: inherit; }
.qr-crop img { display: block; position: absolute; height: auto; max-width: none; }
.qr-feishu img { width: 129.924242%; left: -14.962121%; top: -33.333333%; }
.qr-wechat img { width: 121.311475%; left: -10.655738%; top: -33.606557%; }
.qr-expand { position: static; right: 6px; bottom: 6px; display: flex; place-items: center; width: 100%; height: auto; background: #fff; border: 0; border-radius: 0 0 18px 18px; color: #626975; opacity: 1; transition: opacity .2s, transform .2s; transform: none;  align-items: center;  justify-content: center;  gap: 7px;  padding: 8px 0 10px;  font-size: var(--text-meta); }
.qr-expand svg { width: 14px; height: 14px; }
.qr-preview:hover .qr-expand, .qr-preview:focus-visible .qr-expand { opacity: 1; transform: none; }
.contact-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px; font-size: var(--text-meta); color: #74716e; }
.contact-actions a { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; color: #4c4a47; border-bottom: 1px solid transparent;  font-size: var(--text-label);  font-weight: 500; }
.contact-actions a:hover { color: var(--accent); border-color: currentColor; }
.contact-note { grid-column: 1/-1; margin: 0; color: #683729; font-size: var(--text-meta); text-align: center; line-height: 1.8; }

/* Native dialog retains keyboard focus and platform Escape behavior. */
.qr-dialog { width: min(440px,calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 35px; border: 1px solid #ffffffa6; border-radius: 32px; background: #fdfdfd; color: var(--ink); box-shadow: 0 30px 120px #11182738, 0 5px 20px #1118270f; text-align: center; overflow: auto; }
.qr-dialog::backdrop { background: #171a2566; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.qr-dialog[open] { animation: dialog-enter .24s var(--ease); }
.dialog-close { position: absolute; right: 17px; top: 17px; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #e6e8ec; border-radius: 50%; background: #f2f3f6; color: #717781; }
.dialog-close svg { width: 16px; height: 16px; }
.dialog-close:hover { background: #e9ebf0; color: var(--ink); }
.dialog-eyebrow { font: 650 .75rem/1.6 var(--display); letter-spacing: .09em; color: var(--accent-text); margin: 22px 0 14px; }
.qr-dialog h2 { font-size: 1.875rem; letter-spacing: -.03em; margin: 0 0 8px; }
#dialog-description { color: var(--muted); font-size: .875rem; margin: 0 0 20px; }
.dialog-qr { width: min(300px,100%); border: 1px solid #eeeff1; border-radius: 20px; margin-inline: auto; }
.dialog-save { width: min(300px,100%); margin-top: 24px; }
.dialog-help { font-size: var(--text-meta); color: var(--muted); margin: 16px 0 0; }

/* Closing signature. */
.closing-line { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 53px; }
.closing-line p { font-size: 1.375rem; letter-spacing: -.015em; font-weight: 500; }
.closing-line > a { width: 44px; height: 44px; display: grid; place-items: center; flex-shrink: 0; border: 1px solid #e0e3e8; background: #fff; border-radius: 50%; color: #737986; transition: transform .2s, background .2s; }
.closing-line > a:hover { background: #eff1f4; transform: translateY(-3px); }
.site-footer { display: flex; align-items: center; gap: 27px; border-top: 1px solid var(--line); padding-block: 29px 34px; }
.footer-wordmark { font-size: 1.875rem; }
.footer-wordmark .wordmark-ai { font-size: .75rem; }
.footer-wordmark .brand-mark { transform: scale(.85); margin-right: 9px; }
.site-footer > span, .site-footer small { font-size: var(--text-meta); color: var(--muted); }
.site-footer small { margin-left: auto; }
.footer-plan-link { font-size: var(--text-meta); color: var(--muted); }
.footer-plan-link:hover { color: var(--accent-text); }

@keyframes dialog-enter { from { opacity: 0; transform: translateY(8px) scale(.97); } to { opacity: 1; transform: none; } }

/* Tablet: maintain the same shapes, reduce the insets. */
@media (min-width:1600px) { .hero { padding-top: 95px; gap: 50px; } .hero h1 { font-size: 4.4rem; } }
@media (max-width:1100px) {
  .wrap, .site-header { width: calc(100% - 64px); }
  .site-header { padding-left: 24px; gap: 16px; }
  .site-header nav a { padding-inline: 13px; }
  .hero { padding-top: 62px; gap: 28px; }
  .hero h1 { font-size: clamp(2.5rem,4.7vw,3.3rem); }
  .hero-description { font-size: 1rem; }
  .hero-actions { gap: 19px; }
  .button { padding-inline: 23px; gap: 20px; }
  .art-caption { left: 14px; right: 14px; padding: 11px 12px; gap: 6px; }
  .art-caption .mono { font-size: .75rem; }
  .scenario-panel { padding: 34px 0; gap: 32px; grid-template-columns: .8fr 1.2fr; }
  .scenario-copy h3 { font-size: 1.75rem; }
  .scenario-tabs button { font-size: .875rem; padding-inline: 8px; }
  .scenario-tabs button span { margin-right: 5px; }
  .demo-body { padding: 20px; }
  .demo-answer { padding: 8px 0; }
  .step { padding: 25px; }
  .step-top { gap: 7px; }
  .step-tag { padding: 4px 8px; }
  .hub-section .wrap, .start-section .wrap { width: calc(100% - 64px); }
  .hub-grid { gap: 40px; }
  .hub-principles { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 36px; }
  .hub-copy h2 { font-size: 2.25rem; }
  .diagram-flow { padding: 24px 22px 20px; }
  .hub-node { padding: 18px; gap: 12px; }
  .agent-nodes { gap: 8px; }
  .faq-section { gap: 38px; grid-template-columns: .8fr 1.2fr; }
  .faq-section h2 { font-size: 2rem; }
  .start-grid { gap: 36px; grid-template-columns: .8fr 1.2fr; }
  .contact-card { padding: 18px 15px 15px; }
  .channel-icon { display: none; }
  .contact-actions { font-size: .75rem; }
}
@media (max-width:900px) {
  .section { padding-block: 80px; }
  .hero { gap: 24px; }
  .hero h1 { font-size: 2.5rem; }
  .hero-actions { gap: 13px; }
  .hero-actions .button { padding: 13px 19px; gap: 14px; min-height: 50px; }
  .hero-actions .text-link { font-size: .875rem; gap: 8px; }
  .hero-note { letter-spacing: 0; }
  .art-caption .mono { display: none; }
  .scenario-tabs { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .scenario-tabs button { padding-block: 15px; }
  .scenario-panel { gap: 26px; padding: 30px 0; }
  .scenario-copy h3 { font-size: 1.625rem; }
  .scenario-copy p br { display: none; }
  .demo-top { padding: 14px 17px; gap: 8px; }
  .demo-top > span:first-child { gap: 7px; }
  .demo-top > span:last-child { font-size: .75rem; padding-inline: 7px; }
  .demo-body { padding: 17px; }
  .demo-answer { padding: 8px 0; }
  .demo-question { max-width: 100%; }
  .section-heading { display: block; }
  .section-heading .section-lead { margin-top: 18px; }
  .step { padding: 22px; }
  .step-top { flex-wrap: wrap; }
  .step h3 { font-size: 1.25rem; }
  .hub-grid { grid-template-columns: 1fr; gap: 44px; }
  .hub-copy { text-align: center; }
  .hub-copy .section-label, .hub-points { justify-content: center; }
  .hub-copy > p:not(.section-label) { margin-inline: auto; max-width: 530px; }
  .hub-diagram { max-width: 530px; margin-inline: auto; }
  .diagram-flow { padding: 32px; }
  .faq-section { grid-template-columns: 1fr; gap: 28px; }
  .faq-aside { display: none; }
  .start-grid { grid-template-columns: 1fr; gap: 35px; }
  .start-copy { text-align: center; }
  .start-copy .section-label, .trial-facts { justify-content: center; }
  .start-copy h2 { font-size: 2.5rem; }
  .contact-channels { width: 100%; max-width: 580px; margin-inline: auto; gap: 20px; }
  .contact-card { padding: 23px; }
  .channel-icon { display: grid; }
  .qr-preview { margin-top: 21px; }
  .possibilities-foot .mono { display: none; }
}
@media (max-width:700px) {
  html { scroll-padding-top: 100px; }
  .wrap { width: calc(100% - 40px); }
  .site-header { width: calc(100% - 24px); top: 12px; height: 66px; margin-top: 12px; padding: 0 15px 0 19px; gap: 13px; }
  .wordmark { font-size: 1.8rem; }
  .wordmark-ai { font-size: .75rem; margin-left: 5px; }
  .brand-mark { transform: scale(.85); margin-right: 7px; }
  .site-header nav { display: none; }
  .header-cta { font-size: .75rem; min-height: 38px; padding: 8px 14px; gap: 9px; margin-left: auto; }
  .menu-toggle { display: flex; width: 29px; min-height: 40px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border: 0; background: transparent; padding: 4px; border-radius: 10px; }
  .menu-toggle span { width: 18px; height: 1.5px; border-radius: 2px; background: #555a65; transition: transform .2s; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.25px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.25px) rotate(-45deg); }
  .mobile-nav:not([hidden]) { display: flex; flex-direction: column; position: fixed; left: 12px; right: 12px; top: 88px; z-index: 39; padding: 14px 24px; border: 1px solid #e2e5eb; border-radius: 25px; background: #fffffff5; backdrop-filter: blur(24px); box-shadow: var(--shadow-elevated); }
  .mobile-nav a { display: flex; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid var(--line); font-size: .9375rem; }
  .mobile-nav a:last-child { border: 0; }
  .mobile-nav a span { color: var(--muted); font-size: .75rem; }
  .hero { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding-top: 47px; }
  .hero-copy { padding: 0; }
  .eyebrow { font-size: .8125rem; margin-bottom: 22px; }
  .hero h1 { font-size: clamp(2.5rem,9.5vw,3.625rem); letter-spacing: -.045em; margin-bottom: 27px; }
  .hero-description { font-size: 1rem; margin-bottom: 27px; }
  .hero-actions { gap: 23px; }
  .hero-actions .button { font-size: .875rem; min-height: 50px; padding: 13px 23px; gap: 24px; }
  .hero-actions .text-link { font-size: .875rem; gap: 10px; }
  .hero-note { font-size: .75rem; margin-top: 21px; }
  .hero-art { width: 100%; max-width: 480px; margin: 29px auto 0; border-radius: 32px; }
  .art-caption { left: 15px; right: 15px; bottom: 14px; padding: 10px 13px; font-size: .75rem; }
  .art-caption .mono { display: block; font-size: .75rem; }
  .hero-bottom { padding: 22px 0 20px; margin: 0; align-items: center; font-size: .75rem; gap: 12px; }
  .hero-bottom > span { max-width: 65%; }
  .hero-bottom a { gap: 7px; white-space: nowrap; }
  .hero-bottom a .icon { width: 28px; height: 28px; }
  .intro-strip { margin: 0; }
  .intro-strip .wrap { font-size: .8125rem; gap: 14px; padding-block: 22px; }
  .intro-strip span { gap: 8px; }
  .intro-strip span:nth-child(3) { display: none; }
  .section { padding-block: 65px; }
  .section-label { font-size: .8125rem; gap: 14px; margin-bottom: 19px; }
  .section-label > span { font-size: .75rem; }
  h2 { font-size: clamp(1.8rem,6.7vw,2.25rem); line-height: 1.45; letter-spacing: -.035em; }
  .section-lead { font-size: 1rem; margin-bottom: 27px; }
  .scenario-tabs { margin-top: 28px; gap: 0 16px; }
  .scenario-tabs button { font-size: .875rem; padding: 14px 0; }
  .scenario-tabs button span { font-size: .75rem; margin-right: 5px; }
  .scenario-panel { display: flex; flex-direction: column; align-items: stretch; min-height: 0; padding: 28px 0 0; margin-top: 13px; gap: 29px; }
  .scenario-copy h3 { font-size: 1.75rem; margin-top: 15px; }
  .scenario-copy p { font-size: 1rem; }
  .check-list { font-size: .875rem; margin-block: 22px 15px; }
  .check-list li { margin-top: 9px; }
  .scenario-copy .text-link { min-height: 40px; }
  .demo { width: 100%; border-radius: 24px; }
  .demo-top { padding: 14px; font-size: .875rem; }
  .demo-top > span:last-child { font-size: .75rem; }
  .demo-body { padding: 17px 13px; }
  .demo-question { padding: 12px 14px; font-size: .875rem; }
  .demo-answer { padding: 8px 0; }
  .demo-answer h4 { font-size: 1rem; }
  .answer-list { gap: 16px; }
  .answer-list small { font-size: .875rem; }
  .answer-list li { gap: 9px; }
  .source-chips { gap: 6px; }
  .source-chips span { font-size: .75rem; padding-inline: 8px; }
  .demo-bottom { font-size: .75rem; padding: 11px 15px; }
  .possibilities-foot { font-size: .8125rem; margin-top: 22px; }
  .approach { padding-top: 6px; }
  .steps { grid-template-columns: 1fr; margin-top: 27px; }
  .step, .step:first-child, .step:last-child { padding: 30px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .step-top { flex-wrap: nowrap; }
  .step h3 { font-size: 1.375rem; margin-top: 24px; }
  .step p { margin-bottom: 22px; }
  .step-detail { padding-top: 16px; flex-direction: row; align-items: center; gap: 15px; }
  .step-detail strong { font-size: .875rem; }
  .hub-section, .start-section { padding-block: 72px; }
  .hub-section .wrap, .start-section .wrap { width: calc(100% - 40px); }
  .hub-copy h2 { font-size: 2rem; }
  .hub-copy > p:not(.section-label) { font-size: 1rem; }
  .hub-grid { gap: 32px; }
  .hub-principles { grid-template-columns: 1fr; gap: 30px; padding-top: 30px; }
  .hub-principle:nth-child(n) { --principle-delay: 0s; }
  .hub-principle { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 10px 16px; }
  .hub-principle > .icon { margin-top: 2px; }
  .hub-principle h3 { margin: 0; }
  .hub-principle p { grid-column: 2; }
  .hub-points { gap: 7px; }
  .hub-points span { font-size: .75rem; padding: 6px 10px; }
  .hub-diagram { border-radius: 24px; }
  .diagram-toolbar { padding: 14px 18px; }
  .diagram-flow { padding: 24px 17px 20px; }
  .hub-node { padding: 16px; gap: 11px; border-radius: 18px; }
  .hub-node strong { font-size: 1.3125rem; }
  .hub-node-logo { width: 40px; height: 40px; border-radius: 13px; }
  .hub-node div > span { font-size: .75rem; }
  .agent-nodes { gap: 7px; }
  .agent-nodes > div { padding: 17px 3px 14px; border-radius: 15px; gap: 11px; }
  .agent-nodes strong { font-size: .8125rem; }
  .diagram-note { font-size: .75rem; }
  .faq-section { gap: 25px; }
  .faq-section h2 { font-size: 1.875rem; margin-bottom: 0; }
  .faq-list summary { font-size: .9375rem; padding-block: 20px; gap: 15px; }
  .faq-list summary > span { width: 27px; height: 27px; }
  .faq-list details p { font-size: 1rem; margin-right: 0; }
  .start-copy h2 { font-size: 2.0625rem; }
  .start-copy .section-label { gap: 10px; font-size: .75rem; }
  .start-copy .section-label > span { font-size: .75rem; }
  .start-copy > p:not(.section-label):not(.trial-caption) { font-size: 1rem; }
  .trial-facts { gap: 6px; }
  .trial-facts span { padding: 5px 9px; }
  .trial-caption { font-size: .75rem; }
  .contact-channels { gap: 12px; }
  .contact-card { border-radius: 23px; padding: 17px 12px 13px; }
  .channel-icon { display: none; }
  .channel-heading h3 { font-size: .9375rem; }
  .channel-heading p { font-size: .75rem; }
  .qr-preview { border-radius: 15px; margin: 17px 0 12px; }
  .contact-actions { flex-direction: column; align-items: center; gap: 0; font-size: .75rem; }
  .contact-actions > span { font-size: .75rem; }


  .contact-note { font-size: .75rem; margin-top: 4px; }
  .closing-line { padding-block: 32px; }
  .closing-line p { font-size: 1.25rem; line-height: 1.7; }
  .mobile-only { display: initial; }
  .site-footer { flex-wrap: wrap; gap: 20px; padding-block: 25px 28px; }
  .site-footer > span { font-size: .75rem; }
  .site-footer small { width: 100%; margin: 0; }
  .qr-dialog { padding: 30px 24px; border-radius: 28px; }
  .dialog-help { font-size: .75rem; }
}
@media (max-width:380px) {
  .wrap { width: calc(100% - 32px); }
  .site-header { padding: 0 11px 0 14px; gap: 8px; }
  .wordmark { font-size: 1.625rem; }
  .brand-mark { margin-right: 4px; }
  .header-cta { padding-inline: 11px; gap: 6px; font-size: .75rem; }
  .header-cta .action-icon { display: none; }
  .hero h1 { font-size: 2.4rem; }
  .hero-actions { gap: 11px; }
  .hero-actions .button { padding-inline: 18px; gap: 14px; }
  .hero-actions .text-link { font-size: .875rem; gap: 7px; }
  .art-caption .mono { display: none; }
  .hero-note { font-size: .75rem; }
  .hero-bottom a { font-size: .75rem; }
  .intro-strip .wrap { font-size: .75rem; gap: 9px; }
  .intro-strip span { gap: 6px; }
  .section-label { font-size: .75rem; gap: 11px; }
  .scenario-tabs button { font-size: .875rem; }
  .scenario-tabs button span { display: none; }
  .scenario-tabs button span { margin-right: 3px; font-size: .75rem; }
  .scenario-panel { padding-top: 24px; }
  .demo-top > span:last-child { padding-inline: 5px; }
  .demo-symbol { width: 26px; height: 26px; }
  .demo-answer { padding: 8px 0; }
  .section-heading h2 { font-size: 1.875rem; }
  .hub-section .wrap, .start-section .wrap { width: calc(100% - 32px); }
  .hub-node { padding: 14px 12px; }
  .hub-node-logo { width: 35px; height: 35px; border-radius: 11px; }
  .hub-node-plus { display: none; }
  .diagram-flow { padding-inline: 12px; }
  .agent-nodes strong { font-size: .8125rem; }
  .start-copy h2 { font-size: 1.875rem; }
  .contact-channels { gap: 9px; }
  .contact-card { padding-inline: 10px; border-radius: 20px; }
  .channel-heading p { font-size: .75rem; }
  .contact-note { text-align: left; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}


/* Contextual sizes build on the shared grid in icons.css. */
.action-icon { width: 1.125rem; height: 1.125rem; }
.button .action-icon { width: 1.25rem; height: 1.25rem; }
.button:hover .icon-download, .text-link[href="#possibilities"]:hover .action-icon { transform: translateY(2px); }
.intro-strip .icon, .art-caption-mark { color: var(--accent-text); width: 1rem; height: 1rem; }
.check-icon { width: 1.25rem; height: 1.25rem; padding: 3px; border-radius: 50%; color: #68717f; background: #f0f2f5; stroke-width: 2; }
.source-chips .icon { width: .875rem; height: .875rem; }
.faq-toggle .icon { width: 1rem; height: 1rem; }
.qr-expand::before { content: "放大查看"; }
.qr-expand .icon { width: 1rem; height: 1rem; }
.qr-preview:hover { border-color: #cdd1d9; }
.dialog-close .icon { width: 1.125rem; height: 1.125rem; }
.diagram-icon .icon, .node-icon .icon { width: 1.5rem; height: 1.5rem; }
.closing-line > a .icon { width: 1.25rem; height: 1.25rem; }
.art-caption .mono, .possibilities-foot .mono, .section-label > span, .start-copy .section-label > span, .demo-top > span:last-child, .dialog-eyebrow { font-size: .75rem; }
.hub-node div > span, .diagram-note, .channel-heading p, .hero-note, .hero-bottom a { font-size: .8125rem; }
@media (max-width:700px) {
  .wordmark { font-size: 1.65rem; }
  .wordmark-ai { font-size: .75rem; }
  .header-cta { font-size: .875rem; min-height: 42px; padding-inline: 12px; }
  .header-cta .cta-prefix { display: none; }
  .site-header { gap: 10px; }
  .hero h1 { letter-spacing: -.03em; }
  .hero-actions { gap: 12px 20px; }
  .hero-actions .button { gap: 16px; }
  .hero-bottom .icon { padding: 7px; }
  .step-detail { flex-wrap: wrap; gap: 5px 12px; }
  .channel-heading h3 { font-size: 1rem; }
  .contact-actions > span { font-size: .8125rem; }
}

/* Theme controls share the icon grid and keep the navigation quiet. */
.theme-toggle { position: relative; display: grid; place-items: center; flex-shrink: 0; width: 42px; height: 42px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--muted); transition: background .2s, color .2s; }
.theme-toggle:hover { color: var(--ink); background: var(--surface-soft); }
.theme-toggle .icon { position: absolute; width: 20px; height: 20px; transition: opacity .25s, transform .35s var(--ease); }
.theme-sun { opacity: 0; transform: rotate(-45deg) scale(.65); }
.theme-moon { opacity: 1; transform: rotate(0) scale(1); }
[data-theme="dark"] .theme-sun { opacity: 1; transform: rotate(0) scale(1); }
[data-theme="dark"] .theme-moon { opacity: 0; transform: rotate(45deg) scale(.65); }
.menu-toggle .icon { width: 20px; height: 20px; }
.menu-toggle .menu-close { display: none; }
.menu-toggle[aria-expanded="true"] .menu-open { display: none; }
.menu-toggle[aria-expanded="true"] .menu-close { display: block; }
body { transition: background-color .35s, color .25s; }

/* Dark surfaces are tuned individually; QR images always retain white paper. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #111216;
  --surface: #1a1c22;
  --surface-soft: #252830;
  --ink: #f0f1f5;
  --muted: #a9afbb;
  --subtle: #8f97a6;
  --accent: #f07857;
  --accent-text: #fba68e;
  --accent-soft: #3b2925;
  --line: #ffffff15;
  --shadow-card: 0 2px 4px #0000000d, 0 15px 40px #00000018;
  --shadow-elevated: 0 5px 12px #0000001c, 0 22px 60px #00000033;
}
[data-theme="dark"] .site-header { background: #1b1d25c9; border-color: #ffffff12; box-shadow: 0 6px 35px #00000020, inset 0 1px 0 #ffffff05; }
[data-theme="dark"] .site-header.is-scrolled { background: #1b1d25ee; }
[data-theme="dark"] .site-header nav a { color: #b4b9c4; }
[data-theme="dark"] .site-header nav a:hover { color: #fff; background: #ffffff09; }
[data-theme="dark"] :is(.header-cta,.button-dark) { background: #e9ebf1; color: #17191e; box-shadow: 0 3px 12px #00000018; }
[data-theme="dark"] :is(.header-cta,.button-dark):hover { background: #fff; }
[data-theme="dark"] :is(.eyebrow,.text-link,.check-list) { color: #b2b8c4; }
[data-theme="dark"] .text-link:hover { color: var(--accent-text); }
[data-theme="dark"] .hero-art { border-color: #ffffff1a; box-shadow: 0 24px 65px -30px #00000066; background: #c7c8c8; }
[data-theme="dark"] .hero-object { opacity: .9; }
[data-theme="dark"] .art-caption { color: #e1e4eb; border-color: #ffffff1f; background: #202329de; box-shadow: 0 4px 20px #00000025; }
[data-theme="dark"] .art-caption .mono { color: #b5bcc8; }
[data-theme="dark"] .hero-bottom a .icon { background: #252830; }
[data-theme="dark"] .scenario-tabs { border-color: #30343e; }
[data-theme="dark"] .scenario-tabs button { color: #a9b0bd; }
[data-theme="dark"] .scenario-tabs button:hover { color: #fff; }
[data-theme="dark"] .scenario-tabs button[aria-selected="true"] { color: #f5f6fa; }
[data-theme="dark"] .scenario-tabs button span { color: #a3adbd; }
[data-theme="dark"] .scenario-tabs button[aria-selected="true"] span { color: var(--accent-text); }
[data-theme="dark"] .scenario-category { color: var(--accent-text); }
[data-theme="dark"] .check-icon { background: #292d37; color: #b9c2d1; }
[data-theme="dark"] .demo { border-color: #3a404d; background: #16191f; box-shadow: 0 22px 50px -24px #00000088; }
[data-theme="dark"] .demo-top { background: #23262e; border-color: #ffffff0c; }
[data-theme="dark"] .demo-top > span:last-child { border-color: #ffffff16; }
[data-theme="dark"] .demo-symbol { border-color: #514037; background: linear-gradient(#3a302b,#282329); }
[data-theme="dark"] .demo-question { background: #292e39; border-color: #363d4a; color: #c8ced9; }
[data-theme="dark"] .answer-list li > span { border-color: #3a414d; background: #292e38; color: #b6bfce; }
[data-theme="dark"] .source-chips span { border-color: #3b4250; }
[data-theme="dark"] .demo-bottom { border-color: #343a45; }
[data-theme="dark"] .step-number { color: #b3bdcc; }
[data-theme="dark"] .step:first-child .step-number { color: #f9a184; }
[data-theme="dark"] .step-tag { color: #b3bdcc; border-color: #3b414e; }
[data-theme="dark"] .step:first-child .step-tag { color: #f9a184; border-color: #634438; background: #382820; }
[data-theme="dark"] .step-detail { border-color: #ffffff10; }
[data-theme="dark"] .step-detail strong { color: #c9cfda; }
[data-theme="dark"] .hub-section { background: radial-gradient(ellipse at 75% 50%,#2c303b80,transparent 65%),#191b23; border-color: #343844; }
[data-theme="dark"] .faq-list summary > span { background: #2c303c; color: #c2cad7; }
[data-theme="dark"] .faq-list details[open] summary > span { background: var(--accent-soft); color: var(--accent-text); }
[data-theme="dark"] .start-section { background: radial-gradient(ellipse at 90% 0,#713b2b65,transparent 60%),#211a1a; border-color: #5d3e34; }
[data-theme="dark"] .start-copy :is(.section-label,.section-label > span) { color: #e2a992; }
[data-theme="dark"] .start-copy h2 > span { color: #f69b7c; }
[data-theme="dark"] .start-copy > p:not(.section-label):not(.trial-caption) { color: #d2b8ad; }
[data-theme="dark"] :is(.trial-facts,.trial-caption,.contact-note) { color: #caa995; }
[data-theme="dark"] .trial-facts span { border-color: #785039; background: #ffffff04; }
[data-theme="dark"] .contact-card { background: #282528; border-color: #ffffff12; }
[data-theme="dark"] .channel-icon { background: #373135; border-color: #4c4144; color: #dcc9c4; }
[data-theme="dark"] .channel-heading p { color: #b9aba9; }
[data-theme="dark"] .contact-actions { color: #b9aba9; }
[data-theme="dark"] .contact-actions a { color: #e1d7d4; }
[data-theme="dark"] .contact-actions a:hover { color: var(--accent-text); }
[data-theme="dark"] .qr-preview { border-color: #ffffff30; }
[data-theme="dark"] .qr-dialog { background: #1e2129; border-color: #454b59; }
[data-theme="dark"] .dialog-close { background: #2c313d; border-color: #3f4654; color: #bec6d4; }
[data-theme="dark"] .dialog-qr { border-color: #ffffff33; }
[data-theme="dark"] .closing-line > a { background: #252a34; border-color: #3a4351; color: #c2cbd9; }
[data-theme="dark"] .mobile-nav { background: #1e222bf5; border-color: #414754; }

/* Desktop narrative: a large introduction gathers into a stable scene stage. */
.scene-stage { position: relative; }
.scene-scroll-hint { display: none; }
.scene-section.is-scroll-scene { position: relative; height: var(--scene-runway); padding-block: 0; margin-block: 96px 100px; }
.is-scroll-scene .scene-stage { position: sticky; top: var(--scene-top,136px); padding-block: 14px; }
.is-scroll-scene .scene-intro { position: relative; transform: translateY(calc(160px - var(--scene-compact,1) * 160px)); transform-origin: left center; will-change: transform; }
.is-scroll-scene .scene-intro .section-label { margin-bottom: 10px; font-size: .8125rem; }
.is-scroll-scene .scene-intro h2 { width: fit-content; max-width: calc(100% / 1.85); font-size: 1.875rem; line-height: 1.3; margin: 0; letter-spacing: -.025em; transform: scale(calc(1.85 - var(--scene-compact,1) * .85)); transform-origin: left top; will-change: transform; }
.is-scroll-scene .scene-intro .section-lead { position: absolute; left: 0; top: 190px; max-width: 640px; margin: 0; opacity: calc(1 - var(--scene-compact,1) * 2); pointer-events: none; }
.is-scroll-scene .scene-scroll-hint { display: flex; align-items: center; gap: 9px; position: absolute; left: 0; top: 260px; color: var(--muted); font-size: var(--text-meta); opacity: calc(1 - var(--scene-compact,1) * 2); }
.is-scroll-scene .scene-deck { opacity: var(--scene-content,1); transform: translateY(calc(24px - var(--scene-content,1) * 24px)); will-change: transform, opacity; }
.is-scroll-scene .scenario-tabs { margin-top: 20px; }
.is-scroll-scene .scenario-tabs button { padding-block: 15px; }
.is-scroll-scene .scenario-tabs button::after { transform: scaleX(calc(.12 + var(--tab-progress,0) * .88)); }
.is-scroll-scene .scenario-panel { min-height: 0; padding: 24px 0; margin-top: 14px; gap: 48px; grid-template-columns: .8fr 1.2fr; }
.is-scroll-scene .scenario-copy h3 { font-size: 1.75rem; margin-block: 15px; }
.is-scroll-scene .scenario-copy p { line-height: 1.8; }
.is-scroll-scene .check-list { margin-block: 16px 12px; }
.is-scroll-scene .demo-top { padding: 12px 20px; }
.is-scroll-scene .demo-body { padding: 17px 20px; }
.is-scroll-scene .demo-question { margin-bottom: 16px; padding: 10px 16px; }
.is-scroll-scene .demo-answer { padding: 18px 20px; }
.is-scroll-scene .demo-answer h4 { margin-block: 7px 13px; }
.is-scroll-scene .answer-list { gap: 10px; }
.is-scroll-scene .source-chips { margin-top: 16px; }
.is-scroll-scene .demo-bottom { padding-block: 10px; }
.is-scroll-scene .possibilities-foot { margin-top: 14px; font-size: .75rem; }
.motion-ready [data-reveal-heading] { transform: translateY(calc(56px - var(--heading-progress,1) * 56px)) scale(calc(.96 + var(--heading-progress,1) * .04)); transform-origin: left center; opacity: var(--heading-progress,1); }
.motion-ready .start-copy [data-reveal-heading] { transform-origin: center; }
@media (max-width:1100px) { .site-header { gap: 12px; } .site-header nav a { padding-inline: 11px; } }
/* Keep all four page links readable on compact desktop widths. */
@media (min-width:701px) and (max-width:900px) {
  .site-header .header-cta { display: none; }
  .site-header nav { margin-left: auto; margin-right: 0; }
  .site-header nav a { padding-inline: 9px; white-space: nowrap; }
}
@media (max-width:700px) {
  .theme-toggle { margin-left: auto; width: 38px; height: 38px; }
  .header-cta { margin-left: 0; }
  .menu-toggle { min-width: 32px; padding: 4px; }
  .motion-ready [data-reveal-heading] { transform: translateY(calc(36px - var(--heading-progress,1) * 36px)); }
}
@media (max-width:480px) {
  .site-header { padding-right: 14px; gap: 12px; }
  .header-cta { display: none; }
  .menu-toggle { min-width: 36px; min-height: 42px; }
}
@media (prefers-reduced-motion:reduce) {
  body, .theme-toggle .icon { transition: none; }
  .motion-ready [data-reveal-heading] { opacity: 1; transform: none; }
}

.scene-panels { display: grid; }
/* Content regions take turns handing over while the window stays stationary.
   The outgoing shell stays opaque until the incoming content has fully arrived. */
.scene-panels.is-layered > .scenario-panel { position: relative; grid-area: 1 / 1; align-self: stretch; z-index: 0; visibility: hidden; pointer-events: none; }
.scene-panels.is-layered > .scenario-panel.is-active { z-index: 2; visibility: visible; pointer-events: auto; }
.scene-panels.is-layered > .scenario-panel.is-outgoing { z-index: 1; visibility: visible; pointer-events: none; }
.scene-panels.is-layered .scenario-copy { min-height: var(--scene-copy-height,0px); }
.scene-panels.is-layered .demo-top > span:first-child { min-height: var(--scene-label-height,0px); }
.scene-panels.is-layered .demo { min-height: var(--scene-demo-height,0px); display: flex; flex-direction: column; }
.scene-panels.is-layered .demo-body { flex: 1; min-height: var(--scene-body-height,0px); }
.scene-panels.is-layered .demo-footer-content { min-height: var(--scene-footer-height,0px); }
.scene-panels.is-layered .is-entering .demo { background: transparent; border-color: transparent; box-shadow: none; }
.scene-panels.is-layered .is-entering :is(.demo-top,.demo-bottom) { background: transparent; border-color: transparent; }
.scene-panels.is-layered .is-entering .demo-top > span:last-child { visibility: hidden; }
.hero-bottom a .icon { padding: 8px; }
[data-theme="dark"] .skip-link { background: #fba68e; color: #17191e; }
@media (max-width:700px) { .hero-bottom a .icon { padding: 6px; } }
/* Keep the pinned example legible within a laptop-height viewport. */
.is-scroll-scene .demo-top { padding: 9px 18px; }
.is-scroll-scene .demo-body { padding: 14px 18px; }
.is-scroll-scene .demo-answer { padding: 8px 0; }
.is-scroll-scene .answer-label { display: block; line-height: 1.5; }
.is-scroll-scene .answer-list li { align-items: center; }
.is-scroll-scene .answer-list li > div { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex: 1; min-width: 0; }
.is-scroll-scene .answer-list strong { flex-shrink: 0; }
.is-scroll-scene .answer-list small { max-width: 64%; margin: 0; font-size: .8125rem; line-height: 1.65; }
.is-scroll-scene .demo-bottom { padding-block: 7px; }

/* The first screen has its own entrance, followed by a gentle scroll drift.
   Animate inner text and image clipping so scroll transforms stay independent. */
.hero.is-armed .hero-copy { transform: translateY(calc(var(--hero-scroll,0) * -22px)); }
.hero.is-armed .hero-art { transform: translateY(calc(var(--hero-scroll,0) * -32px)); opacity: 0; clip-path: inset(8% 12% round 48px); }
.hero.is-armed .hero-object { transform: scale(calc(1 + var(--hero-scroll,0) * .045)); }
.hero.is-armed .hero-line-inner { opacity: 0; transform: translateY(115%); }
.hero.is-armed :is(.eyebrow,.hero-description,.hero-actions,.hero-note) { opacity: 0; }
.hero.is-entered .hero-line-inner { animation: hero-line-in 1.15s var(--ease) .12s both; }
.hero.is-entered .hero-line:nth-child(2) .hero-line-inner { animation-delay: .27s; }
.hero.is-entered :is(.eyebrow,.hero-description,.hero-actions,.hero-note) { animation: hero-copy-in 1s var(--ease) both; }
.hero.is-entered .hero-description { animation-delay: .4s; }
.hero.is-entered .hero-actions { animation-delay: .54s; }
.hero.is-entered .hero-note { animation-delay: .66s; }
.hero.is-entered .hero-art { animation: hero-art-in 1.4s var(--ease) .1s both; }
@keyframes hero-line-in { from { opacity: 0; transform: translateY(115%); } to { opacity: 1; transform: translateY(0); } }
@keyframes hero-copy-in { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: translateY(0); } }
@keyframes hero-art-in { from { opacity: 0; clip-path: inset(8% 12% round 48px); } to { opacity: 1; clip-path: inset(0 round 40px); } }
@media (max-width:900px) {
  .hub-copy [data-reveal-heading], .start-copy [data-reveal-heading] { transform-origin: center; }
}
@media (prefers-reduced-motion:reduce) {
  .hero.is-armed :is(.hero-copy,.hero-art,.hero-object,.hero-line-inner,.eyebrow,.hero-description,.hero-actions,.hero-note) { opacity: 1; transform: none; clip-path: none; }
  .motion-ready [data-reveal-heading] { opacity: 1; transform: none; }
}

/* 02 — a service journey: the rail draws, numbers turn into place, then each
   step unfolds from its label to the concrete outcome. Layout never moves. */
.steps { position: relative; }
.steps::before { content: ""; position: absolute; top: -1px; left: 0; right: 0; height: 2px; border-radius: 2px; background: linear-gradient(90deg,var(--accent),var(--accent) 78%,transparent); transform: scaleX(0); transform-origin: left; pointer-events: none; }
.step { --step-delay: 0ms; }
.step:nth-child(2) { --step-delay: 170ms; }
.step:nth-child(3) { --step-delay: 340ms; }
.motion-ready .steps.is-revealed::before { animation: journey-rail 1.55s var(--ease) both; }
.motion-ready .step.motion-unit:not(.is-revealed) :is(.step-top,h3,p,.step-detail) { opacity: 0; }
.motion-ready .step.is-revealed .step-top { animation: content-rise .75s var(--ease) var(--step-delay) both; }
.motion-ready .step.is-revealed .step-number { transform-origin: left center; animation: number-turn .9s var(--ease) var(--step-delay) both; }
.motion-ready .step.is-revealed h3 { animation: content-rise .85s var(--ease) calc(var(--step-delay) + 100ms) both; }
.motion-ready .step.is-revealed p { animation: content-rise .9s var(--ease) calc(var(--step-delay) + 190ms) both; }
.motion-ready .step.is-revealed .step-detail { animation: outcome-reveal .9s var(--ease) calc(var(--step-delay) + 310ms) both; }
@keyframes journey-rail { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes content-rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: translateY(0); } }
@keyframes number-turn { from { opacity: 0; transform: perspective(600px) rotateX(-65deg) translateY(16px); } to { opacity: 1; transform: perspective(600px) rotateX(0) translateY(0); } }
@keyframes outcome-reveal { from { opacity: 0; clip-path: inset(0 100% 0 0); } to { opacity: 1; clip-path: inset(0); } }

/* 03 — the diagram explains its own flow, from a team to the control plane,
   then to the three agents. Its frame remains completely still. */
.motion-ready .hub-diagram.motion-unit:not(.is-revealed) :is(.diagram-top,.hub-node,.agent-nodes > div,.diagram-note) { opacity: 0; }
.motion-ready .hub-diagram.motion-unit:not(.is-revealed) :is(.connector-line,.branch-lines) { clip-path: inset(0 0 100%); }
.motion-ready .hub-diagram.is-revealed .diagram-top { animation: diagram-node-in .6s var(--ease) both; }
.motion-ready .hub-diagram.is-revealed .connector-line { animation: connection-down .4s var(--ease) .25s both; }
.motion-ready .hub-diagram.is-revealed .hub-node { animation: diagram-node-in .65s var(--ease) .43s both, hub-activate 1.3s ease .43s both; }
.motion-ready .hub-diagram.is-revealed .branch-lines { animation: connection-down .45s var(--ease) .78s both; }
.motion-ready .hub-diagram.is-revealed .branch-lines::after { transform-origin: center top; animation: branch-open .5s var(--ease) .82s both; }
.motion-ready .hub-diagram.is-revealed .agent-nodes > div { animation: diagram-node-in .65s var(--ease) .98s both; }
.motion-ready .hub-diagram.is-revealed .agent-nodes > div:nth-child(2) { animation-delay: 1.1s; }
.motion-ready .hub-diagram.is-revealed .agent-nodes > div:nth-child(3) { animation-delay: 1.22s; }
.motion-ready .hub-diagram.is-revealed .diagram-note { animation: content-rise .7s var(--ease) 1.4s both; }
.motion-ready .hub-copy.motion-unit:not(.is-revealed) > p:not(.section-label), .motion-ready .hub-copy.motion-unit:not(.is-revealed) .hub-points span { opacity: 0; }
.motion-ready .hub-copy.is-revealed > p:not(.section-label) { animation: content-rise .8s var(--ease) .1s both; }
.motion-ready .hub-copy.is-revealed .hub-points span { animation: token-in .65s var(--ease) .3s both; }
.motion-ready .hub-copy.is-revealed .hub-points span:nth-child(2) { animation-delay: .42s; }
.motion-ready .hub-copy.is-revealed .hub-points span:nth-child(3) { animation-delay: .54s; }
.motion-ready .hub-principle.motion-unit:not(.is-revealed) { opacity: 0; }
.motion-ready .hub-principle.is-revealed { animation: content-rise .85s var(--ease) var(--principle-delay) both; }
@keyframes diagram-node-in { from { opacity: 0; transform: translateY(18px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes connection-down { from { clip-path: inset(0 0 100%); } to { clip-path: inset(0); } }
@keyframes branch-open { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes hub-activate { 0%,100% { border-color: #6c7080; box-shadow: 0 3px 8px #00000017,0 0 30px #edf1ff04,inset 0 1px 0 #ffffff0f; } 40% { border-color: #f69b7c; box-shadow: 0 0 30px #f0785724,inset 0 0 16px #f0785710; } }
@keyframes token-in { from { opacity: 0; transform: translateY(12px) scale(.88); } to { opacity: 1; transform: translateY(0) scale(1); } }

/* 04 — independent question rows arrive with a short horizontal reveal.
   Opening an answer keeps native details behavior and adds a softer entrance. */
.faq-list details { position: relative; --question-delay: 0s; }
.faq-list details::after { content: ""; position: absolute; bottom: -1px; left: 0; width: 100%; height: 1px; background: var(--accent); transform-origin: left; opacity: 0; pointer-events: none; }
.motion-ready .faq-list details.motion-unit:not(.is-revealed) { opacity: 0; translate: 24px 0; }
.motion-ready .faq-list details.is-revealed { animation: question-in .75s var(--ease) var(--question-delay) both; }
.motion-ready .faq-list details.is-revealed::after { animation: question-rule .95s var(--ease) var(--question-delay) both; }
.faq-list details:nth-child(2) { --question-delay: .07s; }
.faq-list details:nth-child(3) { --question-delay: .14s; }
.faq-list details:nth-child(4) { --question-delay: .21s; }
.faq-list details:nth-child(5) { --question-delay: .28s; }
.faq-list details:nth-child(6) { --question-delay: .35s; }
.motion-ready .faq-list details[open] p { animation: answer-in .38s var(--ease) both; }
/* Progressive enhancement: unsupported browsers keep the native disclosure. */
@supports (interpolate-size: allow-keywords) and selector(details::details-content) {
  .faq-list details { interpolate-size: allow-keywords; }
  /* Keep paragraph margins inside the animated box, including its auto-height
     endpoint; overflow: clip alone lets the final margin escape at that point. */
  .faq-list details::details-content { display: flow-root; block-size: 0; overflow: clip; }
  .faq-list details[open]::details-content { block-size: auto; }
  @media (prefers-reduced-motion: no-preference) {
    .faq-list details::details-content { transition: block-size .48s var(--ease), content-visibility .48s allow-discrete; }
    .faq-list summary { transition: padding-bottom .48s var(--ease); }
  }
}
@keyframes question-in { from { opacity: 0; translate: 24px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes question-rule { 0% { opacity: .6; transform: scaleX(0); } 65% { opacity: .4; transform: scaleX(1); } 100% { opacity: 0; transform: scaleX(1); } }
@keyframes answer-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* A closing invitation: two contact cards settle from opposite sides. Using
   independent translate/rotate keeps the existing hover movement intact. */
.contact-card { --contact-direction: -1; }
.contact-card:nth-child(2) { --contact-direction: 1; }
.motion-ready .contact-card.motion-unit:not(.is-revealed) { opacity: 0; }
.motion-ready .contact-card.is-revealed { animation: contact-settle .95s var(--ease) both; }
.motion-ready .contact-card:nth-child(2).is-revealed { animation-delay: .12s; }
.motion-ready .contact-note.motion-unit:not(.is-revealed) { opacity: 0; }
.motion-ready .contact-note.is-revealed { animation: content-rise .7s var(--ease) .3s both; }
.motion-ready .start-copy.motion-unit:not(.is-revealed) > p:not(.section-label), .motion-ready .start-copy.motion-unit:not(.is-revealed) .trial-facts span { opacity: 0; }
.motion-ready .start-copy.is-revealed > p:not(.section-label) { animation: content-rise .8s var(--ease) .12s both; }
.motion-ready .start-copy.is-revealed .trial-facts span { animation: token-in .7s var(--ease) .28s both; }
.motion-ready .start-copy.is-revealed .trial-facts span:nth-child(2) { animation-delay: .4s; }
.motion-ready .start-copy.is-revealed .trial-facts span:nth-child(3) { animation-delay: .52s; }
.start-copy h2 > span { position: relative; display: inline-block; }
.start-copy h2 > span::after { content: ""; position: absolute; left: 1%; right: 1%; bottom: -.09em; height: 2px; border-radius: 50%; background: currentColor; opacity: .35; transform-origin: left; }
.motion-ready .start-copy.motion-unit:not(.is-revealed) h2 > span::after { transform: scaleX(0); }
.motion-ready .start-copy.is-revealed h2 > span::after { animation: journey-rail 1s var(--ease) .3s both; }
@keyframes contact-settle { from { opacity: 0; translate: calc(var(--contact-direction) * 32px) 42px; rotate: calc(var(--contact-direction) * 3deg); } to { opacity: 1; translate: 0 0; rotate: 0deg; } }
.motion-ready :is(.contact-card,.faq-list details).motion-complete { animation: none; opacity: 1; translate: 0 0; rotate: 0deg; }
.motion-ready .faq-list details.motion-complete::after { animation: none; opacity: 0; }
@media (max-width:700px) {
  .step:nth-child(n) { --step-delay: 0ms; }
  .faq-list details:nth-child(n) { --question-delay: 0s; }
}

.filing{text-align:center;font-size:12px;padding:0 24px 28px;color:var(--muted);margin:0}.filing a{color:inherit;text-decoration:none}.filing a:focus-visible{outline:2px solid currentColor;outline-offset:4px}
