/* One shared, full-width reception scene. All rules stay inside the new hero. */
.hero--scene{background:#f6f8fb;overflow:clip}
.hero--scene::after{display:none}
.hero-scene-inner{padding-top:112px;padding-bottom:36px}
.hero-scene-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:24px}
.hero-scene-heading .eyebrow{font-size:12px;letter-spacing:.025em;color:#647b94;margin-bottom:10px}
.hero-scene-heading .status-dot{background:#6b9fa7;box-shadow:none}
.hero--scene h1{font-size:36px;font-weight:500;line-height:1.35;letter-spacing:-.035em;color:#213c56}
.hero-needs-link{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:44px;padding:8px 0;background:transparent;color:#49657f;font-size:13px;white-space:nowrap}
.hero-needs-link:hover{color:#0f54d4}
.hero-stage{--speaker-accent:#b77d44;position:relative;isolation:isolate;margin:0;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid #dce5eb;border-radius:26px;background:#dce8ed;color:#253b50}
.hero-stage-viewer,.hero-stage-poster,.hero-stage-shade{position:absolute;inset:0;width:100%;height:100%}
.hero-stage-viewer{z-index:1;overflow:hidden}
.hero-stage-viewer canvas{display:block;width:100%;height:100%;touch-action:pan-y;outline-offset:-4px}
.hero-stage-poster{z-index:0;object-fit:cover;object-position:50% 54%;transition:opacity .4s ease;user-select:none;pointer-events:none}
.hero-stage[data-viewer-ready="true"] .hero-stage-poster{opacity:0}
.hero-stage-shade{z-index:2;background:linear-gradient(180deg,#e5eef220 0,transparent 36%,transparent 81%,#20384f20);pointer-events:none}
.hero-scene-bubble{position:absolute;z-index:3;top:24px;left:30px;width:390px;max-width:46%;padding:15px 20px 17px;border:1px solid #ffffffb8;border-radius:19px 19px 19px 5px;background:#fffffff0;box-shadow:0 8px 28px #263c5010;backdrop-filter:none;pointer-events:none;transition:opacity .18s ease,translate .18s ease}
.hero-scene-bubble[data-speaker="gray"]{--speaker-accent:#5c718a}
.hero-scene-bubble[data-speaker="orange"]{--speaker-accent:#ae7139}
.hero-scene-bubble[data-speaker="green"]{--speaker-accent:#678246}
.hero-scene-bubble[data-speaker="silver"]{--speaker-accent:#347d8d}
.hero-scene-bubble-title{display:flex;align-items:center;gap:8px;margin:0 0 7px;font-size:12px;font-weight:600;line-height:19px;color:var(--speaker-accent)}
.hero-scene-bubble-title::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.hero-scene-bubble-text{margin:0;font-size:17px;line-height:1.65;letter-spacing:0;overflow-wrap:anywhere;color:#2e465b}
.hero-scene-bubble.is-changing{opacity:.45;translate:0 2px}
.hero-scene-bubble.is-quiet{opacity:0}
.hero-scene-state{position:absolute;z-index:3;right:22px;bottom:25px;max-width:210px;margin:0;padding:7px 11px;border:1px solid #ffffff50;border-radius:20px;background:#ffffffb3;color:#526c82;font-size:11px;line-height:18px;pointer-events:none}
.hero-stage[data-viewer-ready="true"] .hero-scene-state{display:none}
.hero-scene-toolbar{position:absolute;z-index:4;left:24px;bottom:22px;display:flex;align-items:center;gap:9px}
.hero-scene-toolbar button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border:1px solid #ffffff88;border-radius:100px;background:#ffffffe6;box-shadow:0 3px 12px #1e3c5010;color:#35526c;font-size:12px;line-height:20px;transition:background .16s,color .16s}
.hero-scene-toolbar button:hover{background:#fff;color:#173d66}
.hero-scene-toolbar .hero-scene-sound{padding:10px 16px;background:#234e67;color:#fff;border-color:#234e67}
.hero-scene-toolbar .hero-scene-sound:hover{background:#153c54;color:#fff}
.hero-scene-toolbar .hero-scene-sound[aria-pressed="true"]{background:#ffffffeb;border-color:#ffffff88;color:#35526c}
.hero-scene-toolbar .icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.hero-scene-playback{display:flex;gap:6px}
.hero-scene-playback button{width:42px;padding:10px}
.hero-scene-timing{margin-left:4px;color:#38556e;font-size:11px;font-variant-numeric:tabular-nums;text-shadow:0 1px 6px #fff;white-space:nowrap}
.hero-scene-progress{position:absolute;z-index:4;bottom:0;left:0;right:0;height:3px;background:#ffffff35;pointer-events:none}
.hero-scene-progress>span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:#4b7e91b3}
.hero-stage audio{display:none}
.hero-scene-products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
.hero-scene-products button{--product-color:#687d96;display:flex;align-items:center;gap:12px;min-width:0;min-height:76px;padding:13px 16px;border:1px solid #dfe6ed;border-radius:15px;background:#fff;color:#38516a;text-align:left;transition:border-color .16s,background .16s,box-shadow .16s}
.hero-scene-products button[data-scene-topic="trade"]{--product-color:#c18d4c}
.hero-scene-products button[data-scene-topic="park"]{--product-color:#87a466}
.hero-scene-products button[data-scene-topic="reception"]{--product-color:#559ca7}
.hero-scene-products button:hover{border-color:#a4bccd;box-shadow:0 4px 12px #234e6708}
.hero-scene-products button[aria-pressed="true"]{border-color:var(--product-color);background:#fdfefe;box-shadow:inset 0 0 0 1px var(--product-color)}
.hero-product-dot{width:8px;height:8px;flex-shrink:0;border-radius:50%;background:var(--product-color)}
.hero-scene-products button>span:nth-child(2){display:block;flex:1;min-width:0;font-size:14px;line-height:22px;font-weight:500}
.hero-scene-products small{display:block;margin-top:2px;color:#6b7e90;font-size:11px;font-weight:400;line-height:18px}
.hero-scene-products .icon{width:16px;height:16px;flex-shrink:0;color:#7890a4}
.hero-scene-products [aria-pressed="true"] .icon{color:var(--product-color)}
.hero-scene-foot{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:26px}
.hero-scene-links{display:flex;flex-wrap:wrap;gap:8px 22px;max-width:50%}
.hero-scene-links a{display:inline-flex;align-items:center;min-height:36px;color:#60788e;font-size:12px;line-height:20px;text-decoration:underline;text-decoration-color:#b8c8d3;text-underline-offset:4px}
.hero-scene-links a:hover{color:#0f54d4}
.hero--scene .hero-metrics{position:static;display:flex;gap:34px;width:auto;margin:0;padding:0}
.hero--scene .hero-metrics>div{display:flex;flex-direction:column;align-items:flex-start;padding:0;border:0;min-width:68px}
.hero--scene .hero-metric-value{font-size:28px;line-height:36px;letter-spacing:-.025em;gap:4px;color:#304f69}
.hero--scene .hero-metrics dt{font-size:11px;line-height:20px;color:#708598}
.hero--scene .hero-metric-value>span{font-size:11px;line-height:20px;color:#708598}
.hero-needs-dialog{width:min(560px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid #d6e2ec;border-radius:23px;background:#fff;color:#234570;box-shadow:0 30px 100px #1a334538;overflow:auto}
.hero-needs-dialog::backdrop{background:#1d354a68;backdrop-filter:blur(5px)}
.hero-needs-dialog-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 12px 2px 22px;color:#677e92;font-size:12px}
.hero-needs-dialog-bar button{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px;border-radius:12px;background:transparent;color:#60788e}
.hero-needs-dialog-bar button:hover{background:#edf3f8}
.hero-needs-dialog .needs-dialogue{width:100%;max-width:none;height:min(510px,calc(100dvh - 110px));min-height:350px;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;padding-top:4px}
.hero--scene button:focus-visible,.hero--scene a:focus-visible{outline:2px solid #337aa1;outline-offset:4px}
@media(min-width:1600px){.hero-scene-inner{width:min(1440px,calc(100% - 96px))}.hero-scene-bubble{top:30px;left:38px;width:430px}.hero-scene-bubble-text{font-size:19px}}
@media(max-width:1100px){.hero-scene-inner{padding-top:104px}.hero--scene h1{font-size:32px}.hero-scene-heading{margin-bottom:20px}.hero-stage{aspect-ratio:8/5}.hero-scene-bubble{top:20px;left:22px;width:355px;padding:12px 16px 14px}.hero-scene-bubble-text{font-size:15px}.hero-scene-products button{gap:9px;padding:11px 12px}.hero-scene-products button>span:nth-child(2){font-size:13px}.hero-scene-products .icon{display:none}.hero-scene-foot{gap:24px}.hero--scene .hero-metrics{gap:24px}}
@media(max-width:760px){.hero-scene-inner{padding-top:100px}.hero--scene h1{font-size:28px}.hero-scene-heading{align-items:center;gap:16px}.hero-needs-link{font-size:12px;gap:8px}.hero-scene-heading .eyebrow{font-size:11px;margin-bottom:8px}.hero-stage{border-radius:22px}.hero-scene-bubble{max-width:49%;width:315px;padding:11px 14px}.hero-scene-bubble-text{font-size:14px;line-height:1.6}.hero-scene-bubble-title{font-size:11px;margin-bottom:4px}.hero-scene-toolbar{left:18px;bottom:17px}.hero-scene-state{right:16px;bottom:20px;font-size:10px;max-width:160px}.hero-scene-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.hero-scene-products button{min-height:68px}.hero-scene-foot{align-items:flex-start}.hero-scene-links{gap:4px 15px;max-width:45%}.hero--scene .hero-metrics{gap:18px}.hero--scene .hero-metrics>div{min-width:54px}.hero--scene .hero-metric-value{font-size:24px;line-height:32px}}
/* Below tablet width, speech gets its own safe band instead of covering faces. */
@media(min-width:641px) and (max-width:900px){.hero-stage{padding-top:133px;padding-bottom:62px;aspect-ratio:auto;background:#e7eff2}.hero-stage-viewer{position:relative;inset:auto;aspect-ratio:8/5;height:auto}.hero-stage-poster{top:133px;bottom:62px;height:calc(100% - 195px)}.hero-stage-shade{top:133px;bottom:62px;height:auto}.hero-scene-bubble{top:14px;left:20px;right:20px;width:auto;max-width:none;height:106px;padding:10px 16px}.hero-scene-bubble-text{font-size:15px;line-height:1.6}.hero-scene-bubble-title{margin-bottom:4px}.hero-scene-toolbar{bottom:10px}.hero-scene-state{bottom:70px}.hero-scene-products{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.hero-scene-inner{padding-top:94px;padding-bottom:26px}.hero-scene-heading{display:block;margin-bottom:18px}.hero--scene h1{font-size:27px;line-height:1.4;letter-spacing:-.04em}.hero-needs-link{margin-top:5px;min-height:34px;padding:3px 0}.hero-stage{padding-top:137px;padding-bottom:62px;aspect-ratio:auto;border-radius:20px;background:#e7eff2}.hero-stage-viewer{position:relative;inset:auto;aspect-ratio:8/5;height:auto;z-index:1}.hero-stage-poster{top:137px;bottom:62px;height:calc(100% - 199px);object-fit:cover}.hero-stage-shade{top:137px;bottom:62px;height:auto;background:linear-gradient(transparent 75%,#dce8ed38)}.hero-scene-bubble{top:13px;left:14px;right:14px;width:auto;max-width:none;height:112px;padding:10px 14px 12px;border-radius:15px 15px 15px 4px;box-shadow:0 4px 18px #263c5009;backdrop-filter:none}.hero-scene-bubble-title{font-size:11px;line-height:18px;margin-bottom:4px}.hero-scene-bubble-text{font-size:14px;line-height:1.6}.hero-scene-toolbar{left:13px;right:13px;bottom:10px;gap:7px}.hero-scene-toolbar button{min-height:40px}.hero-scene-toolbar .hero-scene-sound{padding:9px 13px}.hero-scene-playback button{width:40px;padding:9px}.hero-scene-timing{margin-left:auto;font-size:10px}.hero-scene-state{bottom:66px;right:12px;font-size:9px;max-width:165px;line-height:15px;padding:4px 8px}.hero-scene-products{margin-top:10px}.hero-scene-products button{min-height:67px;padding:10px 11px;gap:9px;border-radius:12px}.hero-scene-products button>span:nth-child(2){font-size:12px;line-height:20px}.hero-scene-products small{font-size:10px;line-height:17px}.hero-product-dot{width:6px;height:6px}.hero-scene-foot{display:flex;flex-direction:column-reverse;gap:16px;margin-top:23px}.hero--scene .hero-metrics{justify-content:space-between;width:100%;gap:12px}.hero--scene .hero-metrics>div{flex:1;align-items:center}.hero--scene .hero-metrics>div+div{border-left:1px solid #dae4ed}.hero--scene .hero-metric-value{font-size:27px;line-height:34px}.hero-scene-links{justify-content:center;gap:4px 16px;max-width:none;width:100%}.hero-scene-links a{font-size:11px;min-height:32px}.hero-needs-dialog .needs-dialogue{height:min(500px,calc(100dvh - 105px));padding:8px 12px 12px}}
@media(max-width:360px){.hero--scene h1{font-size:24px}.hero-scene-bubble-text{font-size:13px}.hero-scene-toolbar{gap:5px}.hero-scene-toolbar .hero-scene-sound{padding-inline:10px;font-size:11px}.hero-scene-timing{font-size:9px}.hero-scene-links{gap:3px 12px}}
@media(min-width:901px){
 .hero-scene-inner{width:calc(100% - 48px);max-width:1440px;padding-top:104px}
 .hero-scene-heading{margin-bottom:20px}
 .hero-scene-bubble{top:20px;padding:11px 18px 13px;transition:left .3s ease,top .3s ease,opacity .18s ease,translate .18s ease}
 .hero-scene-bubble-title{font-size:12px;line-height:17px;margin-bottom:5px}
 .hero-scene-bubble-text{font-size:16px;line-height:1.55}
 .hero-scene-bubble::after{content:"";position:absolute;bottom:-7px;left:calc(var(--bubble-tail-x,50%) - 7px);width:14px;height:14px;border-right:1px solid #ffffffb8;border-bottom:1px solid #ffffffb8;border-radius:0 0 3px 0;background:#fffffff0;rotate:45deg;transition:left .3s ease,top .3s ease}
 .hero-scene-bubble[data-tail-side="right"]::after{left:calc(100% - 7px);top:calc(var(--bubble-tail-y,50%) - 7px);bottom:auto;rotate:-45deg}
 .hero-scene-bubble[data-tail-side="left"]::after{left:-7px;top:calc(var(--bubble-tail-y,50%) - 7px);bottom:auto;rotate:135deg}
}
@media(prefers-reduced-motion:reduce){.hero-stage-poster,.hero-scene-bubble,.hero-scene-bubble::after,.hero-scene-products button,.hero-scene-toolbar button{transition:none}.hero-scene-bubble.is-changing{opacity:1;translate:0}}

/* The duo is the hero: two facing characters, short turns, and quiet topic chips. */
.hero-scene-bubble{width:390px;max-width:36%;padding:15px 19px 17px;border-radius:19px;background:#fffffff2}
.hero-scene-bubble[data-speaker="orange"]{background:#fff9eff2;border-color:#fff4dfd9}
.hero-scene-bubble-title{display:none}
.hero-scene-bubble-text{font-size:17px;line-height:1.6}
.hero-scene-echo{z-index:2;opacity:0;pointer-events:none;translate:0 4px}
.hero-scene-echo.is-visible{opacity:.76;translate:0 0}
.hero-scene-echo.is-crowded{visibility:hidden}
.hero-scene-echo .hero-scene-bubble-text{font-size:15px;line-height:1.55}
.hero-scene-bubble::after{background:inherit}
.hero-scene-products{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:15px}
.hero-scene-products button{min-height:40px;width:auto;padding:8px 16px;gap:8px;border:1px solid #dce5ec;border-radius:100px;background:transparent;box-shadow:none;color:#718394;text-align:center}
.hero-scene-products button>span:nth-child(2){flex:0 1 auto;font-size:12px;font-weight:400;line-height:20px;white-space:nowrap}
.hero-scene-products button[aria-pressed="true"]{border-color:#8ca6b6;background:#eaf1f5;color:#2b4a60;box-shadow:none}
.hero-scene-products button:hover{border-color:#8ca6b6;background:#eff4f7;box-shadow:none}
.hero-scene-products .hero-product-dot{width:5px;height:5px;opacity:.65}
.hero-scene-products .icon{display:none}
.hero-scene-foot{justify-content:center;margin-top:24px}
.hero--scene .hero-metrics{gap:70px}
@media(min-width:1600px){.hero-scene-bubble{width:420px}.hero-scene-bubble-text{font-size:18px}}
@media(min-width:901px) and (max-width:1100px){.hero-scene-bubble{max-width:38%;padding:12px 16px}.hero-scene-bubble-text{font-size:15px}.hero-scene-echo .hero-scene-bubble-text{font-size:13px}}
@media(max-width:900px){.hero-scene-echo{display:none}.hero-scene-bubble{left:20px;right:20px;width:auto;max-width:none;box-sizing:border-box}.hero-scene-bubble-text{font-size:15px}.hero-scene-products{gap:7px}.hero-scene-products button{min-height:38px;padding:7px 14px}.hero-scene-products button>span:nth-child(2){font-size:12px}}
@media(max-width:640px){.hero-stage{padding-top:119px}.hero-stage-poster{top:119px;height:calc(100% - 181px)}.hero-stage-shade{top:119px}.hero-scene-bubble{top:12px;left:14px;right:14px;width:auto;height:96px;padding:11px 14px;border-radius:15px;max-width:none}.hero-scene-bubble-text{font-size:14px;line-height:1.6}.hero-scene-products{gap:7px 6px;margin-top:12px}.hero-scene-products button{padding:7px 11px;min-height:36px}.hero-scene-products button>span:nth-child(2){font-size:11px;line-height:18px}.hero-scene-products .hero-product-dot{width:4px;height:4px}.hero--scene .hero-metrics{gap:12px}.hero-scene-foot{margin-top:20px}}

.hero-scene-greeting-hint{position:absolute;z-index:3;right:25px;bottom:29px;margin:0;color:#49677b;font-size:11px;line-height:18px;letter-spacing:.015em;text-shadow:0 1px 7px #fff;pointer-events:none;opacity:.78}
@media(max-width:640px){.hero-scene-greeting-hint{display:none}}
