/* A scene is a sculpture and its product cards. The pointer layer stays independent. */
.hero-art{pointer-events:auto;touch-action:pan-y}
.hero-art>*{pointer-events:none}
.scene-sculptures{aspect-ratio:3/2}
.scene-sculpture-layer{position:absolute;inset:0;opacity:0;transform-origin:50% 62%;pointer-events:none}
.scene-sculpture-layer.is-current{opacity:1}
.scene-sculpture-layer .hero-sculpture{width:100%;height:100%;object-fit:contain}

[data-scene="telegram"]{--scene-ink:#247ba9;--scene-color:#2a9dd5;--scene-wash:#ecf7fe;--scene-line:#c5e8f8}
[data-scene="inbox"]{--scene-ink:#7353b9;--scene-color:#9663db;--scene-wash:#f4efff;--scene-line:#ddd0f3}
[data-scene="contacts"]{--scene-ink:#c26255;--scene-color:#df877a;--scene-wash:#fff1ed;--scene-line:#f3d6cd}
[data-scene="followups"]{--scene-ink:#a67322;--scene-color:#dca751;--scene-wash:#fff7e8;--scene-line:#f0dfb9}
[data-scene="pipeline"]{--scene-ink:#748938;--scene-color:#9aaf51;--scene-wash:#f2f6e6;--scene-line:#d9e3bb}
.capability-strip>.capability{position:relative;appearance:none;font-family:Manrope,Inter,sans-serif;color:#585e66;background:#fafbfc;border:1px solid #e8ebef;transition:background 180ms,border-color 180ms,box-shadow 180ms,transform 180ms var(--ease);overflow:visible}
.capability-strip>.capability .capability-icon{background:var(--scene-wash)}
.capability-strip>.capability[aria-selected="true"]{background:var(--scene-wash);border-color:var(--scene-color);color:var(--scene-ink);box-shadow:0 5px 16px color-mix(in srgb,var(--scene-color) 14%,transparent)}
.capability-strip>.capability[aria-selected="true"] .capability-icon{background:#ffffffa6}
.capability-strip>.capability:focus-visible{outline:2px solid var(--scene-ink);outline-offset:4px}
.capability-strip>.capability:active{transform:scale(.98)}
.scene-playback{display:block;margin:19px auto 0;border:0;border-radius:8px;background:transparent;padding:9px 13px;min-height:42px;font-size:14px;line-height:1.4;font-weight:450;color:#747b85;transition:background 150ms,color 150ms}
.scene-playback:disabled{color:#747b85;cursor:default}
.scene-status{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;padding:0!important;border:0!important}
.floating-ui[data-scene]{border-color:var(--scene-line);background:#fffffffa}
.scene-card-content{text-align:left}
.scene-card-label{display:flex;align-items:center;gap:8px;font-size:14px;line-height:1.35;color:var(--scene-ink);margin-bottom:16px}
.scene-card-label svg,.scene-card-label img{width:23px;height:23px;flex-shrink:0}
.scene-card-title{display:block;font-family:Manrope,Inter,sans-serif;font-size:23px;font-weight:550;line-height:1.3;letter-spacing:-.7px;color:#242a31}
.scene-message{font-size:19px;line-height:1.5;letter-spacing:-.25px;color:#657281;margin-top:16px}
.scene-detail{font-size:18px;line-height:1.5;letter-spacing:-.15px;color:#707a86;margin-top:13px}
.scene-chip{display:inline-flex;align-items:center;max-width:100%;font-size:18px;line-height:1.35;color:var(--scene-ink);background:var(--scene-wash);border:1px solid var(--scene-line);padding:10px 12px;border-radius:10px;margin-top:19px}
.scene-person{display:flex;align-items:center;gap:10px;margin-top:17px;font-size:18px;line-height:1.4;color:#657080}
.scene-avatar{width:34px;height:34px;flex-shrink:0;display:grid;place-items:center;background:var(--scene-wash);color:var(--scene-ink);border-radius:50%;font-size:14px;font-weight:600}
.scene-tasks{display:flex;flex-direction:column;gap:13px;margin-top:19px}
.scene-task{display:flex;align-items:center;gap:10px;font-size:18px;line-height:1.4;color:#5b6775}
.scene-check{display:grid;place-items:center;width:21px;height:21px;border:1px solid var(--scene-color);border-radius:6px;flex-shrink:0;font-size:14px;color:white}
.scene-task.is-done .scene-check{background:var(--scene-color)}
.scene-task.is-done{color:#828a94}
.scene-stages{display:flex;gap:6px;margin-top:20px}
.scene-stages>i{height:7px;border-radius:5px;background:#e9ece7;flex:1}
.scene-stages>i.is-complete{background:var(--scene-color)}
.floating-followup .scene-card-title{font-size:21px}
.floating-followup .scene-card-label{margin-bottom:12px}

@media(hover:hover) and (pointer:fine){
  .capability-strip>.capability:hover{border-color:var(--scene-color);background:var(--scene-wash);transform:translateY(-3px)}
  .capability-strip>.capability:active{transform:scale(.98)}
  .scene-playback:not(:disabled):hover{color:#333c47;background:#f1f3f7}
}
@media(max-width:1100px){
  .scene-card-title{font-size:21px}
  .scene-message{font-size:18px}
  .scene-card-label{margin-bottom:13px}
  .scene-chip{padding:9px 11px;margin-top:16px}
  .floating-followup .scene-card-title{font-size:20px}
}
@media(max-width:850px){
  .scene-card-title{font-size:20px}
  .scene-message{font-size:18px;margin-top:13px}
  .scene-card-label{gap:6px;font-size:14px}
  .scene-card-label svg,.scene-card-label img{width:21px;height:21px}
  .floating-followup .scene-card-title{font-size:19px}
}
@media(max-width:620px){
  .hero-art{pointer-events:auto;height:530px}
  .capability-strip>.capability{font-size:16px}
  .capability-strip>.capability-telegram{font-size:20px}
  .scene-playback{margin-top:15px;font-size:14px;min-height:44px}
  .scene-card-title{font-size:21px}
  .scene-card-label{font-size:14px;margin-bottom:13px}
  .scene-message{font-size:18px;line-height:1.45}
  .scene-chip{line-height:1.35;padding:9px 11px}
}
@media(max-width:380px){
  .hero-art{height:510px}
  .scene-card-title{font-size:20px}
  .scene-message{font-size:18px}
  .scene-card-label{font-size:14px}
  .capability-strip>.capability{font-size:15px}
  .capability-strip>.capability-telegram{font-size:19px}
}
@media(prefers-reduced-motion:reduce){
  .scene-sculpture-layer,.scene-card-content,.capability-strip>.capability,.scene-playback{transition:none!important;animation:none!important}
  .capability-strip>.capability:hover{transform:none}
}

/* One stable stage, fully contained cards, and a quiet tab rail. */
.hero-art{height:555px;margin-top:20px;overflow:hidden}
.hero-art .sculpture-depth{width:780px;max-width:83%;top:20px}
.hero-art .floating-ui{padding:22px;border-radius:18px;box-shadow:0 14px 35px #1b2c4810}
.hero-art .floating-message{top:52px;left:5%;width:248px;transform:rotate(-5deg)}
.hero-art .floating-deal{top:65px;right:5%;width:228px;transform:rotate(5deg)}
.hero-art .floating-followup{top:317px;right:6%;width:245px;transform:rotate(-4deg)}
.scene-card-label{margin-bottom:13px;color:var(--scene-ink)}
.scene-card-title{font-size:21px;line-height:1.27;letter-spacing:-.5px}
.scene-message,.scene-detail{font-size:16px;line-height:1.45;margin-top:12px}
.scene-chip{font-size:16px;padding:8px 11px;margin-top:14px}
.scene-person,.scene-task{font-size:16px}
.scene-person{margin-top:12px}.scene-tasks{gap:10px;margin-top:14px}
.scene-card-label svg{color:var(--scene-color)}
.capability-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;max-width:1000px;width:calc(100% - 88px);padding:0;border-bottom:1px solid #e7e9ee;border-radius:0}
.capability-strip>.capability{border:0;border-radius:0;min-height:70px;padding:17px 10px;gap:9px;background:transparent;font-size:16px;font-weight:500;box-shadow:none;color:#828894;flex-direction:row;justify-content:center;white-space:nowrap;text-align:center;transform:none}
.capability-strip>.capability::after{content:'';position:absolute;left:15px;right:15px;bottom:-1px;height:2px;border-radius:2px;background:var(--scene-color);transform:scaleX(0);transition:transform 240ms cubic-bezier(.22,1,.36,1)}
.capability-strip>.capability[aria-selected="true"]{background:transparent;box-shadow:none;color:#272e38;border:0}
.capability-strip>.capability[aria-selected="true"]::after{transform:scaleX(1)}
.capability-strip>.capability .capability-icon,.capability-strip>.capability[aria-selected="true"] .capability-icon{width:29px;height:29px;background:transparent;color:var(--scene-color);border-radius:0}
.capability-strip svg,.capability-strip .capability-icon img{width:26px;height:26px}
.scene-playback{margin-top:12px;color:#9095a0;font-size:13px;padding:6px 12px;min-height:35px}
@media(hover:hover) and (pointer:fine){.capability-strip>.capability:hover{background:transparent;border:0;transform:none;box-shadow:none;color:var(--scene-ink)}.capability-strip>.capability:hover::after{transform:scaleX(.5)}.capability-strip>.capability[aria-selected="true"]:hover::after{transform:scaleX(1)}}
@media(max-width:1100px){.hero-art{height:520px}.hero-art .sculpture-depth{width:700px;top:25px}.hero-art .floating-message{left:3%;width:225px;top:40px}.hero-art .floating-deal{right:3%;width:210px;top:65px}.hero-art .floating-followup{right:4%;width:226px;top:310px}.scene-card-title{font-size:20px}.hero-art .floating-ui{padding:20px}.capability-strip>.capability{font-size:14px;gap:7px}.capability-strip{width:calc(100% - 70px)}}
@media(max-width:850px){.hero-art{height:500px}.hero-art .sculpture-depth{width:650px;max-width:90%;top:38px}.hero-art .floating-message{left:3%;width:214px}.hero-art .floating-deal{right:3%;width:203px;top:66px}.hero-art .floating-followup{right:4%;top:306px;width:218px}.capability-strip{width:calc(100% - 45px)}.capability-strip>.capability{font-size:13px;gap:6px}.capability-strip>.capability .capability-icon{width:22px;height:22px}.capability-strip svg,.capability-strip .capability-icon img{width:22px;height:22px}}
@media(max-width:620px){.hero-art{height:520px;margin-top:25px}.hero-art .sculpture-depth{width:530px;max-width:none;top:99px}.hero-art .floating-message{left:25px;top:18px;width:210px;transform:rotate(-4deg);padding:19px}.hero-art .floating-deal{right:25px;top:327px;width:210px;transform:rotate(4deg);padding:19px}.hero-art .floating-followup{display:none}.scene-card-title{font-size:20px}.scene-message,.scene-detail{font-size:16px}.scene-chip{font-size:16px}.capability-strip{display:flex;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;width:calc(100% - 32px);padding:0 0 1px;gap:3px;scroll-snap-type:x proximity}.capability-strip::-webkit-scrollbar{display:none}.capability-strip>.capability{flex:0 0 auto;min-height:64px;padding:15px 12px;gap:8px;font-size:15px;scroll-snap-align:center}.capability-strip>.capability-telegram{grid-column:auto;min-height:64px;font-size:15px}.capability-strip>.capability .capability-icon{width:25px;height:25px}.capability-strip svg,.capability-strip .capability-icon img{width:25px;height:25px}.capability-strip>.capability::after{left:12px;right:12px}.scene-playback{margin-top:10px}}
@media(max-width:380px){.hero-art{height:495px}.hero-art .sculpture-depth{width:460px;top:106px}.hero-art .floating-message{left:22px;width:200px}.hero-art .floating-deal{right:22px;top:312px;width:195px}.scene-card-title{font-size:19px}.scene-message,.scene-detail{font-size:15px}}
