/* ShowShot: a studio of useful layers. Product pixels keep their native proportions. */
body,button,input,select,textarea { font-family:var(--disp); }
.wordmark { font:600 1.5rem/1 var(--disp); letter-spacing:-.07em; color:#f8f4ef; white-space:nowrap; }
.wordmark > span { color:#ff5348; }
.brand .wordmark-icon { display:block; width:1.9rem; height:1.9rem; object-fit:contain; }
.brand { gap:.45rem; }
.story-spine,.chapter-slate,.closing-track,.story-mat,.story-hud,.story-corners { display:none; }
.story-flow .studio-intro .wrap::after,.story-flow .studio-intro p::before { display:none; }
.story-flow .studio-intro p { padding-left:0; }
.studio-home .hero__title { max-width:62rem; margin-inline:auto; font-size:clamp(2.5rem,4.1vw,3.9rem); line-height:1.06; letter-spacing:-.045em; text-wrap:balance; }
.studio-home .hero__sub { max-width:40rem; }
.close-acts .btn { transform:none; transition:transform 220ms ease,background-color 220ms ease,border-color 220ms ease; }
.close-acts .btn:hover { transform:translateY(-2px); }
.close-in { opacity:1; transform:none; }
.close-sec .close-copy { text-shadow:0 2px 16px #000b; }
.close-copy h2 { text-wrap:balance; }
.close-copy .lede { color:#d5d7d8; }
.personal-aside img { width:100%; height:auto; object-fit:contain; }
.product-breadcrumb { display:inline-flex; align-items:center; gap:.8rem; font-size:.82rem; color:#a6afb4; }
.product-breadcrumb span { color:#6f767a; }
.dream-hero { padding-top:7.6rem; padding-bottom:4rem; overflow:clip; }
.dream-hero-grid { display:grid; grid-template-columns:.92fr 1.08fr; gap:3rem; align-items:center; margin-top:3.4rem; }
.dream-hero h1 { max-width:18ch; font-size:clamp(2.8rem,4.3vw,4.3rem); line-height:1.06; font-weight:500; letter-spacing:-.045em; text-wrap:balance; }
.dream-hero h1 em { font-style:normal; color:#ff655a; }
.dream-hero .lede { max-width:44ch; font-size:1.08rem; line-height:1.65; color:#b4bdc2; margin-top:1.5rem; }
.dream-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.25rem 1.6rem; margin-top:2rem; }
.dream-actions .text-link { font-size:.9rem; }
.hero-assurance { margin-top:1rem; font-size:.76rem; color:#909da3; }
.dream-hero-picture { min-width:0; }
.visual-source { display:flex; flex-wrap:wrap; gap:.3rem .7rem; font-size:.65rem; line-height:1.5; color:#929ca2; margin:1.25rem 1rem 0; position:relative; z-index:1; }
.source-link { color:#bac3c7; text-decoration:underline; text-underline-offset:3px; }
.story-sections { padding-top:3rem; }
.story-cards { display:flex; flex-direction:column; gap:3.5rem; }
.story-card { display:grid; grid-template-columns:.9fr 1.1fr; position:sticky; top:calc(5.5rem + var(--card-order,0)*15px); border:1px solid #8b9ea32c; border-radius:1.8rem; background:#0d1215; padding:.55rem; box-shadow:0 0 0 5px #ffffff02,0 24px 60px -25px #000c; min-height:34rem; isolation:isolate; }
.story-copy { padding:3.1rem 2.8rem; align-self:center; }
.story-copy h2 { font-size:clamp(2rem,3vw,3.1rem); font-weight:500; line-height:1.1; letter-spacing:-.035em; text-wrap:balance; }
.story-copy > p { color:#b0bdc4; line-height:1.7; font-size:1rem; margin-top:1.4rem; max-width:41ch; }
.story-copy .text-link { margin-top:1.6rem; }
.story-details { list-style:none; padding:0; margin:1.6rem 0 0; display:flex; flex-direction:column; gap:.7rem; font-size:.83rem; color:#c9d0d4; }
.story-details li { display:flex; gap:.65rem; align-items:baseline; }
.story-details li::before { content:'+'; color:#e29d86; font-weight:400; }
.story-picture { min-width:0; padding:.5rem; align-self:stretch; display:flex; flex-direction:column; justify-content:center; border-radius:1.3rem; background:radial-gradient(ellipse at 70% 20%,#9b6c4020,transparent 65%),#0a0f11; overflow:hidden; }
.story-card-reverse { grid-template-columns:1.1fr .9fr; }
.story-card-reverse .story-copy { order:2; }
.story-card-reverse .story-picture { order:1; background:radial-gradient(ellipse at 0 100%,#4c8b8e20,transparent 70%),#0a0f11; }
.story-picture .visual-source { margin-bottom:1rem; }
.visual { min-width:0; width:100%; position:relative; height:31rem; perspective:1600px; isolation:isolate; }
.visual-entrance { opacity:0; translate:0 14px; transition:opacity 550ms cubic-bezier(.2,.7,.25,1),translate 550ms cubic-bezier(.2,.7,.25,1); }
.visual-entrance.is-visible { opacity:1; translate:0 0; }
.visual::before { content:''; position:absolute; width:47%; height:53%; right:2%; top:13%; border-radius:1.5rem; border:1px solid #cfa18e28; background:repeating-linear-gradient(135deg,#9db7b91e 0 1px,transparent 1px 10px); transform:rotate(-8deg); z-index:-1; mask-image:linear-gradient(90deg,transparent,#000); }
.visual img { display:block; width:100%; height:auto; object-fit:contain; }
.visual-window,.webpage-plane,.conversion-background,.recording-window,.analytics-window,.context-screen,.dynamic-front,.dynamic-back { border:1px solid #a6b4b63f; border-radius:.85rem; overflow:hidden; background:#111b20; box-shadow:0 24px 60px -18px #000c; }
.demo-bar { display:flex; align-items:center; gap:.75rem; justify-content:space-between; padding:.7rem .85rem; font-size:.62rem; color:#c0c7cb; background:#162026; border-bottom:1px solid #bac4c41a; }
.demo-bar > span:first-child { font-size:.4rem; letter-spacing:3px; color:#72868d; }
.demo-bar > span:nth-child(2) { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.demo-bar i { font-style:normal; }
.floating-note { position:absolute; display:flex; align-items:center; gap:.65rem; padding:.8rem 1rem; border:1px solid #bfc2b63f; border-radius:.7rem; background:#1c282aeF; color:#e5e9e8; box-shadow:0 10px 35px #0006; font-size:.78rem; z-index:4; max-width:90%; }
.note-tick { color:#a0d4c7; font-size:.9rem; }
.note-bottom { left:8%; bottom:4%; }
.visual-window { position:absolute; width:96%; top:13%; left:0; transform:rotateY(-9deg) rotateZ(-2deg); }
.visual-share .visual-window { width:105%; left:-4%; top:12%; }
.visual-share::before { top:4%; }
.comment-slip { position:absolute; right:0; bottom:16%; display:flex; gap:.6rem; width:63%; padding:1rem; border:1px solid #93a4b352; border-radius:.7rem; background:#14202bef; box-shadow:0 16px 40px #0009; transform:rotate(2deg); }
.avatar-letter { display:grid; place-items:center; width:1.9rem; height:1.9rem; border-radius:50%; background:#536455; color:#fff; flex-shrink:0; font-size:.9rem; }
.comment-slip b { font-size:.73rem; font-weight:500; }
.comment-slip time { color:#8ea1b3; margin-left:.4rem; font-size:.65rem; }
.comment-slip p { font-size:.9rem; line-height:1.35; padding:.4rem 0; }
.comment-slip div > span { font-size:.65rem; color:#a7cfc6; }
.edit-context { position:absolute; width:66%; right:0; top:7%; transform:rotateY(-13deg) rotateZ(5deg); overflow:hidden; border:1px solid #a5b4b743; border-radius:.65rem; box-shadow:0 20px 50px #000a; }
.edit-context > span { display:block; font-size:.65rem; padding:.55rem; background:#18222a; }
.transcript-sheet { position:absolute; width:85%; left:1%; top:16%; border:1px solid #7e939d55; border-radius:.8rem; overflow:hidden; background:#141c22; transform:rotateY(-9deg) rotateZ(-2deg); box-shadow:0 24px 60px #0009; }
.transcript-content { padding:1.3rem; }
.sample-label { font-size:.6rem; text-transform:uppercase; letter-spacing:.1em; color:#91a6b2; }
.transcript-content > p { font-size:1.08rem; line-height:1.6; margin-top:.9rem; }
.transcript-content time { color:#77909d; display:block; font:400 .58rem var(--mono); }
.transcript-content del { color:#ff9a8a; text-decoration-color:#ff7866; background:#fe604a20; border-radius:.2rem; }
.transcript-content mark { color:#d5f0e4; background:#6cc2a822; border-bottom:1px solid #7bc7ac; }
.voice-patch { margin-top:1rem; padding:.8rem 1rem; background:#212b2b; border-left:2px solid #b9d8ba; border-radius:.25rem; }
.voice-patch > span { font-size:.58rem; color:#a9d4bc; text-transform:uppercase; letter-spacing:.06em; }
.voice-patch p { font-size:1rem; line-height:1.4; padding-top:.4rem; }
.voice-wave { height:1.5rem; display:flex; align-items:center; gap:3px; margin-top:.65rem; overflow:hidden; }
.voice-wave i { height:var(--wave); background:#84b9a8; flex:1; min-width:2px; border-radius:2px; opacity:.75; }
.demo-action { display:flex; width:100%; justify-content:space-between; align-items:center; color:#ffe2d8; border:1px solid #df967d66; background:#c65f3524; border-radius:.4rem; padding:.65rem .8rem; font-size:.78rem; margin-top:1rem; cursor:pointer; }
.demo-action:hover { background:#c65f3544; }
.edit-result { display:block; font-size:.6rem; color:#9eafb8; padding-top:.6rem; }
.visual-transcript .note-bottom { bottom:0; left:12%; }
.visual-transcript > .floating-note { display:none; }
.is-edited [data-filler] { display:none; }
.conversion-background { position:absolute; width:95%; top:10%; left:-2%; transform:rotateY(-15deg) rotateZ(-3deg); }
.demo-playbar { display:flex; align-items:center; gap:.7rem; padding:.65rem .8rem; background:#182027; font-size:.55rem; color:#b9c5cc; }
.demo-playbar i { flex:1; height:3px; background:linear-gradient(90deg,#ff7a65 46%,#40515b 46%); }
.form-plane { position:absolute; width:66%; top:24%; right:0; padding:1.4rem; background:#ecf0e9; color:#1f2c2f; border:1px solid #fff9; border-radius:1rem; box-shadow:0 25px 50px #000a; transform:rotateY(-12deg) rotateZ(-3deg); }
.form-plane .sample-label { color:#586661; }
.form-plane h3 { font-size:1.6rem; line-height:1.1; letter-spacing:-.04em; font-weight:500; margin-top:.6rem; }
.form-plane p { font-size:.8rem; margin-top:.65rem; color:#57605b; }
.form-field { margin-top:.8rem; font-size:.6rem; color:#5b6863; }
.form-field span { display:block; margin-top:.25rem; padding:.65rem .8rem; border:1px solid #8c9b903f; border-radius:.4rem; background:#fff; font-size:.8rem; color:#334641; }
.form-submit { display:flex; justify-content:space-between; margin-top:1rem; padding:.75rem; background:#183a33; color:#effbef; border-radius:.4rem; font-size:.8rem; }
.form-plane small { display:block; margin-top:.6rem; font-size:.55rem; text-align:center; color:#66746b; }
.visual-convert .note-bottom { bottom:1%; left:0; }
.visual-convert > .floating-note { display:none; }
.webpage-plane { position:absolute; width:90%; left:1%; top:5%; background:#edf0ed; color:#172523; transform:rotateY(-13deg) rotateZ(-2deg); }
.visual-embed { height:36rem; }
.dream-hero-picture > .visual-embed + .visual-source { margin-top:3rem; }
.visual-transcript { height:35rem; }
.visual-convert { height:34rem; }
.help-content { padding:1.5rem; }
.help-content > span { font-size:.55rem; letter-spacing:.13em; color:#527260; }
.help-content h3 { font-size:1.65rem; line-height:1.12; letter-spacing:-.04em; font-weight:500; margin:.7rem 0; }
.help-content > p { color:#55665e; font-size:.75rem; }
.embedded-demo { position:relative; border-radius:.5rem; overflow:hidden; margin-top:1rem; background:#0d1412; }
.embedded-demo img { opacity:.8; }
.embedded-demo .play-disc { width:2.8rem; height:2.8rem; font-size:.8rem; }
.embed-caption { position:absolute; bottom:0; left:0; right:0; padding:.6rem; background:#14241fed; color:#eff8f0; font-size:.7rem; }
.help-lines { display:flex; flex-direction:column; gap:.4rem; margin-top:1rem; }
.help-lines i { display:block; width:75%; height:3px; background:#c3cec5; }
.help-lines i:last-child { width:55%; }
.embed-chip { position:absolute; bottom:5%; right:0; width:46%; padding:1.2rem 1.3rem; background:#1e3333; border:1px solid #94b6a957; border-radius:.7rem; box-shadow:0 15px 35px #0009; transform:rotate(3deg); }
.embed-chip span { font-size:.65rem; color:#9ec9bd; }
.embed-chip b { display:block; font-size:1.45rem; font-weight:500; line-height:1.15; margin-top:.5rem; }
.video-launch { display:block; width:100%; position:relative; border:0; padding:0; overflow:hidden; cursor:pointer; color:#fff; background:#101619; }
.video-launch img { aspect-ratio:16/9; object-fit:cover; }
.video-launch::after { content:''; position:absolute; inset:35% 0 0; background:linear-gradient(transparent,#000b); pointer-events:none; }
.play-disc { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:3.5rem; height:3.5rem; border-radius:50%; background:#eef5f0; color:#1c2b29; box-shadow:0 4px 25px #0005; z-index:2; font-size:1rem; }
.video-title { position:absolute; bottom:.8rem; left:1rem; right:.8rem; z-index:2; font-size:.7rem; text-align:left; }
.slide-source { position:absolute; width:70%; top:3%; left:0; border-radius:.8rem; overflow:hidden; transform:rotateY(-9deg) rotateZ(-5deg); box-shadow:0 18px 40px #0007; }
.slide-card { position:absolute; width:55%; height:18rem; padding:1.5rem; border-radius:.6rem; box-shadow:0 22px 45px #0009; }
.slide-card > span { font-size:.5rem; letter-spacing:.1em; }
.slide-card h3 { font-size:2.1rem; line-height:1.08; font-weight:500; letter-spacing:-.035em; padding-top:1.3rem; }
.slide-card em { font-style:normal; color:#a8c0ac; }
.slide-card small { font-size:.52rem; }
.slide-rule { height:1px; background:#6b857b70; margin:1.2rem 0 .6rem; }
.slide-back { top:37%; left:4%; transform:rotateY(-16deg) rotateZ(-7deg); background:#d9e0ce; color:#1a372d; }
.slide-front { top:24%; right:0; transform:rotateY(-15deg) rotateZ(5deg); background:#213d33; color:#f0f2e6; border:1px solid #9eb4a858; }
.slide-caption { position:absolute; bottom:0; right:4%; font-size:.75rem; color:#a1b6ac; }
.clips-source { position:absolute; width:73%; left:0; top:4%; transform:rotateY(-10deg) rotateZ(-5deg); overflow:hidden; border-radius:.7rem; }
.clip-tile { position:absolute; border:1px solid #e6d3b63f; border-radius:.65rem; overflow:hidden; background:#141c1a; box-shadow:0 25px 40px #000a; }
.clip-tile img { height:100%; object-fit:cover; object-position:50%; opacity:.8; }
.clip-tile > span { position:absolute; left:.6rem; bottom:17%; right:.6rem; text-align:center; font-size:1.3rem; line-height:1.1; font-weight:600; text-shadow:0 2px 5px #000; }
.clip-tile mark { background:#f2e3a6; color:#171e1a; font-size:1rem; padding:.15rem; text-shadow:none; }
.clip-tile b { position:absolute; bottom:0; left:0; right:0; background:#13251ff5; font-size:.58rem; padding:.55rem; font-weight:400; }
.clip-square { width:43%; height:14rem; top:46%; left:3%; transform:rotateZ(-5deg); }
.clip-portrait { width:40%; height:24rem; right:1%; top:13%; transform:rotateY(-12deg) rotateZ(5deg); }
.clip-note { position:absolute; left:3%; bottom:0; font-size:.6rem; color:#9eafa8; }
.clip-note strong { font-weight:400; display:block; color:#d4ddd7; margin-top:.3rem; font-size:.8rem; }
.avatar-preview { position:absolute; width:96%; left:0; top:12%; border-radius:.9rem; overflow:hidden; transform:rotateY(-12deg) rotateZ(-3deg); border:1px solid #b2b7d14a; box-shadow:0 25px 45px #0009; }
.script-slip { position:absolute; width:69%; right:0; top:57%; background:#211f32; border:1px solid #b5a7d35a; padding:1.3rem; border-radius:.75rem; box-shadow:0 20px 40px #0009; transform:rotate(3deg); }
.script-slip > span { font-size:.55rem; letter-spacing:.1em; color:#b7a9d4; }
.script-slip p { font-size:1.2rem; line-height:1.35; margin-top:.6rem; }
.script-slip b { font-size:.62rem; color:#bcb4ca; font-weight:400; }
.script-slip .voice-wave i { background:#b2a1d0; }
.generation-preview { display:block; position:absolute; top:4%; left:0; width:96%; height:23rem; overflow:hidden; border-radius:.9rem; transform:rotateY(-12deg) rotateZ(-3deg); border:1px solid #d5a58d54; box-shadow:0 20px 50px #000b; }
.generation-preview img { height:100%; object-fit:cover; }
.generation-credit { position:absolute; bottom:1rem; left:1rem; font-size:.65rem; padding:.5rem; background:#120c07aa; border-radius:.3rem; }
.prompt-slip { position:absolute; right:0; bottom:2%; padding:1.4rem; width:80%; border-radius:.7rem; background:#29201c; border:1px solid #e6be9450; box-shadow:0 20px 50px #000b; transform:rotate(2deg); }
.prompt-slip > span { font-size:.54rem; letter-spacing:.12em; color:#c6ad95; }
.prompt-slip p { font-size:1.7rem; line-height:1.15; padding-top:.6rem; }
.prompt-tags { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:1rem; font-size:.57rem; color:#dacbbb; }
.prompt-tags span { border:1px solid #cebea52f; padding:.3rem .5rem; border-radius:.3rem; }
.recording-window { position:absolute; width:98%; left:0; top:13%; transform:rotateY(-10deg) rotateZ(-3deg); }
.recorder-slip { position:absolute; width:87%; left:5%; bottom:13%; border:1px solid #a4b2b63f; border-radius:.7rem; overflow:hidden; box-shadow:0 15px 40px #000c; transform:rotateZ(2deg); background:#151a1f; }
.visual-record .note-bottom { bottom:1%; }
.analytics-window { position:absolute; width:99%; top:8%; left:0; transform:rotateY(-10deg) rotateZ(-2deg); }
.retention-slip { position:absolute; width:65%; bottom:5%; right:0; padding:1.3rem; border:1px solid #8da69e50; border-radius:.75rem; background:#152e29; box-shadow:0 20px 50px #000a; transform:rotate(3deg); }
.retention-slip > span { font-size:.53rem; letter-spacing:.08em; color:#9dcabe; }
.retention-slip svg { display:block; width:100%; margin-top:.7rem; }
.retention-slip b { font-weight:500; font-size:1.25rem; line-height:1.2; }
.webinar-poster { position:absolute; width:94%; height:25rem; left:0; top:3%; overflow:hidden; border-radius:1rem; border:1px solid #a6bba240; transform:rotateY(-12deg) rotateZ(-3deg); background:#162f25; }
.webinar-poster img { height:45%; object-fit:cover; object-position:top; }
.webinar-poster > div { padding:1.4rem; }
.webinar-poster span { font-size:.54rem; letter-spacing:.12em; color:#9cc7ab; }
.webinar-poster h3 { font-size:2.3rem; line-height:1.05; margin-top:.7rem; font-weight:500; letter-spacing:-.04em; }
.webinar-poster p { font-size:.7rem; margin-top:.65rem; color:#b1c4b7; }
.session-slip { position:absolute; right:0; bottom:0; width:52%; padding:1.3rem; border-radius:.8rem; background:#e4e7d9; color:#20352a; transform:rotate(4deg); box-shadow:0 20px 40px #000a; }
.session-slip > span,.session-slip small { font-size:.62rem; color:#57705a; }
.session-slip b { display:block; font-size:1.35rem; font-weight:500; line-height:1.15; margin-top:.6rem; }
.session-slip ul { list-style:none; padding:0; display:flex; flex-direction:column; gap:.4rem; font-size:.7rem; margin:1rem 0; }
.session-slip li { border-top:1px solid #456b5225; padding-top:.4rem; }
.connection-source,.connection-result { position:absolute; padding:1.2rem 1.5rem; border:1px solid #c4a7843c; border-radius:.8rem; background:#28221b; box-shadow:0 18px 40px #000a; }
.connection-source { top:3%; left:0; transform:rotate(-4deg); }
.connection-source > span,.connection-result > span { display:block; font-size:.6rem; color:#c1a98a; }
.connection-source > b { display:block; font-size:1.7rem; color:#ffac7f; margin-top:.3rem; font-weight:500; }
.connection-source p,.connection-result p { font-size:.7rem; color:#c0b6a9; margin-top:.5rem; }
.connection-path { position:absolute; inset:10% 0 0; width:100%; height:75%; fill:none; stroke:#a789603f; stroke-width:1; }
.connection-video { position:absolute; top:28%; width:74%; right:1%; border:1px solid #8da2a246; border-radius:.65rem; overflow:hidden; background:#152a2d; box-shadow:0 20px 40px #0008; transform:rotateY(-12deg) rotate(3deg); }
.connection-video div { padding:.8rem; font-size:.85rem; }
.connection-result { bottom:0; left:4%; background:#1a302b; border-color:#b9ddc137; transform:rotate(-2deg); }
.connection-result > span { color:#a6ccba; }
.connection-result b { display:block; font-size:1.3rem; margin-top:.4rem; font-weight:500; }
.dynamic-back { position:absolute; width:82%; top:7%; right:0; transform:rotateY(-18deg) rotateZ(5deg); }
.dynamic-front { position:absolute; width:91%; top:24%; left:0; transform:rotateY(-12deg) rotateZ(-4deg); }
.dynamic-front p { padding:1.2rem; font-size:1.05rem; background:#18292d; text-align:center; }
.dynamic-front mark { background:none; color:#f6b18e; }
.provider-note { display:grid; grid-template-columns:1fr 1fr; gap:2rem 4rem; align-items:center; padding:3rem 0; border-top:1px solid #b6c0c12b; }
.provider-note h2 { font-size:2.8rem; line-height:1.1; font-weight:500; }
.provider-note p { line-height:1.7; color:#adbdc4; }
.provider-note a { grid-column:2; }
.context-switcher { max-width:70rem; margin:2.5rem auto 0; }
.context-tabs { display:flex; width:fit-content; max-width:100%; margin:0 auto; padding:.3rem; gap:.3rem; border:1px solid #8ca2ab38; background:#10191d; border-radius:2rem; }
.context-tabs button { border:0; background:none; padding:.8rem 1.5rem; border-radius:2rem; color:#9faeb5; cursor:pointer; font-size:.9rem; transition:background-color 200ms,color 200ms; }
.context-tabs button[aria-selected=true] { background:#29383b; color:#f4f4e9; box-shadow:0 1px 0 #bdd2c536 inset; }
.context-composition { height:39rem; position:relative; perspective:1800px; margin-top:2rem; }
.context-composition::before { content:''; position:absolute; right:0; top:3rem; width:40%; height:65%; background:repeating-linear-gradient(-35deg,#7a9e9c22 0 1px,transparent 1px 12px); mask-image:linear-gradient(90deg,transparent,#000); border-radius:2rem; }
.context-screen { position:absolute; width:78%; left:0; top:5%; transform:rotateY(-9deg) rotateZ(-2deg); }
.context-screen > img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; object-position:top; }
.context-instruction { position:absolute; right:0; top:18%; width:29%; padding:1.6rem; border:1px solid #c3b49442; border-radius:.9rem; background:#2a2920; color:#eee9d9; box-shadow:0 20px 45px #0009; transform:rotate(3deg); }
.context-instruction > span,.context-caption > span { font-size:.6rem; color:#c5bba2; letter-spacing:.1em; }
.context-instruction p { font-size:1.3rem; line-height:1.5; margin-top:1rem; }
.context-instruction b { display:block; font-size:.65rem; font-weight:400; color:#b9b3a0; padding-top:1.2rem; }
.context-caption { position:absolute; bottom:2%; left:16%; width:67%; padding:1.5rem 2rem; border:1px solid #93b6ae44; border-radius:.9rem; background:#162c2c; box-shadow:0 20px 45px #000a; transform:rotate(-1deg); }
.context-caption p { font-size:1.55rem; line-height:1.3; margin:.7rem 0; }
.context-caption mark { color:#ffc091; background:transparent; border-bottom:1px solid #ffc091; }
.tour-panel > .visual { height:36rem; width:95%; align-self:center; }
.tour-panel .transcript-sheet { top:12%; }
.tour-panel .visual-transcript .note-bottom { bottom:8%; }
.dream-deck-media { overflow:hidden; background:radial-gradient(ellipse at 60% 20%,#70614a25,transparent 75%),#0b1012; display:flex; align-items:center; }
.dream-deck-media .visual { width:94%; margin:auto; }
.dream-deck-media .visual-share .visual-window { width:100%; left:0; }
.connect-layout > .visual { height:35rem; }
.tour-panels::before,.tour-panels::after { opacity:.5; }
.video-dialog { position:fixed; inset:0; z-index:300; background:#070c10eF; border:0; width:100vw; height:100dvh; max-width:none; max-height:none; padding:5rem max(1rem,7vw); color:#fff; }
.video-dialog::backdrop { background:#070c10eF; }
.video-dialog[open] { display:flex; flex-direction:column; justify-content:center; }
.video-dialog iframe { display:block; width:100%; aspect-ratio:16/9; max-height:75dvh; border:0; background:#101419; }
.video-dialog button { position:absolute; top:1.3rem; right:1.5rem; border:1px solid #8ba2a94a; border-radius:2rem; padding:.65rem 1.2rem; color:#fff; background:#14202c; cursor:pointer; }
.video-dialog > a { text-align:center; margin-top:1rem; font-size:.85rem; text-decoration:underline; text-underline-offset:3px; }
.generation-preview video { width:100%; height:100%; object-fit:cover; display:block; }
.preview-play { position:absolute; top:1rem; right:1rem; border:1px solid #fff6; border-radius:2rem; background:#152027df; color:#fff; padding:.6rem .85rem; font-size:.7rem; cursor:pointer; }
.voice-settings { position:absolute; width:95%; top:5%; left:0; border:1px solid #a0b2ab4a; border-radius:.8rem; overflow:hidden; transform:rotateY(-10deg) rotateZ(-3deg); box-shadow:0 20px 40px #0008; }
.voice-rewrite { position:absolute; width:77%; right:0; bottom:0; padding:1.5rem; border:1px solid #acc6b64d; border-radius:.9rem; background:#1b302b; box-shadow:0 22px 40px #0009; transform:rotate(3deg); }
.voice-rewrite > span { font-size:.55rem; letter-spacing:.12em; color:#a6c8b3; }
.voice-rewrite h3 { font-size:2rem; font-weight:500; letter-spacing:-.03em; line-height:1.08; padding:.75rem 0; }
.voice-rewrite p { font-size:1.08rem; line-height:1.4; color:#c5d8ca; }
.voice-rewrite > div:last-child { display:flex; align-items:center; justify-content:space-between; border-top:1px solid #c3d7c32a; margin-top:1rem; padding-top:.8rem; font-size:.58rem; color:#b4cbbd; gap:1rem; }
.voice-rewrite > div:last-child b { color:#d4ebd6; font-weight:500; font-size:.7rem; }
.integration-recipe { padding:2.5rem; }
.integration-recipe > span { display:block; font-size:.6rem; letter-spacing:.13em; color:#a3b8b1; padding:1.7rem 0 .7rem; }
.integration-recipe > div { border:1px solid #bbc4b831; border-radius:.7rem; padding:1.2rem; background:#152724; }
.integration-recipe b { font-size:1.5rem; font-weight:500; }
.integration-recipe p { margin-top:.4rem; color:#a5b9af; font-size:.85rem; line-height:1.6; }
.integration-recipe .recipe-message { font-size:1.6rem; line-height:1.2; color:#e0e8d9; }
.recipe-message mark { background:none; color:#ffb894; }
.integration-recipe .recipe-link { font-size:.85rem; color:#b3d6c0; }
.integration-directory .hd { max-width:45rem; }
.welcome-window { position:absolute; top:8%; left:0; width:96%; border:1px solid #b7bcc347; border-radius:.85rem; overflow:hidden; background:#1b2536; transform:rotateY(-10deg) rotateZ(-2deg); box-shadow:0 25px 50px #000a; }
.welcome-message { padding:1.5rem; background:radial-gradient(ellipse at 100% 0,#8894b22a,transparent 70%); }
.welcome-message > span,.coaching-source > span { font-size:.57rem; letter-spacing:.12em; color:#b9b4cd; }
.welcome-message h3,.coaching-source h3 { font-size:2rem; line-height:1.1; font-weight:500; letter-spacing:-.04em; margin-top:1rem; }
.welcome-message p,.coaching-source p { font-size:.8rem; color:#b8c1d0; margin-top:.8rem; }
.welcome-people { display:flex; align-items:center; padding-top:1.4rem; }
.welcome-people > span { display:grid; place-items:center; width:2.3rem; height:2.3rem; border-radius:50%; border:2px solid #1c2330; background:#d5cfc2; color:#313742; margin-right:-.5rem; font-size:.8rem; }
.welcome-people > span:nth-child(2) { background:#909faf; }
.welcome-people > span:nth-child(3) { background:#978dac; }
.welcome-people b { font-size:.68rem; color:#b9c6d0; font-weight:400; padding-left:1.1rem; }
.welcome-chapters { background:#131b26; padding:1rem 1.5rem; display:flex; flex-direction:column; gap:.85rem; font:400 .6rem var(--mono); color:#8d9dae; }
.welcome-chapters b { font:400 .85rem var(--disp); color:#c9d0dc; padding-left:.9rem; }
.visual-welcome { height:34rem; }
.visual-welcome .comment-slip { bottom:1%; width:74%; background:#29253bef; }
.coaching-source { padding:1.6rem; min-height:12rem; background:#373042; }
.coaching-source h3 { font-size:1.5rem; margin-top:.7rem; }
.campaign-source { position:relative; }
.campaign-source > span { display:block; padding:.6rem; background:#152e22; font-size:.6rem; }
.dream-marketing .clip-tile img { opacity:.55; }
.replay-source { position:absolute; width:94%; top:5%; left:0; transform:rotateY(-10deg) rotateZ(-3deg); overflow:hidden; border-radius:.8rem; box-shadow:0 20px 45px #0009; }
.replay-moments { position:absolute; width:73%; right:0; bottom:0; padding:1.4rem; border:1px solid #a7c3bc3d; border-radius:.85rem; background:#203430; box-shadow:0 24px 50px #000a; transform:rotate(3deg); }
.replay-moments > span { font-size:.53rem; letter-spacing:.11em; color:#a9c9bb; }
.replay-moments h3 { font-size:1.8rem; line-height:1.1; letter-spacing:-.035em; font-weight:500; margin:.7rem 0 1.1rem; }
.replay-moments > div { padding:.65rem 0; border-top:1px solid #b9d1be2c; display:flex; flex-direction:column; gap:.25rem; }
.replay-moments b { font-size:.85rem; font-weight:500; }
.replay-moments div span { font-size:.62rem; color:#acbfb3; }
.visual-replay { height:35rem; }
.manifesto-opening { max-width:67rem; }
.manifesto-opening h1 { font-size:clamp(3.5rem,7vw,6.5rem); font-weight:500; letter-spacing:-.05em; line-height:1.03; margin-top:2.6rem; }
.manifesto-opening h1 em { font-style:normal; color:#ff655a; }
.manifesto-opening .lede { font-size:1.25rem; max-width:38rem; margin-top:2rem; }
.manifesto-principles { max-width:67rem; }
.manifesto-principles article { border-top:1px solid #a0b6bc36; padding:3.5rem 0; display:grid; grid-template-columns:.6fr 1.4fr; gap:1.5rem 3rem; }
.manifesto-principles article > span { font-size:.85rem; color:#c6957e; padding-top:.45rem; }
.manifesto-principles h2 { font-size:clamp(2.5rem,4vw,3.7rem); font-weight:500; line-height:1.07; letter-spacing:-.04em; }
.manifesto-principles p,.manifesto-principles .text-link { grid-column:2; }
.manifesto-principles p { max-width:39rem; color:#aebabf; font-size:1.05rem; line-height:1.7; }
.visual-proof { height:35rem; }
.proof-backing { position:absolute; top:9%; right:2%; width:68%; border:1px solid #7fa6a42f; border-radius:.75rem; overflow:hidden; transform:rotateY(-16deg) rotateZ(5deg); opacity:.75; }
.proof-plane { display:block; position:absolute; top:7%; left:5%; width:70%; height:27rem; background:#101416; border:1px solid #b4c6c24a; border-radius:.7rem; overflow:hidden; box-shadow:0 20px 50px #000b; transform:rotateY(-8deg) rotateZ(-2deg); cursor:zoom-in; }
.proof-plane img { width:100%; height:100%; object-fit:contain; object-position:top; }
.proof-label { position:absolute; bottom:1%; right:1%; width:67%; padding:1.3rem; border:1px solid #9ebcb244; background:#182d2c; border-radius:.7rem; box-shadow:0 18px 40px #000a; transform:rotateZ(2deg); }
.proof-label span { font-size:.57rem; letter-spacing:.06em; color:#a1bcb2; }
.proof-label p { font-size:1.4rem; line-height:1.2; color:#e6eee6; margin:.6rem 0; }
.proof-transcript-editing .proof-plane,.proof-watch-transcript .proof-plane,.proof-watch-theme .proof-plane,.proof-webinar-schedule .proof-plane,.proof-studio-captions .proof-plane { width:60%; left:8%; }
.proof-analytics .proof-plane,.proof-studio-effects .proof-plane,.proof-avatar-setup .proof-plane { width:96%; height:auto; left:0; top:10%; }
.proof-analytics .proof-plane img,.proof-studio-effects .proof-plane img { height:auto; }
.dream-page .phero { padding-top:6.6rem; }
.dream-page .dream-hero-grid { margin-top:2.5rem; }
@media(min-width:1600px) { .visual { height:33rem; } }
@media(max-width:1050px) {
 .dream-hero-grid { gap:1.5rem; }
 .dream-hero h1 { font-size:3.1rem; }
 .story-copy { padding:2rem; }
 .visual { height:29rem; }
 .context-composition { height:34rem; }
 .context-instruction { padding:1.2rem; }
 .context-instruction p { font-size:1.1rem; }
}
@media(max-width:800px) {
 .dream-hero { padding-top:6.5rem; }
 .dream-hero-grid { grid-template-columns:1fr; margin-top:2rem; gap:2.5rem; }
 .dream-hero-copy { max-width:42rem; }
 .dream-hero h1 { max-width:22ch; font-size:clamp(2.5rem,7vw,3.8rem); }
 .dream-hero .lede { max-width:48ch; }
 .dream-hero-picture { width:min(100%,42rem); margin:auto; }
 .visual { height:34rem; max-width:42rem; margin-inline:auto; }
 .story-card,.story-card-reverse { grid-template-columns:1fr; position:relative; top:auto; padding:.4rem; }
 .story-copy,.story-card-reverse .story-copy { order:0; padding:2rem 1.5rem; }
 .story-picture,.story-card-reverse .story-picture { order:1; }
 .story-copy h2 { font-size:2.3rem; }
 .story-copy > p { max-width:46ch; }
 .story-cards { gap:2rem; }
 .story-picture .visual { max-width:38rem; }
 .provider-note { grid-template-columns:1fr; gap:1.5rem; }
 .provider-note a { grid-column:auto; }
 .context-composition { height:33rem; }
 .context-screen { width:90%; }
 .context-instruction { top:30%; width:38%; padding:1rem; }
 .context-instruction p { font-size:1rem; }
 .context-caption { width:82%; left:5%; bottom:0; }
 .context-caption p { font-size:1.25rem; }
 .tour-panel > .visual { height:34rem; }
}
@media(max-width:500px) {
 .scene.is-v2 .scene__view { aspect-ratio:1.25; margin-top:.5rem; }
 .studio-home .hero__title { font-size:clamp(2rem,7.5vw,2.6rem); line-height:1.09; max-width:23ch; }
 .studio-home .hero__sub { font-size:.94rem; line-height:1.5; margin-top:1rem; }
 .dream-hero { padding-top:6rem; padding-bottom:2.5rem; }
 .dream-hero h1 { font-size:clamp(2.2rem,9.6vw,3rem); }
 .dream-hero .lede { font-size:1rem; }
 .dream-actions { gap:1.2rem; }
 .dream-actions .btn { padding:.95rem 1.3rem; }
 .visual { height:30rem; }
 .visual::before { right:1%; }
 .visual-share { height:25rem; }
 .visual-share .visual-window { width:100%; left:0; top:9%; transform:rotateZ(-2deg); }
 .visual-source { margin:.6rem .5rem 0; font-size:.61rem; }
 .visual-transcript { height:32.5rem; }
 .transcript-sheet { width:94%; left:0; transform:rotateZ(-1deg); top:12%; }
 .transcript-content { padding:1rem; }
 .transcript-content > p { font-size:1.05rem; }
 .voice-patch p { font-size:.95rem; }
 .edit-context { top:0; }
 .visual-transcript .note-bottom { bottom:0; left:0; }
 .floating-note { padding:.65rem .8rem; font-size:.7rem; }
 .form-plane { width:77%; padding:1.2rem; top:20%; right:1%; transform:rotateZ(-2deg); }
 .form-plane h3 { font-size:1.45rem; }
 .conversion-background { width:100%; left:0; top:1%; transform:rotateZ(-3deg); }
 .visual-convert .note-bottom { bottom:0; }
 .comment-slip { width:82%; bottom:19%; right:0; padding:.9rem; }
 .comment-slip p { font-size:.84rem; }
 .visual-share .note-bottom { bottom:1%; left:0; }
 .webpage-plane { width:98%; top:0; transform:rotateZ(-2deg); }
 .help-content { padding:1.2rem; }
 .help-content h3 { font-size:1.55rem; }
 .embed-chip { bottom:1%; width:61%; padding:1rem; }
 .embed-chip b { font-size:1.35rem; }
 .slide-source { width:90%; top:1%; }
 .slide-card { width:61%; height:17rem; padding:1.2rem; }
 .slide-card h3 { font-size:1.9rem; }
 .slide-front { top:34%; transform:rotateZ(4deg); }
 .slide-back { top:42%; left:0; }
 .slide-caption { font-size:.68rem; bottom:0; }
 .visual-slides { height:34rem; }
 .clips-source { width:86%; top:0; }
 .clip-portrait { width:45%; height:21rem; top:23%; }
 .clip-square { width:50%; height:13rem; top:50%; left:0; }
 .visual-clips { height:34rem; }
 .clip-tile > span { font-size:1.1rem; }
 .clip-tile mark { font-size:.83rem; }
 .clip-note { bottom:0; font-size:.55rem; }
 .clip-note strong { font-size:.7rem; }
 .avatar-preview { width:100%; top:5%; transform:rotateZ(-2deg); }
 .script-slip { width:85%; top:48%; padding:1.1rem; }
 .script-slip p { font-size:1.12rem; }
 .visual-avatar { height:29rem; }
 .visual-voice { height:32rem; }
 .voice-rewrite { width:91%; padding:1.2rem; }
 .voice-rewrite h3 { font-size:1.8rem; }
 .voice-rewrite p { font-size:1rem; }
 .integration-recipe { padding:1.5rem; }
 .visual-welcome { height:36rem; }
 .welcome-window { width:100%; top:0; }
 .welcome-message { padding:1.2rem; }
 .welcome-message h3 { font-size:1.7rem; }
 .welcome-chapters { padding:1rem 1.2rem; }
 .visual-welcome .comment-slip { width:90%; bottom:0; }
 .visual-replay { height:35rem; }
 .replay-moments { width:87%; padding:1.2rem; }
 .replay-moments h3 { font-size:1.7rem; }
 .manifesto-opening h1 { font-size:3.6rem; }
 .manifesto-opening .lede { font-size:1.1rem; }
 .manifesto-principles article { grid-template-columns:1fr; gap:1.1rem; padding:2.5rem 0; }
 .manifesto-principles p,.manifesto-principles .text-link { grid-column:auto; }
 .manifesto-principles h2 { font-size:2.4rem; }
 .generation-preview { width:98%; top:0; height:23rem; transform:rotateZ(-2deg); }
 .prompt-slip { width:94%; padding:1.2rem; }
 .prompt-slip p { font-size:1.5rem; }
 .recording-window { top:4%; transform:rotateZ(-2deg); }
 .recorder-slip { width:96%; left:0; bottom:18%; }
 .visual-record { height:24rem; }
 .analytics-window { top:5%; transform:rotateZ(-2deg); }
 .retention-slip { width:80%; bottom:3%; }
 .visual-analytics { height:27rem; }
 .visual-proof { height:33rem; }
 .proof-plane { width:87%; height:25rem; left:0; top:0; transform:rotateZ(-2deg); }
 .proof-label { width:80%; padding:1.1rem; bottom:0; }
 .proof-label p { font-size:1.2rem; }
 .proof-transcript-editing .proof-plane,.proof-watch-transcript .proof-plane,.proof-watch-theme .proof-plane,.proof-webinar-schedule .proof-plane,.proof-studio-captions .proof-plane { width:80%; left:0; }
 .proof-analytics .proof-plane,.proof-studio-effects .proof-plane,.proof-avatar-setup .proof-plane { width:98%; top:7%; }
 .proof-analytics,.proof-studio-effects { height:27rem; }
 .webinar-poster { width:96%; height:24rem; transform:rotateZ(-2deg); }
 .session-slip { width:60%; padding:1rem; }
 .session-slip b { font-size:1.15rem; }
 .visual-webinar { height:33rem; }
 .connection-source { padding:1rem; }
 .connection-video { width:90%; top:31%; }
 .connection-result { padding:1rem; }
 .visual-connect { height:29rem; }
 .dynamic-back { width:85%; top:3%; }
 .dynamic-front { width:97%; top:24%; transform:rotateZ(-3deg); }
 .dynamic-front p { font-size:.95rem; padding:1rem; }
 .visual-dynamic { height:28rem; }
 .visual-dynamic .note-bottom { left:0; }
 .story-copy,.story-card-reverse .story-copy { padding:1.8rem 1.1rem; }
 .story-copy h2 { font-size:2rem; }
 .story-copy > p { font-size:.97rem; line-height:1.6; }
 .story-details { font-size:.79rem; gap:.65rem; }
 .story-picture { padding:.4rem; }
 .context-tabs { width:100%; justify-content:space-between; }
 .context-tabs button { font-size:.76rem; padding:.7rem .9rem; }
 .context-composition { height:34rem; margin-top:1.7rem; }
 .context-screen { width:100%; top:0; transform:rotateZ(-2deg); }
 .context-instruction { width:73%; top:35%; right:0; padding:1rem 1.2rem; }
 .context-instruction p { font-size:1.02rem; line-height:1.4; margin-top:.6rem; }
 .context-instruction b { padding-top:.6rem; font-size:.6rem; }
 .context-caption { width:94%; left:0; padding:1rem 1.2rem; bottom:0; }
 .context-caption p { font-size:1.18rem; }
 .context-caption .voice-wave { height:1.1rem; }
 .demo-bar { font-size:.58rem; padding:.6rem; }
 .tour-panel > .visual { width:95%; height:32rem; margin-bottom:1rem; }
 .tour-panel .visual-record { height:25rem; }
 .tour-panel .visual-transcript .note-bottom { bottom:0; }
 .tour-panel .visual-dynamic { height:27rem; }
 .dream-deck-media .visual { width:96%; }
 .provider-note h2 { font-size:2.2rem; }
 .close-copy h2 { font-size:2.5rem; }
 .close-acts { width:100%; }
 .close-acts .btn { font-size:.88rem; padding:.95rem 1.1rem; }
 .video-dialog { padding:4rem .5rem; }
}
@media(prefers-reduced-motion:reduce) {
 .visual-entrance { opacity:1; translate:0 0; transition:none; }
 .scene.is-v2 .scene__stage { display:none; }
 .close-acts .btn,.context-tabs button { transition:none; }
 .close-acts .btn:hover { transform:none; }
 .story-card { position:relative; top:auto; }
}