/* Brand fidelity: sampled from the public Servant AI page on October 15, 2026.
   Original tokens: --bone #f5f1ea, --ink #0b0b0b, --red #f00000.
   Red is used for accents and outlines; normal text uses high-contrast ink. */
.header{background:rgba(245,241,234,.97)}
.hero h1 em,.pagehero h1 em{color:var(--ink)}
.hero h1{font-size:clamp(46px,5.8vw,80px);letter-spacing:-.065em}
.hero-line{display:block;white-space:nowrap}
.hero h1 em{font-family:Georgia,serif;font-weight:400;letter-spacing:-.055em}
.hero-period{display:none}
.hero-purpose{font-size:17px!important;max-width:460px!important;line-height:1.6}
.path-art{background:#eee9e1;border:1px solid #d3cdc4}
.waypoint{border-color:#ccc6bd;box-shadow:0 8px 30px #0b0b0b10}
.waypoint.two{border:1px solid #f00000;background:#0b0b0b;color:#f5f1ea}
.waypoint.two small{color:#c9c4bb}
.replay-motion{border:1px solid #ccc6bd;border-radius:50%;background:transparent;font-size:18px;line-height:1;width:34px;height:34px;display:inline-grid;place-content:center;margin-top:-10px;transition:background-color .2s}
.replay-motion:hover{background:#ded9d1}
.hero .art-header span:last-child{font-size:9px}
.hero-track{opacity:.9}
.btn.primary,.btn.red,.navlinks .nav-cta{background:#0b0b0b;color:#f5f1ea;border-color:#f00000}
.btn,.textlink,.stage-list a,.company-services a{transition:background-color .2s,color .2s,border-color .2s}
.btn.primary:hover,.btn.red:hover,.navlinks .nav-cta:hover{background:#222;border-color:#f00000}
.btn:not(.primary):not(.red):not(.nav-cta):hover{background:#e7e1d8}
.textlink:hover{color:#0b0b0b;text-decoration-color:#f00000;text-decoration-thickness:2px}
.route.featured{border-color:#f00000}
.route.featured .textlink:hover{color:#f5f1ea}
.route .number,.task-id,.stage-list small,.divider-strip span{color:#0b0b0b}
.route.featured .number{color:#c9c4bb}
.kinvia-copy .eyebrow:before{background:#f00000}
.kinvia-demo{background:#181818}
.online-dot{background:#f00000}
.status,.result-tag{color:#0b0b0b}
.helper-fab{border-color:#f00000}
.helper-fab span{color:#f00000}
.chat-prompts button:hover{border-color:#0b0b0b}
.chat-form button{border:1px solid #f00000}
.radio-option:has(input:checked){border-color:#0b0b0b;background:#e7e1d8}
.radio-option input{accent-color:#0b0b0b}
.result-box,.notice{border-left-color:#f00000}
.error{color:#a40000!important}
.note{background:#eee7df;color:#37322d}
.hero .waypoint strong{font-size:16px}

/* All automatic movement completes in under five seconds. Text never cycles,
   no interaction is blocked, and the content is usable without JavaScript. */
@media(prefers-reduced-motion:no-preference){
 .hero .eyebrow{animation:hero-reveal .65s both}
 .hero-line:nth-child(1){animation:hero-reveal .8s .08s both}
 .hero-line:nth-child(2){animation:hero-reveal .8s .2s both}
 .hero-line:nth-child(3){animation:hero-reveal .9s .32s both}
 .hero-purpose{animation:hero-reveal .8s .45s both}
 .hero .actions,.hero-copy>.fine{animation:hero-reveal .7s .6s both}
 .hero-trace{stroke-dasharray:1;stroke-dashoffset:0;animation:path-draw 3.5s .35s both}
 .hero .waypoint.one{animation:card-reveal .9s .5s both}
 .hero .waypoint.two{animation:card-reveal .9s 1.1s both}
 .hero .waypoint.three{animation:card-reveal .9s 1.7s both}
 .hero-marker{transform-box:fill-box;transform-origin:center}
 .hero .marker-one{animation:marker-arrive .65s 1.15s both}
 .hero .marker-two{animation:marker-arrive .65s 2s both}
 .pagehero>.eyebrow,.pagehero>.breadcrumb{animation:hero-reveal .65s both}
 .pagehero>h1{animation:hero-reveal .85s .1s both}
 .pagehero>p,.pagehero>.tool-row,.pagehero>.meta-row,.pagehero>.plan-summary{animation:hero-reveal .8s .25s both}
 .motion-reset *{animation:none!important}
}
@keyframes hero-reveal{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes card-reveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes path-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes marker-arrive{from{opacity:0;transform:scale(.35)}to{opacity:1;transform:scale(1)}}
@media(max-width:950px){.hero h1{font-size:clamp(40px,5.7vw,60px)}.hero-purpose{font-size:15px!important}}
@media(max-width:700px){.hero h1{font-size:clamp(39px,11vw,68px)}.hero-purpose{font-size:15px!important}.hero .waypoint strong{font-size:14px}.hero-line{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){
 .replay-motion{display:none}
 .hero *,.pagehero *{animation:none!important;transition:none!important;opacity:1;transform:none}
 .hero-trace{stroke-dasharray:none;stroke-dashoffset:0}
}
@media print{.hero *,.pagehero *{animation:none!important;opacity:1!important;transform:none!important}.replay-motion{display:none}}
