/* Homepage demonstrations keep their product forms instead of shared card shells. */
.product-story .home-email-demo__workspace { padding:0;background:transparent;border:0;border-radius:0; }
.product-story .home-email-demo__workspace-head { color:var(--story-text);padding:0 0 4px; }
.product-story .home-email-demo__workspace-head>span,.product-story .home-email-demo__brief>span { color:var(--story-secondary); }
.product-story .home-email-demo__brief p { color:var(--story-text); }
.product-story .home-email-demo__brief { margin-top:12px;column-gap:20px; }
.product-story .home-email-demo__progress { background:#2c3d59;margin:18px 0 22px; }
.product-story .home-email-demo__mail { width:calc(100% - 28px);margin-inline:auto;border-radius:12px;border:0;box-shadow:0 18px 32px -20px #0009; }
.product-story .home-email-demo__mail>header { background:#fff;border-bottom:1px solid #e2e9f3;padding-top:14px; }
.product-story .home-email-demo__address { background:#fff; }
.product-story .home-email-demo__mail>footer { background:#f7f9fc; }

/* A source asset and an inbox, with the original flying-message geometry. */
.product-story #rcs-product .wa-stage__scene { padding:0;background:transparent;border-radius:0;box-shadow:none;gap:24px; }
.product-story #rcs-product .wa-stage__asset>strong { color:var(--story-text); }
.product-story #rcs-product .wa-stage__asset>p { color:var(--story-secondary); }
.product-story #rcs-product .wa-stage__slot { background:#132640;border:1px solid #304461;border-radius:8px; }
.product-story #rcs-product .wa-stage__success { color:#a8e1c4; }
.product-story #rcs-product .wa-stage__asset .wa-stage__receipt>span { color:var(--story-secondary); }
.product-story #rcs-product .wa-stage__asset .wa-stage__receipt .active { color:#a8e1c4; }
.product-story #rcs-product .wa-stage__chat { background:#112039;border:1px solid #344a67;border-radius:12px; }
.product-story #rcs-product .wa-stage__chat header { color:#f3f7ff;background:transparent; }
.product-story #rcs-product .wa-stage__chat header span,.product-story #rcs-product .wa-stage__chat header b { color:#a5d9be; }
.product-story #rcs-product .wa-stage__chat main { background:transparent;padding:14px; }
.product-story #rcs-product .wa-stage__chat .wa-stage__message { border-radius:12px; }

/* Keep the receiver grouped; the sender remains a light, open control row. */
.product-story .voice-demo { color:var(--story-text); }
.product-story .voice-demo__sender { padding:14px 0 18px;background:transparent;border:0;border-bottom:1px solid #34445e;border-radius:0; }
.product-story .voice-demo__sender-head>span,.product-story .voice-demo__sender-body>div>span { color:var(--story-secondary); }
.product-story .voice-demo:is([data-phase=dispatch],[data-phase=incoming],[data-phase=connected],[data-phase=complete]) .voice-demo__sender-head>span { color:#b2cffc; }
.product-story .voice-demo__stage { padding:22px;background:#112039;border:1px solid #344a67;border-radius:12px;box-shadow:none; }
.product-story .voice-demo__receiver-head { margin:0 0 20px;padding:0 0 12px;border-radius:0;background:transparent;color:var(--story-secondary);border-bottom:1px solid #283b57; }
.product-story .voice-demo__identity p,.product-story .voice-demo__timer,.product-story .voice-demo__prompt p,.product-story .voice-demo__script p,.product-story .voice-demo__subtitle { color:var(--story-secondary); }
.product-story .voice-demo__call-state { color:#aadbc2; }
.product-story .voice-demo__avatar,.product-story .voice-demo__prompt-icon { background:#162b4a;color:#a7c8ff; }
.product-story .voice-demo__controlbar { border-color:#34445e; }
.product-story .voice-demo__language label { color:var(--story-secondary); }
.product-story .voice-demo__secondary button { color:#bad2fa; }
.product-story .voice-demo__secondary button:hover { background:#183254; }
.product-story .voice-demo__digits .is-read { color:#9dbfff; }
.product-story .voice-demo__digits .is-speaking { color:#e1ecff; }
.product-story .voice-demo__playback-result { color:#a8dfc2; }
.product-story .voice-demo__scene { min-height:222px; }
@media(max-width:700px){
 .product-story .home-email-demo__mail { width:calc(100% - 12px);margin-inline:auto; }
 .product-story #rcs-product .wa-stage__scene { gap:20px; }
 .product-story .voice-demo__sender-head strong { max-width:60%; }
}

/* Shared rectangular geometry across the homepage demos. Round controls stay round. */
.product-story { --demo-radius:12px; }
.product-story :is(.home-email-demo__mail,.home-email-demo__brief button,.home-email-demo__mail-action),
.product-story #rcs-product :is(.wa-stage__slot,.wa-stage__template,.wa-stage__chat,.wa-stage__message,.wa-stage__details,.wa-stage__asset>button,.wa-stage__detail-hero>img,.wa-stage__details>button),
.product-story .voice-demo :is(.voice-demo__stage,.voice-demo__sender-body button,.voice-demo__language select,.voice-demo__actions button) { border-radius:var(--demo-radius); }
.product-story #rcs-product .wa-stage__success svg { color:#145c3b;background:#d8f4e5;stroke-width:2.5;width:30px;height:30px;padding:6px; }
@media(max-width:600px){
 .product-story .voice-demo__stage { padding:18px; }
 .product-story #rcs-product .wa-stage__success svg { width:24px;height:24px;padding:4px; }
}
/* Demonstration actions are secondary to the solid product CTA. */
.product-story :is(.home-email-demo__brief button,.home-email-demo__mail-action),
.product-story #rcs-product :is(.wa-stage__asset>button,.wa-stage__chat main button,.wa-stage__details button),
.product-story .voice-demo :is([data-v-send],.voice-demo__actions button,.voice-demo__secondary button) {
 border:1px solid var(--demo-action-border,#7393bf);border-radius:12px;background:transparent;color:var(--demo-action-text,#c6dcff);box-shadow:none;transition:border-color .2s,background-color .2s,color .2s;
}
.product-story :is(.home-email-demo__brief button,.home-email-demo__mail-action):hover:not(:disabled),
.product-story #rcs-product :is(.wa-stage__asset>button,.wa-stage__chat main button,.wa-stage__details button):hover:not(:disabled),
.product-story .voice-demo :is([data-v-send],.voice-demo__actions button,.voice-demo__secondary button):hover:not(:disabled) {
 border-color:var(--demo-action-hover-border,#b1cefa);background:var(--demo-action-hover,#182e4c);color:var(--demo-action-text,#c6dcff);
}
.product-story .home-email-demo__mail-action,
.product-story #rcs-product :is(.wa-stage__message button,.wa-stage__quick button,.wa-stage__details button) {
 --demo-action-border:#6d8bb4;--demo-action-text:#24548c;--demo-action-hover-border:#365e94;--demo-action-hover:#e8f0fd;
}
/* Preserve scale and flying-card motion while overriding its old fill tween. */
.product-story #rcs-product :is(.wa-stage__message button,.wa-stage__details button) { background-color:transparent!important; }
.product-story #rcs-product :is(.wa-stage__message button,.wa-stage__details button):hover { background-color:var(--demo-action-hover)!important; }
.product-story #rcs-product .wa-stage__message>button { width:calc(100% - 16px);margin:6px 8px;border-radius:12px; }
.product-story #rcs-product .wa-stage__template>span { margin:5px 6px;border:1px solid #6d8bb4;border-radius:12px;color:#24548c; }
.product-story .voice-demo .voice-demo__secondary button { padding:8px 10px;min-height:36px; }
.product-story .voice-demo [data-v-answer] { --demo-action-border:#679c85;--demo-action-text:#b1e2ca;--demo-action-hover-border:#b1e2ca;--demo-action-hover:#173b32; }
.product-story .voice-demo [data-v-hang] { --demo-action-border:#b47d8b;--demo-action-text:#ffc2cd;--demo-action-hover-border:#ffc2cd;--demo-action-hover:#3c2436; }
.product-story .home-email-demo__brief button:disabled,
.product-story #rcs-product :is(.wa-stage__asset>button,.wa-stage__chat main button,.wa-stage__details button):disabled,
.product-story .voice-demo :is([data-v-send],.voice-demo__actions button,.voice-demo__secondary button):disabled {
 opacity:1;background:transparent;border-color:#344761;color:#879bb8;box-shadow:none;cursor:default;
}
@media(max-width:600px){.product-story .voice-demo .voice-demo__secondary button{min-height:44px}}
