/* Motion is decorative; pause and reduced-motion preserve access to all content. */
body::before{background:radial-gradient(ellipse at 82% 8%,rgba(21,207,170,.19),transparent 40%),radial-gradient(ellipse at 8% 42%,rgba(34,126,233,.12),transparent 36%);animation:ambient-shift 16s ease-in-out infinite alternate}
.hero{position:relative;isolation:isolate}
.hero::before{content:"";position:absolute;z-index:-1;inset:8% -2%;background-image:radial-gradient(var(--line) .7px,transparent .7px);background-size:26px 26px;mask-image:radial-gradient(ellipse at 80% 40%,#000,transparent 65%);opacity:.5;pointer-events:none}
.hero h1 em{background:linear-gradient(105deg,var(--accent),var(--accent-2),var(--accent));background-size:220% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:title-light 9s ease-in-out infinite}
.preview-window{position:relative;border-color:color-mix(in srgb,var(--accent) 40%,var(--line));animation:window-arrival 1.1s cubic-bezier(.16,1,.3,1) both;box-shadow:0 28px 80px rgba(0,0,0,.32),0 0 80px color-mix(in srgb,var(--accent) 12%,transparent)}
.preview-toolbar{background:linear-gradient(110deg,var(--surface),var(--surface-2));position:relative}
.preview-toolbar::after{content:"";position:absolute;bottom:-1px;left:0;height:1px;width:40%;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:toolbar-ray 6s ease-in-out infinite}
.preview-caption{display:flex;align-items:center;gap:7px}
.preview-caption .live-dot{width:4px;height:4px}
.preview-chat{min-height:358px}
.preview-person{position:relative}
.preview-person .avatar{box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 5%,transparent)}
.live-replay{margin-left:auto;background:transparent;border:1px solid var(--line);border-radius:50%;height:27px;width:27px;font-size:17px;color:var(--muted);display:grid;place-items:center;flex-shrink:0;transition:color .2s,transform .4s}
.live-replay:hover{color:var(--accent);transform:rotate(-45deg)}
.preview-bubble{min-height:65px}
.preview-context{height:20px;gap:8px;display:flex;align-items:center}
.preview-response{min-height:130px;position:relative}
.preview-response p{min-height:64px}
.preview-delivery{min-height:15px}
.live-followup{margin-top:13px;border:1px solid var(--line);border-radius:8px 8px 8px 0;background:var(--surface-2);padding:10px 12px;font-size:11px;line-height:1.6}
.live-timeline{height:2px;background:var(--line)}
.live-timeline>span{display:block;width:100%;height:100%;transform-origin:left;background:linear-gradient(90deg,var(--accent-2),var(--accent))}
.live-disclaimer{font-size:8px;color:var(--muted);padding:10px 15px;text-align:center}
.preview-footer{gap:6px}
.preview-footer>span{transition:color .3s}
.preview-footer .is-current{color:var(--ink)}
.preview-footer .is-complete{color:var(--accent)}
.preview-proof{animation:proof-float 6s ease-in-out infinite}
.preview-proof>span{animation:proof-ring 4s ease-in-out infinite}
.context-orbit{width:11px;height:11px;border:1px solid var(--line);border-top-color:var(--accent);border-radius:50%;display:inline-block;animation:context-spin 1s linear infinite;flex-shrink:0}
.typing-dots{display:none;gap:4px;position:absolute;right:14px;top:17px}
.typing-dots i{width:4px;height:4px;background:var(--accent);border-radius:50%;animation:dot-type 1s infinite}
.typing-dots i:nth-child(2){animation-delay:.15s}.typing-dots i:nth-child(3){animation-delay:.3s}
.live-enabled .preview-bubble,.live-enabled .preview-response{animation:none}
.live-enabled .preview-context,.live-enabled .preview-response,.live-enabled .preview-delivery,.live-enabled .live-followup{transition:opacity .4s,transform .4s}
.product-preview[data-phase="0"] .preview-context,
.product-preview[data-phase="0"] .preview-response,.product-preview[data-phase="1"] .preview-response,
.product-preview[data-phase="0"] .preview-delivery,.product-preview[data-phase="1"] .preview-delivery,.product-preview[data-phase="2"] .preview-delivery,
.product-preview:not([data-phase="5"]) .live-followup{opacity:0;transform:translateY(6px);pointer-events:none}
.product-preview[data-phase="2"] .typing-dots{display:flex}
.product-preview[data-phase="2"] #live-answer::after{content:"";display:inline-block;height:1em;border-right:1px solid var(--accent);margin-left:2px;vertical-align:middle;animation:cursor-blink .8s steps(2) infinite}
.product-preview[data-phase="4"] .preview-response,.product-preview[data-phase="5"] .preview-response{border-color:color-mix(in srgb,var(--accent) 65%,var(--line))}
.product-preview[data-phase="3"] .preview-delivery{color:var(--accent)}
.product-preview[data-phase="4"] .context-orbit,.product-preview[data-phase="5"] .context-orbit{animation:none;background:var(--accent)}
.demo-journey{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:16px 25px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 70%,var(--bg))}
.demo-journey>span{font-size:10px;color:var(--muted);position:relative;padding-bottom:9px;border-bottom:2px solid var(--line);transition:color .3s,border-color .3s}
.demo-journey>.is-current{color:var(--ink);border-color:var(--accent);animation:stage-breathe 1.5s infinite}
.demo-journey>.is-complete{color:var(--accent);border-color:var(--accent)}
#demo-panel .incoming,#demo-panel .context-read,#reply-card{transition:opacity .4s,transform .4s}
#demo-panel.live-enabled .incoming,#demo-panel.live-enabled .context-read,#demo-panel.live-enabled .assistant-draft{animation:none}
#demo-panel[data-phase="0"] .context-read,#demo-panel[data-phase="0"] #reply-card,#demo-panel[data-phase="1"] #reply-card{opacity:0;transform:translateY(12px);pointer-events:none}
#demo-panel[data-phase="1"] .context-item{animation:context-highlight 1.8s ease both}
#demo-panel[data-phase="1"] .context-item:nth-child(4){animation-delay:.2s}
#demo-panel[data-phase="1"] .context-item:nth-child(5){animation-delay:.4s}
#demo-panel[data-phase="2"] #demo-answer::after{content:"";border-right:2px solid var(--accent);margin-left:2px;animation:cursor-blink .8s steps(2) infinite}
#demo-panel[data-phase="3"] .approve-button{animation:approve-glow 3s ease-in-out infinite}
#demo-panel[data-phase="4"] #reply-card{box-shadow:0 0 0 1px var(--accent),0 8px 40px color-mix(in srgb,var(--accent) 10%,transparent)}
#demo-answer{min-height:90px}
.light-card{position:relative;isolation:isolate}
.light-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;background:radial-gradient(350px circle at var(--light-x,50%) var(--light-y,0%),color-mix(in srgb,var(--accent) 9%,transparent),transparent 75%);opacity:0;transition:opacity .4s}
.light-card:hover::after{opacity:1}
.value-grid article{transition:transform .4s,border-color .4s,box-shadow .4s}
.value-grid article:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:0 16px 45px rgba(0,0,0,.12)}
.value-grid article a{transition:letter-spacing .3s}.value-grid article a:hover{letter-spacing:.025em}
.primary-button{position:relative;overflow:hidden}
.primary-button{background:linear-gradient(115deg,var(--accent),color-mix(in srgb,var(--accent) 60%,var(--accent-2)));box-shadow:0 6px 24px color-mix(in srgb,var(--accent) 18%,transparent)}
.preview-response{background:linear-gradient(125deg,var(--mint-soft),color-mix(in srgb,var(--mint-soft) 60%,var(--surface)));border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
.preview-proof{border-color:color-mix(in srgb,var(--accent) 25%,var(--line))}
.value-grid article{background:linear-gradient(145deg,var(--surface-2),var(--surface) 65%);border-top:2px solid color-mix(in srgb,var(--accent) 70%,var(--line))}
.value-grid article:nth-child(2){border-top-color:var(--accent-2)}
.value-grid article:nth-child(3){border-top-color:color-mix(in srgb,var(--accent-2) 65%,var(--accent))}
.benefit-icon{color:var(--accent);background:var(--mint-soft);border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));border-radius:8px;width:30px;height:30px;display:grid;place-items:center;flex-shrink:0}
.capability,.control-demo{background:linear-gradient(140deg,var(--surface-2),var(--surface) 55%)}
.hero-lead,.section-heading>p{color:var(--muted)}
.hero::after{content:"";position:absolute;inset:5% 0 5% 48%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,color-mix(in srgb,var(--accent) 16%,transparent),transparent 68%);filter:blur(35px)}
[data-theme=light] .preview-window{box-shadow:0 24px 65px rgba(21,74,112,.14)}
.primary-button::after{content:"";position:absolute;inset:-60% auto -60% -60%;width:35%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.27),transparent);transform:skewX(-22deg);animation:button-sheen 7s ease-in-out infinite;pointer-events:none}
.primary-button>span,.login-link>span{display:inline-block;transition:transform .25s}
.primary-button:hover>span,.login-link:hover>span{transform:translate(3px,-3px)}
.site-header nav a{position:relative}
.site-header nav a::after{content:"";position:absolute;left:0;bottom:-7px;width:100%;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.site-header nav a:hover::after{transform:scaleX(1)}
.memory-constellation::before{animation:memory-orbit 28s linear infinite}
.memory-constellation::after{animation:memory-orbit 35s linear infinite reverse}
.memory-constellation i{animation:memory-float 5s ease-in-out infinite alternate}
.memory-constellation i:nth-last-child(2){animation-delay:-2s}.memory-constellation i:last-child{animation-delay:-3s}
.memory-core{animation:core-breathe 5s ease-in-out infinite}
.steps article>b{transition:transform .4s}.steps article:hover>b{transform:rotate(-15deg) scale(1.15)}
.questions details[open] p{animation:enter .35s ease both}
.tone-message{animation:none}
.closing{background-size:130% 130%;animation:closing-glow 10s ease-in-out infinite alternate}
.motion-ready .reveal{transition-delay:var(--reveal-delay,0ms)}
@keyframes title-light{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes window-arrival{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
@keyframes toolbar-ray{0%,100%{transform:translateX(-100%);opacity:0}30%,70%{opacity:.8}90%{transform:translateX(250%);opacity:0}}
@keyframes proof-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes proof-ring{0%,100%{text-shadow:0 0 0 transparent}50%{text-shadow:0 0 15px var(--accent)}}
@keyframes context-spin{to{transform:rotate(360deg)}}
@keyframes dot-type{0%,70%,100%{transform:translateY(0);opacity:.4}35%{transform:translateY(-3px);opacity:1}}
@keyframes cursor-blink{50%{opacity:0}}
@keyframes stage-breathe{50%{border-color:var(--line)}}
@keyframes context-highlight{50%{background:var(--mint-soft);color:var(--accent)}}
@keyframes approve-glow{50%{box-shadow:0 0 22px color-mix(in srgb,var(--accent) 18%,transparent)}}
@keyframes button-sheen{0%,60%{left:-60%}90%,100%{left:145%}}
@keyframes memory-orbit{to{transform:rotate(360deg)}}
@keyframes memory-float{to{transform:translateY(-7px)}}
@keyframes core-breathe{50%{box-shadow:0 0 65px color-mix(in srgb,var(--accent) 15%,transparent)}}
@keyframes closing-glow{to{background-position:100% 100%}}
@media(max-width:720px){
 .preview-chat{min-height:385px}.preview-response{min-height:140px}.live-followup{font-size:12px}
 .demo-journey{grid-template-columns:1fr 1fr;padding:15px 18px;gap:12px}
 .demo-journey>span{font-size:9px}#demo-answer{min-height:100px}
 .preview-proof{margin-top:14px}.live-disclaimer{font-size:8px}
}
/* Readable type and full-size messaging, without scaling the page. */
.site-header nav,.login-link{font-size:16px}
.header-cta{font-size:15px}
.eyebrow,.section-number{font-size:12px}
.hero-lead,.section-heading>p{font-size:18px;line-height:1.7}
.primary-button,.secondary-button{font-size:15px;min-height:50px}
.testing-note{font-size:13px}
.benefits>div{font-size:15px;line-height:1.5;padding-inline:16px}
.benefit-icon{font-size:12px}
.value-grid article>span,.card-index{font-size:12px}
.value-grid h3{font-size:26px;line-height:1.22}
.value-grid p,.capability>p,.steps p,.control-copy>p,.questions details p,.closing>p{font-size:17px;line-height:1.7}
.value-grid a,.control-copy ul,.questions summary,.site-footer>div:last-child{font-size:15px}
.site-footer>div:first-child p{font-size:14px}
.scenario-tabs button,.tone-switch button{font-size:14px}
.queue-preview strong{font-size:15px}
.queue-preview small,.queue-preview b{font-size:13px}
.queue-preview>div{flex-wrap:wrap}
.preview-window{border-radius:22px;border-color:color-mix(in srgb,var(--line) 85%,var(--accent));box-shadow:0 28px 65px rgba(0,0,0,.24)}
.preview-toolbar{padding:18px 24px;background:var(--surface)}
.preview-brand{font-size:23px}.preview-brand b{font-size:15px}
.preview-caption{font-size:12px}
.preview-layout{grid-template-columns:minmax(0,1fr)}
.preview-chat{padding:0 24px 20px;min-height:0;background:radial-gradient(ellipse at 100% 70%,color-mix(in srgb,var(--accent) 5%,transparent),transparent 65%),var(--bg)}
.preview-person{padding:20px 0;margin-bottom:20px;border-bottom:1px solid var(--line)}
.preview-person .avatar{width:44px;height:44px;font-size:18px;background:linear-gradient(140deg,var(--accent),var(--accent-2));color:var(--accent-ink);box-shadow:none}
.preview-person strong{font-size:18px}.preview-person small{font-size:13px}
.live-replay{height:34px;width:34px;font-size:22px}
.preview-bubble{width:84%;max-width:none;padding:15px 18px;min-height:82px;font-size:16px;line-height:1.65;border-radius:17px 17px 17px 4px;background:var(--surface-2);border-color:transparent}
.preview-context{font-size:12px;height:20px;margin:18px 0;justify-content:center;color:var(--muted)}
.context-orbit{width:13px;height:13px}
.preview-response{width:90%;margin-left:auto;padding:16px 19px;min-height:155px;border-radius:17px 17px 4px 17px;border-color:color-mix(in srgb,var(--accent) 22%,var(--mint-soft));background:linear-gradient(130deg,var(--mint-soft),color-mix(in srgb,var(--mint-soft) 82%,var(--surface-2)))}
.preview-response small{font-size:11px;letter-spacing:.07em}
.preview-response p{font-size:16px;line-height:1.65;min-height:85px;margin-top:9px}
.typing-dots i{width:5px;height:5px}
.preview-delivery{font-size:12px;gap:8px;min-height:20px;justify-content:flex-end;margin-top:10px}
.preview-delivery>span:last-child{margin-left:6px}
.live-followup{font-size:15px;line-height:1.6;width:84%;padding:13px 17px;min-height:74px;border-radius:17px 17px 17px 4px;border-color:transparent;background:var(--surface-2)}
.preview-footer{padding:15px 20px;font-size:11px;background:var(--surface)}
.live-disclaimer{font-size:11px;line-height:1.5;padding:11px 18px}
.preview-proof{max-width:420px}
.preview-proof strong{font-size:15px}.preview-proof small{font-size:12px}
.demo-journey>span{font-size:12px}
.context-item strong{font-size:16px}.context-item small{font-size:12px}
.assistant-draft footer>span,.assistant-draft header b{font-size:14px}
.approve-button,.safe-draft button{font-size:15px}
.control-demo>header strong{font-size:16px}
.value-grid article{border-top-width:1px;border-top-color:var(--line);background:linear-gradient(145deg,var(--surface),var(--bg))}
.value-grid article:nth-child(2),.value-grid article:nth-child(3){border-top-color:var(--line)}
@media(min-width:981px){.hero{gap:38px;grid-template-columns:minmax(0,1fr) minmax(0,1.13fr);padding-block:48px}.hero-copy{align-self:center}}
@media(min-width:721px) and (max-width:1100px){.hero{grid-template-columns:1fr;max-width:760px}.hero-copy{max-width:650px}.hero-actions>*{width:auto}.product-preview{max-width:650px;width:100%;margin-inline:auto}}
@media(max-width:720px){
 .hero-lead,.section-heading>p{font-size:17px}.hero .eyebrow{font-size:11px}
 .hero-actions{flex-direction:column;align-items:stretch}.hero-actions>*{width:100%}
 .benefits>div{font-size:14px;min-height:66px;height:auto}
 .value-grid h3{font-size:25px}.value-grid p,.capability>p,.steps p,.control-copy>p,.questions details p{font-size:16px}
 .preview-toolbar{padding:15px 17px}.preview-brand b{font-size:14px}.preview-caption{font-size:10px}
 .preview-chat{padding:0 15px 16px}.preview-person{padding:16px 0}.preview-person small{font-size:11px}
 .preview-bubble{width:92%;min-height:106px;font-size:15px;padding:13px 15px}
 .preview-response{width:95%;min-height:218px;padding:14px 16px}.preview-response p{font-size:15px;min-height:150px}
 .preview-context{font-size:11px}.preview-delivery{font-size:11px}
 .live-followup{font-size:14px;width:92%;min-height:73px}
 .preview-footer{font-size:10px;padding:13px 14px;flex-wrap:wrap;gap:10px}
 .live-disclaimer{font-size:10px}.preview-proof strong{font-size:14px}.preview-proof small{font-size:12px}
 .demo-journey>span{font-size:11px}.queue-preview strong{font-size:14px}
 .questions summary{font-size:16px}.control-demo>header strong{font-size:15px}
}
.motion-off *,.motion-off *::before,.motion-off *::after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
