/* Same approved material system. Clearer interactions, not a new art direction. */
.cycle-bar,.channel-playbar { display:flex; gap:20px; justify-content:space-between; align-items:center; margin:0 8px 20px; color:#617187; font-size:12px; line-height:1.5; }
.cycle-bar button,.channel-playbar button { border:1px solid #CED9E7; background:#FFF; border-radius:7px; padding:9px 12px; min-height:38px; color:#36577E; font-size:12px; flex:none; box-shadow:0 2px 4px #20334D0C; }
.cycle-bar button:hover,.channel-playbar button:hover { background:#EDF4FF; border-color:#8AAFE1; }
.cycle-bar button[aria-pressed=true] { background:#EEF3FB; }
.source-column { align-self:stretch; }
.source-document { min-height:315px; }
.native-sidebar { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.native-message time { margin-left:7px; font-size:12px; color:#6A7C94; font-weight:400; }
.understanding { min-height:415px; }
.clarification { min-height:205px; }
.clarification p { margin-top:0; }
.fact-list { transition:opacity .25s ease; }
.party-rail { gap:12px; padding:20px 0; }
.party-rail button { display:flex; align-items:center; gap:13px; padding:15px 18px; min-height:65px; width:100%; border:1px solid #DBE4F0; border-radius:10px; background:#FFF; font-weight:560; font-size:16px; color:#43546C; box-shadow:0 3px 6px #20334D08; }
.party-rail button::before,.party-rail button[aria-selected=true]::before { content:''; position:static; inset:auto; width:11px!important; height:11px; margin:0; background:var(--party-color,#245BE8); border-radius:4px; flex:0 0 11px; align-self:center; }
.party-rail button[data-party=agency] { --party-color:#245BE8; }
.party-rail button[data-party=client] { --party-color:#793F98; }
.party-rail button[data-party=venue] { --party-color:#D46232; }
.party-rail button[data-party=supplier] { --party-color:#147F91; }
.party-rail button[data-party=crew] { --party-color:#087E58; }
.party-rail button[aria-selected=true]::before { background:var(--party-color); }
.party-rail button:hover,.party-rail button[aria-selected=true] { background:#F1F6FF; border-color:var(--party-color); color:#202938; box-shadow:0 2px 5px #20334D12,0 12px 23px -14px #20334D48; }
.party-rail button[aria-selected=true]::after { content:'→'; margin-left:auto; color:var(--party-color); }
.linked-provenance { display:block; margin:23px 21px 0; font-size:11px; color:#617187; line-height:1.5; }
.field-note-label { color:#506785; font-size:12px; }
.flow-label { font-size:13px; color:#486285; margin-bottom:13px; }
.agent-read-call,.agent-notify-call { margin:16px 0; padding:12px; border:1px solid #D8E3F1; background:#F7FAFE; color:#466180; font-size:12px; line-height:1.6; border-radius:7px; }
.agent-user-notify { margin:15px 0 0 20px; padding:11px 13px; border-radius:12px 12px 3px 12px; background:#EDF2FA; font-size:13px; color:#354F72; }
.agent-followup { margin-top:16px; }
.agent-surface[data-flow-phase=call],.linked-item[data-flow-phase=read] { border-color:#7CA4D9; }
.agent-notify { width:100%; text-align:left; margin-top:13px; }
.agent-notify:disabled { opacity:.55; cursor:default; }
.agent-flow-status { max-width:690px; }
.linked-item,.agent-surface,.messages-card { min-height:390px; }
.k-mark { background:#713D8F; color:#FFF; border-color:#713D8F; }
.messages-card-header .contact-k { background:#245BE8; color:#FFF; border-color:#245BE8; }
.deep-stage { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:24px; padding-left:0; align-items:start; }
.deep-source { position:relative; top:auto; left:auto; grid-column:1/-1; width:450px; margin:0 0 -8px 15px; padding:19px 23px; }
.deep-plan { grid-column:1; min-width:0; }
.deep-plan .plan-body { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:24px; padding:22px 24px; }
.deep-plan .review-panel { min-height:0; margin-top:0; transform:none; }
.deep-plan .plan-row { min-height:72px; }
.deep-plan .plan-heading { padding:25px 24px 22px; }
.producer-channel { grid-column:2; min-width:0; margin-top:58px; color:#203047; border:1px solid #C5D2E2; border-radius:14px; background:#FFF; overflow:hidden; box-shadow:0 4px 8px #080E193F,0 30px 55px -8px #080E1960; }
.producer-channel header { display:flex; gap:12px; align-items:center; padding:17px 19px; background:#F6F9FE; border-bottom:1px solid #DFE7F1; font-size:13px; }
.producer-channel header strong { display:block; }
.producer-channel header small { display:block; font-size:11px; color:#617187; margin-top:4px; }
.producer-contact { flex-direction:column; align-items:flex-start!important; gap:4px!important; }
.producer-contact>span { font-size:11px; color:#617187; }
.producer-channel .avatar { background:#245BE8; color:#FFF; border-color:#245BE8; width:34px; height:34px; flex:none; }
.producer-message,.producer-reply,.producer-confirmation { margin:20px 17px 0; padding:13px 14px; border-radius:14px 14px 14px 3px; background:#EDF2F8; font-size:14px; line-height:1.6; }
.producer-reply { margin-left:39px; background:#007AFF; color:#FFF; border-radius:14px 14px 3px 14px; }
.producer-confirmation { background:#EEF2F7; border:1px solid #D6E0EB; }
.producer-provenance { display:block; margin:16px 19px; padding-top:14px; border-top:1px solid #E1E8F1; font-size:11px; color:#617187; line-height:1.5; }
.producer-compose { padding:15px 17px; }
.producer-compose>span { display:block; margin-bottom:12px; font-size:13px; line-height:1.6; color:#516981; }
.producer-waiting { padding:23px 19px; font-size:14px; line-height:1.6; color:#617187; }
.producer-compact { margin-top:20px; border:1px solid #667385; border-radius:10px; background:#F5F8FD; color:#203047; overflow:hidden; }
.producer-compact .producer-contact { display:flex; padding:15px 16px; background:#EDF2FA; border-bottom:1px solid #D6E1EF; font-size:13px; }
.producer-compact .producer-message { margin:14px 13px 0; font-size:13px; }
.producer-compact .producer-provenance { font-size:10px; margin:13px 16px; }
.producer-decision-state { margin:17px 0 10px; padding:12px 14px; border:1px solid #7891B25C; border-radius:7px; background:#5882B017; color:#D8E5F7; font-size:13px; line-height:1.6; }
.producer-approve { width:100%; border:1px solid #C6D8EC; background:#F5F9FF; color:#315B91; padding:11px 13px; border-radius:8px; font-size:13px; line-height:1.5; text-align:left; }
.producer-approve:hover { background:#E8F1FE; }
.producer-channel [hidden] { display:none!important; }
.change-controls,.deep-sms-line { padding-left:0; margin-left:0; }
.avatar { background:#713D8F; color:#FFF; border-color:#713D8F; }
.avatar.cool { background:#0B8492; color:#FFF; border-color:#0B8492; }
.team-person:nth-child(3) .avatar { background:#D76839; border-color:#D76839; }
.avatar.violet { background:#245BE8; color:#FFF; border-color:#245BE8; }
.closing { background:linear-gradient(180deg,#FFF,#F8FBFF); }
.closing .outcome-window { margin-top:0; }
.trust-layout { display:grid; grid-template-columns:1fr 1.75fr; gap:65px; margin:100px 8px; }
.trust h3 { font-size:30px; font-weight:550; line-height:1.2; letter-spacing:-1px; }
.faq { margin:0; }
.faq details { border-bottom:1px solid #DDE5EF; padding:0; }
.faq summary { padding:23px 0; font-size:19px; line-height:1.5; color:#27374D; }
.faq p { margin:0; padding:0 25px 24px 0; font-size:17px; line-height:1.7; color:#53677F; }
.faq summary::after { font-size:22px; }
.final { display:grid; grid-template-columns:1fr 1.12fr; gap:65px; padding:50px; margin-top:0; text-align:left; border:1px solid #D6E1EF; border-radius:18px; box-shadow:var(--shadow-product); }
.final h2 { font-size:42px; letter-spacing:-1.7px; }
.final .lead-intro>p { font-size:17px; line-height:1.7; color:#5B6E88; max-width:330px; margin:23px 0 0; }
.lead-fields { display:grid; grid-template-columns:1fr 1fr; gap:19px; }
.lead-form label { display:block; color:#33465F; font-size:13px; line-height:1.5; font-weight:550; }
.lead-form label>span { color:#778397; font-size:12px; font-weight:400; }
.lead-wide { grid-column:1/-1; }
.lead-form input,.lead-form textarea,.lead-form select { display:block; width:100%; border:1px solid #C9D6E7; border-radius:7px; padding:12px 13px; margin-top:8px; background:#FFF; color:#202938; font:inherit; font-size:15px; line-height:1.5; box-sizing:border-box; }
.lead-form input:focus,.lead-form textarea:focus,.lead-form select:focus { outline:2px solid #245BE82C; outline-offset:1px; border-color:#427DDD; }
.lead-form input[aria-invalid=true] { border-color:#B84032; }
.lead-form textarea { resize:vertical; min-height:95px; }
.lead-form>.primary { margin-top:25px; min-height:46px; }
.lead-form>.primary:disabled { opacity:.7; cursor:wait; }
.lead-honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.lead-feedback { font-size:15px!important; line-height:1.6; margin:16px 0 0!important; }
.lead-feedback[data-state=error] { color:#A33327; }
.lead-feedback[data-state=success] { color:#087E58; }
.lead-service-note { color:#6D7B8E; font-size:12px!important; line-height:1.6; margin:14px 0 0!important; }
/* Familiar Messages direction in every reusable fragment. Green remains evidence, not a bubble. */
.sms-reply:not(.sms-reply-control),.phoneFrame .sms-reply,.smsFragment .sms-reply,.messages-card .sms-reply:not(.sms-reply-control),.producer-reply,.source-document[data-source=sms] .native-sms-out { background:#007AFF; color:#FFF; box-shadow:0 1px 2px #007AFF14; }
.sms-bubble,.phoneFrame .sms-bubble,.smsFragment .sms-bubble,.messages-card .sms-bubble,.producer-message,.producer-confirmation,.source-document[data-source=sms] .native-message:not(.native-sms-out) { background:#EEF2F7; color:#263B53; }
.source-document[data-source=sms] .native-message:not(.native-sms-out) strong { color:#263B53; }
.source-document[data-source=sms] .native-sms-out strong { color:#FFF; }
.sms-reply-control { background:#F8FAFD!important; border-color:#C4D5EA; color:#365A88!important; }
.sms-reply-control:hover { background:#EDF4FF!important; }
.messages-card-header { background:#F8FAFD; }
.producer-contact,.phoneFrame .sms-contact { background:#F8FAFD; }
.phoneFrame .contact-k { background:#EEF2F7; color:#385D87; border-color:#D6E0EC; }
.sms-bubble,.sms-reply { animation:none; }

/* Content stays grounded while the authored conversation changes. */
.source-document,.understanding,.clarification,.projection,.agent-surface,.linked-item,.messages-card,.team-list,.producer-channel { transition:box-shadow .24s ease,border-color .24s ease; }
.agent-question,.agent-answer,.agent-read-call,.agent-user-notify,.agent-notify-call,.sms-bubble,.sms-reply,.producer-message,.producer-reply,.producer-confirmation { transition:opacity .24s ease,color .24s ease,background-color .24s ease; }
.phoneFrame { transition:box-shadow .24s ease,border-color .24s ease; }
.phoneFrame:hover { transform:none; }
.hero-plan .review-panel { min-height:412px; transform:none; }
.hero-stage,.hero-phone { transition:none; }
.agent-surface { min-height:590px; }
.messages-card { min-height:400px; }

/* Previous material rules used zero-side !important padding; this is actual form space. */
.closing .final { grid-template-columns:minmax(260px,400px) minmax(0,1fr); align-items:start; gap:clamp(48px,5vw,80px); padding:clamp(40px,4.4vw,64px)!important; }
.closing .lead-intro,.closing .lead-form { min-width:0; }
.closing .lead-intro { max-width:400px; }
.closing .lead-form { margin-top:0; }
.lead-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 24px; }
.lead-form label,.lead-form input,.lead-form textarea,.lead-form select { min-width:0; }
.lead-form>.primary { max-width:100%; white-space:normal; gap:16px; }
@media(hover:hover) and (pointer:fine) {
 .source-document:hover,.understanding:hover,.clarification:hover,.projection:hover,.agent-surface:hover,.linked-item:hover,.messages-card:hover,.team-list:hover { box-shadow:0 3px 6px #20334D17,0 24px 48px -12px #20334D35; }
 .producer-channel:hover { box-shadow:0 4px 8px #080E1945,0 32px 58px -10px #080E1970; }
 .party-rail button { transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease; }
}
/* Only the empty plan edge is overlapped; facts and evidence retain a clear reading lane. */
@media(min-width:1101px) {
 .signature .deep-stage { grid-template-columns:minmax(0,1fr) 310px; gap:0; padding:164px 0 0 58px; margin-top:0; }
 .signature .deep-source { position:absolute; inset:0 auto auto 0; width:350px; margin:0; padding:20px 23px; z-index:4; transform:none; }
 .signature .deep-plan { grid-column:1/-1; grid-row:1; margin-right:280px; z-index:1; }
 .signature .deep-plan .plan-body { grid-template-columns:minmax(0,1fr) 260px; padding:22px 74px 26px 24px; gap:24px; }
 .signature .deep-plan .review-panel { min-height:453px; }
 .signature .deep-plan .plan-heading { padding-right:74px; }
 .signature .deep-plan .revision-line { margin-right:74px; }
 .signature .producer-channel { grid-column:2; grid-row:1; width:330px; margin:110px 0 0 -20px; position:relative; z-index:3; }
}
@media(min-width:931px) and (max-width:1100px) {
 .signature .deep-stage { grid-template-columns:minmax(0,1fr) 260px; gap:0; padding:164px 0 0 36px; margin-top:0; }
 .signature .deep-source { position:absolute; inset:0 auto auto 0; width:330px; margin:0; padding:19px 21px; z-index:4; transform:none; }
 .signature .deep-plan { grid-column:1/-1; grid-row:1; margin-right:240px; z-index:1; }
 .signature .deep-plan .plan-body { display:grid; grid-template-columns:minmax(0,1fr) 220px; padding:20px 64px 24px 21px; gap:18px; }
 .signature .deep-plan .review-panel { margin-top:0; padding:15px; min-height:494px; }
 .signature .deep-plan .plan-heading { padding:25px 64px 20px 21px; }
 .signature .deep-plan .revision-line { margin-right:64px; margin-left:21px; }
 .signature .deep-plan .plan-row { grid-template-columns:58px minmax(0,1fr); gap:5px 10px; min-height:96px; }
 .signature .deep-plan .proposed-time,.signature .deep-plan .unchanged { grid-column:2; }
 .signature .deep-plan .unchanged:empty { display:none; }
 .signature .producer-channel { grid-column:2; grid-row:1; width:280px; margin:105px 0 0 -20px; position:relative; z-index:3; }
}
@media(max-width:1100px) {
 .deep-stage { grid-template-columns:minmax(0,1fr) 310px; gap:21px; }
 .deep-plan .plan-body { display:block; }
 .deep-plan .review-panel { margin-top:22px; }
 .deep-plan .plan-heading h3 { font-size:21px; }
 .deep-plan .plan-meta { font-size:12px; }
 .deep-plan .app-bar { font-size:11px; gap:9px; }
 .final { gap:35px; padding:35px; }
 .closing .final { grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr); gap:36px; padding:36px!important; }
}
@media(min-width:741px) and (max-width:930px) {
 .signature .deep-stage { display:block; padding:0; margin-top:0; }
 .signature .deep-source { position:relative; inset:auto; width:330px; max-width:100%; margin:0 0 24px; transform:none; }
 .signature .deep-plan { margin-right:0; }
 .signature .deep-plan .review-panel { min-height:367px; }
 .signature .producer-channel { width:min(100%,420px); margin:24px 0 0 auto; }
}
@media(max-width:920px) {
 .closing .final { grid-template-columns:minmax(0,1fr); gap:30px; padding:32px!important; }
 .closing .lead-intro { max-width:none; }
}
@media(max-width:740px) {
 .hero-intro { margin-top:0; }
 .cycle-bar,.channel-playbar { margin:0 0 20px; gap:12px; align-items:flex-start; }
 .cycle-bar span { max-width:175px; }
 .channel-playbar { flex-direction:column; }
 .source-document,.understanding { min-height:0; }
 .understanding { margin-top:23px; }
 .clarification { min-height:0; }
 .party-rail { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; padding:0; overflow:visible; }
 .party-rail button { min-height:56px; padding:11px 10px; font-size:14px; gap:8px; }
 .party-rail button::before,.party-rail button[aria-selected=true]::before { position:static; inset:auto; width:8px!important; height:8px; flex-basis:8px; margin:0; border-radius:3px; }
 .party-rail button::after { display:none!important; }
 .linked-item,.agent-surface,.messages-card { min-height:0; }
 .linked-provenance { margin-left:18px; margin-right:18px; }
 .deep-stage { display:block; }
 .deep-source { width:auto; margin:0 0 23px; }
 .deep-plan .plan-body { padding:18px; }
 .deep-plan .plan-heading { padding:20px 18px; }
 .producer-channel { margin:26px 0 0; width:100%; }
 .producer-message,.producer-reply,.producer-confirmation { font-size:15px; }
 .trust-layout { display:block; margin:65px 0; }
 .trust h3 { font-size:28px; margin-bottom:22px; }
 .faq summary { font-size:18px; padding:21px 0; }
 .faq p { font-size:16px; }
 .final { display:block; padding:28px 20px; border-radius:13px; }
 .closing .final { padding:28px 20px!important; }
 .final h2 { font-size:33px; }
 .final .lead-intro>p { font-size:16px; margin-top:17px; }
 .lead-form { margin-top:28px; }
 .closing .lead-form { margin-top:28px; }
 .lead-fields { display:block; }
 .lead-form label { margin-top:17px; }
 .lead-form input,.lead-form textarea,.lead-form select { font-size:16px; }
 .hero-plan .review-panel,.signature .deep-plan .review-panel { min-height:424px; }
 .hero-plan .plan-row,.deep-plan .plan-row { min-height:96px; }
 .hero-plan .plan-heading,.deep-plan .plan-heading { display:grid; grid-template-columns:minmax(0,1fr) 68px; align-items:start; }
 .hero-plan .revision-line,.deep-plan .revision-line { display:grid; grid-template-columns:max-content minmax(0,1fr); align-items:center; }
 .hero-plan .revision-line>span,.deep-plan .revision-line>span { text-align:right; }
 .hero-phone .sms-chat { min-height:250px; }
 .agent-surface,.messages-card { min-height:0; }
}
@media(max-width:360px) {
 .hero-plan .review-panel,.signature .deep-plan .review-panel { min-height:480px; }
 .hero-phone .sms-chat { min-height:272px; }
}
@media(prefers-reduced-motion:reduce) { .fact-list,.source-document,.understanding,.clarification,.projection,.agent-surface,.linked-item,.messages-card,.team-list,.producer-channel,.agent-question,.agent-answer,.agent-read-call,.agent-user-notify,.agent-notify-call,.sms-bubble,.sms-reply,.producer-message,.producer-reply,.producer-confirmation,.phoneFrame,.party-rail button { transition:none; } }

/* The device stays mounted; only its conversation changes. */
.hero-phone { animation:none; }
.hero-cta { text-decoration:none; }
.device-recipient { display:block; margin-top:4px; color:#617187; font-size:10px; line-height:1.4; }
.device-waiting { padding:9px 2px; color:#5D708A; font-size:12px; line-height:1.65; }
.device-waiting strong { font-weight:550; color:#354D6B; }
.device-waiting p { margin:12px 0 0; }
.phoneFrame .sms-chat { overflow:auto; scrollbar-width:none; }
.phoneFrame .sms-chat::-webkit-scrollbar { display:none; }
.hero-plan .producer-decision-state { color:#365A88; border-color:#C4D7F0; background:#F1F6FD; }
.producer-typing { display:flex; align-items:center; gap:4px; width:max-content; margin:16px 0 0 auto; padding:10px 13px; background:#E9EFF6; border-radius:14px; }
.producer-typing i { width:4px; height:4px; border-radius:50%; background:#8091A7; animation:typingDot 1.4s ease-in-out infinite; }
.producer-typing i:nth-child(2) { animation-delay:.15s; }
.producer-typing i:nth-child(3) { animation-delay:.3s; }
.producer-channel .producer-typing { margin-right:18px; }
.change-steps>span { color:#A9B8CA; font-size:12px; padding:7px 0; border-bottom:1px solid transparent; transition:color .35s ease,border-color .35s ease; }
.change-steps>span.active { color:#E3EDF9; border-color:#83A9D8; }
.demo-pause { cursor:pointer; }
.demo-pause:disabled { cursor:default; opacity:.65; }
.supplier-expand:disabled { cursor:default; opacity:1; }
@keyframes typingDot { 0%,70%,100% { opacity:.35; } 35% { opacity:1; } }
@media(max-width:740px) {
 .device-recipient { font-size:12px; }
 .device-waiting { font-size:14px; }
 .change-steps { flex-wrap:wrap; gap:6px 14px; }
 .change-controls { align-items:flex-start; }
}
@media(prefers-reduced-motion:reduce) { .producer-typing i { animation:none; } }
