/* The existing hero, image, and layered composition remain the foundation. */
.ka-scope .kah-demo{padding:12px 0 0;min-width:0}
.kah-stage{position:relative;padding-right:18px;isolation:isolate}
.kah-stage:before{content:"";position:absolute;inset:12% -3% 5% 6%;z-index:-1;background:radial-gradient(ellipse,#b9d9c94d,transparent 68%);pointer-events:none}
.kah-demo .kah-site{position:relative;box-shadow:0 25px 60px #15384720;transform:none;transform-origin:50% 45%}
.kah-browser{min-height:37px}
.kah-address{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:.025em;min-width:0}
.kah-draft{flex-shrink:0;padding:2px 7px;background:#e4ebe2;border:1px solid #ccd9c7;border-radius:4px;font-size:8px;line-height:1.5;color:#365c42}
.kah-canvas{position:relative;background:#f2f0e9;overflow:hidden}
.kah-demo .kah-photo{min-height:300px}
.kah-demo .kah-photo>img{height:100%;transition:opacity .65s ease,transform 1s ease}
.kah-demo .kah-photo:after{background:linear-gradient(90deg,#142b20c4,transparent 110%);transition:opacity .6s ease}
.kah-demo .ka-site-photo-copy{position:relative;padding:34px 26px}
.kah-demo .ka-site-photo-copy>p{font-size:clamp(29px,2.55vw,39px)!important;line-height:1.08!important;margin:16px 0 17px!important}
.kah-demo .kah-home-copy{position:absolute;inset:0;opacity:0;transition:opacity .35s ease}
.kah-event-copy{min-height:300px;transition:opacity .4s ease}
.kah-event-date{font-size:11px;letter-spacing:.03em;margin-bottom:17px;line-height:1.5}
.kah-event-date>span{opacity:.7;margin:0 5px}
.kah-demo .ka-site-pill{font-size:10px;background:#f8f5e9;color:#234031;border-color:#f8f5e9;padding:8px 13px}
.kah-reveal-title,.kah-reveal-details{transition:opacity .55s ease,transform .55s ease}
.kah-demo .kah-page-details{position:relative;display:block;min-height:106px;padding:20px 26px 35px}
.kah-home-details{position:absolute;left:26px;right:26px;top:22px;display:flex;justify-content:space-between;gap:12px;opacity:0;transition:opacity .3s ease}
.kah-event-details{transition:opacity .55s ease,transform .55s ease;max-width:55%}
.kah-event-details>span{display:block;font-size:7px;letter-spacing:.13em;margin-bottom:9px;color:#6a7667}
.kah-event-details>strong{display:block;font:19px/1.13 Georgia,serif;color:#274533;font-weight:400}
.kah-build-note{position:absolute;bottom:10px;left:26px;font:8px/1.5 "Instrument Sans",sans-serif;letter-spacing:.025em;color:#66745f}
.kah-build-progress{height:3px;background:#dfe7dc}
.kah-build-progress>span{display:block;height:100%;width:100%;background:#639878;transform-origin:left;transform:scaleX(1)}
.kah-wireframe{position:absolute;inset:0;z-index:0;opacity:0;padding:49px 27px;background:linear-gradient(140deg,#ebece4,#f6f6ef);transition:opacity .4s ease}
.kah-wireframe>span{display:block;height:13px;width:31%;margin-bottom:18px;background:#d7dfd2;border-radius:4px}
.kah-wireframe>span:nth-child(2){width:72%;height:33px;margin-top:30px}
.kah-wireframe>span:nth-child(3){width:57%;height:33px}
.kah-wireframe>i{display:block;width:103px;height:29px;background:#d7dfd2;border-radius:18px;margin-top:33px}
.kah-chat{position:relative;z-index:2;width:360px;max-width:87%;margin:-100px -18px 0 auto;border:1px solid #d7e2dc;border-radius:16px;background:#fffffff5;box-shadow:0 16px 36px #1b3e2920;overflow:hidden;backdrop-filter:blur(12px)}
.kah-chat-header{display:flex;align-items:center;gap:9px;padding:12px 17px;border-bottom:1px solid #e9ede8;line-height:1.3}
.kah-chat-header .ka-agent-dot{width:9px;height:9px;min-width:9px;margin:0;box-shadow:0 0 0 4px #eaf2e9}
.kah-chat-header>strong{font-size:12px;font-weight:650;color:#243c35}
.kah-chat-state{margin-left:auto;font-size:9px;color:#4d6b59;white-space:nowrap}
.kah-human{margin:11px 15px 0 36px;padding:9px 13px;border:1px solid #dce6ee;background:#edf3f7;border-radius:11px 11px 3px 11px}
.kah-speaker{display:block;font-size:8px;line-height:1.2;letter-spacing:.12em;font-weight:650;color:#5e7988;margin-bottom:4px}
.kah-demo .kah-human p{min-height:38px;font-size:13px;line-height:1.45;letter-spacing:-.01em;color:#293c4b;margin:0}
.kah-caret{display:none;width:1.5px;height:1em;background:#2e6d89;vertical-align:-.12em;margin-left:2px}
.kah-agent-reply{display:flex;gap:9px;padding:12px 17px;min-height:62px}
.kah-agent-mark{display:flex;align-items:center;justify-content:center;flex:0 0 24px;height:24px;border-radius:8px;background:#e9f0e6;color:#526e45;font-size:19px;line-height:1;margin-top:1px}
.kah-agent-reply>div{position:relative;min-width:0;flex:1}
.kah-demo .kah-agent-reply p{font-size:12px;line-height:1.5;margin:0;color:#3f5347;min-height:36px;transition:opacity .3s ease}
.kah-thinking{position:absolute;top:9px;left:0;display:flex;gap:4px;opacity:0}
.kah-thinking i{display:block;width:4px;height:4px;border-radius:50%;background:#738b72}
.kah-chat-footer{display:flex;align-items:center;gap:7px;padding:8px 17px;border-top:1px solid #e7ede3;background:#f5f8f2;min-height:31px;font-size:9px;line-height:1.4;color:#53714c}
.kah-status-dot{width:5px;height:5px;background:#6b9159;border-radius:50%;flex-shrink:0}
.kah-playback{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:19px;padding-left:5px;min-height:38px}
.kah-step{color:#63746b;font-size:10px;font-weight:500}
.kah-step>span{color:#abb7ad;padding:0 6px}
.kah-buttons{display:flex;align-items:center;gap:4px}
.ka-scope .kah-buttons button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:57px;min-height:36px;padding:6px 9px;background:transparent;border:1px solid transparent;border-radius:7px;color:#46665b;font:500 10px/1.4 "Instrument Sans",sans-serif;box-shadow:none;cursor:pointer;white-space:nowrap;text-transform:none;letter-spacing:0}
.ka-scope .kah-buttons button:hover{background:#e6eee8;border-color:#d8e2db}
.ka-scope .kah-buttons button:disabled{color:#6e7f74;cursor:default;background:none;border-color:transparent}
.ka-scope .kah-demo>figcaption{position:static;display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;font-size:9px;line-height:1.6;text-align:left;color:#66766d;margin:8px 0 0;padding:0 5px}
.kah-demo>figcaption a{color:#466f5c;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.kah-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
/* Scene changes are driven by one visible, pausable timeline. */
.kah-demo .ka-site-nav>span{transition:opacity .45s ease}
.kah-demo[data-scene="blank"] .kah-site,.kah-demo[data-scene="blank"] .kah-canvas{background:#fff}
.kah-demo[data-scene="blank"] .ka-site-nav>span,.kah-demo[data-scene="blank"] .kah-event-copy,.kah-demo[data-scene="blank"] .kah-event-details{opacity:0}
.kah-demo[data-scene="blank"] .kah-photo>img,.kah-demo[data-scene="blank"] .kah-photo:after{opacity:0}
.kah-demo[data-scene="shell"] .kah-wireframe{opacity:1}
.kah-demo[data-scene="shell"] .kah-photo>img,.kah-demo[data-scene="shell"] .kah-photo:after{opacity:0;transform:scale(1.025)}
.kah-demo[data-scene="shell"] .kah-reveal-title,.kah-demo[data-scene="image"] .kah-reveal-title{opacity:0;transform:translateY(8px)}
.kah-demo:is([data-scene="shell"],[data-scene="image"],[data-scene="heading"]) .kah-reveal-details,.kah-demo:is([data-scene="shell"],[data-scene="image"],[data-scene="heading"]) .kah-event-details{opacity:0;transform:translateY(8px)}
.kah-demo[data-phase="request"] .kah-caret{display:inline-block;animation:kah-caret 1s steps(2,end) infinite}
.kah-demo:is([data-phase="request"],[data-phase="thinking"]) .kah-agent-reply p{opacity:0}
.kah-demo[data-phase="thinking"] .kah-thinking{opacity:1}
.kah-demo[data-phase="thinking"] .kah-thinking i{animation:kah-think 1s ease-in-out infinite}
.kah-demo[data-phase="thinking"] .kah-thinking i:nth-child(2){animation-delay:.13s}
.kah-demo[data-phase="thinking"] .kah-thinking i:nth-child(3){animation-delay:.26s}
.kah-demo[data-playback="paused"] *,.kah-demo[data-playback="waiting"] *{animation-play-state:paused!important}
@keyframes kah-caret{50%{opacity:0}}
@keyframes kah-think{50%{opacity:.35;transform:translateY(-2px)}}
@media(max-width:1100px) and (min-width:768px){
  .kah-stage{padding-right:10px}
  .kah-demo .kah-photo,.kah-event-copy{min-height:287px}
  .kah-demo .ka-site-photo-copy{padding:32px 20px}
  .kah-demo .ka-site-photo-copy>p{font-size:30px!important}
  .kah-demo .ka-site-nav{gap:8px;padding:17px 16px}
  .kah-demo .ka-site-nav>span{font-size:7px}
  .kah-chat{max-width:94%;margin-right:-10px;margin-top:-67px}
  .kah-demo .kah-page-details{padding-left:20px;min-height:113px}
  .kah-event-details>strong{font-size:17px}
  .kah-event-details{max-width:68%}
  .kah-build-note{left:20px}
}
@media(max-width:767px){
  .ka-scope .kah-demo{padding-bottom:0;margin:0 5px!important}
  .kah-stage{padding-right:0}
  .kah-demo .kah-site{transform:none}
  .kah-demo .kah-photo,.kah-event-copy{min-height:300px}
  .kah-demo .ka-site-photo-copy{padding:35px 23px}
  .kah-demo .ka-site-photo-copy>p{font-size:34px!important}
  .kah-demo .kah-page-details{min-height:130px;padding-left:23px}
  .kah-event-details{max-width:100%}
  .kah-build-note{left:23px}
  .kah-chat{width:360px;max-width:calc(100% - 12px);margin-top:-34px;margin-right:-3px}
  .kah-chat-header{padding:13px 14px}
  .kah-chat-header>strong{font-size:12px}
  .kah-chat-state{font-size:8px}
  .kah-human{margin-left:29px;margin-right:13px}
  .kah-demo .kah-human p{font-size:12px;min-height:35px}
  .kah-demo .kah-agent-reply p{font-size:11px;min-height:34px}
  .kah-agent-reply{padding:14px;min-height:71px}
  .kah-chat-footer{padding-inline:14px;font-size:8px}
  .kah-playback{margin-top:13px;gap:8px;padding-left:0}
  .kah-step{font-size:9px}
  .ka-scope .kah-buttons button{min-height:44px;min-width:52px;padding-inline:8px}
  .ka-scope .kah-demo>figcaption{padding:0;margin-top:3px;font-size:8px}
  .kah-browser{gap:8px;padding-inline:11px}
  .kah-address{font-size:7px}
}
@media(prefers-reduced-motion:reduce){
  .kah-demo *,.kah-demo *:before,.kah-demo *:after{animation:none!important;transition:none!important}
}
