.cinematic-width{width:calc(100% - 64px);max-width:1216px;margin:auto}.cinematic-page{padding:32px 0 40px}.cinematic-intro h1{font:700 40px/48px var(--heading-font);letter-spacing:-.035em}.cinematic-intro-note{max-width:798px;margin-top:16px;padding:32px 24px 24px;border-radius:12px;background:#f2f1ff url('../images/cinematic-product/glow.png') no-repeat calc(100% + 72px) -72px/240px;box-shadow:0 1px 2px #18213d12}.cinematic-intro-note>p{font:400 16px/26px var(--font);color:var(--ink)}.cinematic-intro-note small{display:flex;align-items:center;margin-top:12px;font:500 12px/18px var(--heading-font);color:#006d93}.cinematic-intro-note small svg{width:15px;height:16px;flex-shrink:0}.cinematic-workspace{display:grid;grid-template-columns:1.43fr 1fr;gap:40px;align-items:start;margin-top:42px}.cinematic-workspace>div{min-width:0}.cinematic-editor{padding:24px;border-radius:12px;background:white;box-shadow:0 3px 4px #18213d24}.cinematic-editor>header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}.cinematic-editor h2{display:flex;align-items:center;gap:12px;font:700 14px/22px var(--heading-font);letter-spacing:-.02em}.cinematic-dots{display:flex;gap:8px}.cinematic-dots i{width:12px;height:12px;border-radius:50%;background:#d7767a}.cinematic-dots i:nth-child(2){background:#a4cb66}.cinematic-dots i:nth-child(3){background:#65f4b9}.cinematic-editor header button{display:flex;align-items:center;padding:4px 8px;border-radius:8px;background:#e9ecff;font:600 10px/14px var(--heading-font);color:#394553}.cinematic-editor header button svg{width:14px;height:14px;color:#006d93}.cinematic-prompt{padding:16px;border-radius:14px;background:#f5f3ff}.cinematic-prompt p{font:400 12px/19.5px var(--font);color:var(--ink)}.cinematic-prompt p+p{margin-top:8px}.cinematic-prompt p:last-child{font-weight:600;color:#006d93}.cinematic-variable{padding:2px 7px;border-radius:3px;font-weight:600;background:#dce2ff;box-decoration-break:clone;-webkit-box-decoration-break:clone}.cinematic-variable.blue{background:#c3e7ff;color:#004b67}.cinematic-variable.mint{background:#a2f5d7;color:#006d50}.cinematic-variable.lime{background:#b1f843;color:#385000}.cinematic-example{display:flex;gap:8px;padding:16px;margin-top:16px;box-shadow:0 0 2px #18213d0b;border-radius:12px}.cinematic-example>svg{width:18px;height:18px;flex-shrink:0;color:#007653}.cinematic-example h3{font:600 10px/14px var(--heading-font);text-transform:uppercase;color:#394553;letter-spacing:.025em}.cinematic-example p{font:400 12px/18px var(--font);margin-top:4px;color:var(--ink)}.cinematic-quality{display:flex;align-items:flex-start;gap:16px;background:#f0e9ee;padding:24px;border-radius:12px;margin-top:24px}.cinematic-quality>span{width:40px;height:40px;background:#ffdbd7;color:#b6000e;border-radius:12px;display:grid;place-items:center;flex-shrink:0}.cinematic-quality svg{width:24px;height:24px}.cinematic-quality h3{font:600 12px/18px var(--heading-font);letter-spacing:.035em;color:#d30000;text-transform:uppercase}.cinematic-quality p{font:400 14px/22px var(--font);color:var(--ink);margin-top:4px}.cinematic-reference{min-width:0;padding:16px;background:#d0d0cf;border-radius:12px;box-shadow:inset 0 2px 5px white,inset 0 0 3px #fff8}.cinematic-reference>img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px}.cinematic-reference figcaption{margin-top:16px;background:#f3f1ff;border-radius:12px;padding:16px}.cinematic-reference figcaption header{display:flex;justify-content:space-between;gap:8px;font:500 10px/14px var(--heading-font);letter-spacing:.03em;color:#006d93}.cinematic-reference figcaption strong{font-weight:600;text-transform:uppercase;color:#394553}.cinematic-reference figcaption p{font:italic 400 12px/18px var(--font);margin-top:12px}.cinematic-reference dl{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:20px 0 0;align-items:start}.cinematic-reference dl>div{padding:8px;background:#e9ecff;border-radius:8px;min-width:0}.cinematic-reference dt{font:600 10px/14px var(--heading-font);color:#394553}.cinematic-reference dd{margin:4px 0 0;font:600 12px/18px var(--font)}.cinematic-reference dl>div:last-child dd{color:#007653}.cinematic-production{margin-top:72px}.cinematic-page section>h2{font:700 28px/36px var(--heading-font);letter-spacing:-.035em}.cinematic-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start;margin-top:24px}.cinematic-steps article{padding:24px;background:white;border-radius:12px}.cinematic-steps article>span{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#c3e7ff;color:#00506b;font:700 18px/24px var(--heading-font);margin-bottom:8px}.cinematic-steps article:nth-child(2)>span{background:#65f4b9;color:#007653}.cinematic-steps article:nth-child(3)>span{background:#b1f843;color:#335000}.cinematic-steps h3{font:600 18px/26px var(--heading-font);letter-spacing:-.02em}.cinematic-steps p{font:400 14px/22px var(--font);margin-top:8px}.cinematic-steps code{font:500 10px/14px var(--font);background:#e9ecff;overflow-wrap:anywhere}.cinematic-steps small{display:flex;align-items:center;gap:3px;font:600 10px/16px var(--heading-font);letter-spacing:.02em;margin-top:20px;color:#006d93}.cinematic-steps small svg{width:12px;height:14px;flex-shrink:0}.cinematic-steps article:nth-child(2) small{color:#007653}.cinematic-steps article:nth-child(3) small{color:#67a900}.cinematic-faq{margin-top:48px}.cinematic-faq>div{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;margin-top:24px}.cinematic-faq details{padding:24px;border-radius:12px;background:white}.cinematic-faq details:first-child{min-height:124px}.cinematic-faq summary{display:flex;align-items:center;gap:4px;list-style:none;cursor:pointer;font:600 18px/26px var(--heading-font);letter-spacing:-.02em}.cinematic-faq summary::-webkit-details-marker{display:none}.cinematic-faq summary svg{width:18px;height:18px;color:#006d93;flex-shrink:0}.cinematic-faq p{font:400 14px/22px var(--font);margin-top:4px}.cinematic-related{margin-top:40px}.cinematic-related>header{display:flex;align-items:center;justify-content:space-between;gap:16px}.cinematic-related h2{font:600 22px/30px var(--heading-font);letter-spacing:-.03em}.cinematic-related header a{font:500 12px/18px var(--heading-font);color:#006d93}.cinematic-related>div{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.cinematic-related>div>a{display:flex;align-items:center;gap:16px;padding:24px;border-radius:12px;background:white}.cinematic-related-icon{display:grid;place-items:center;width:48px;height:58px;border-radius:12px;flex-shrink:0;background:#c3e7ff;color:#006d93}.cinematic-related-icon svg{width:26px;height:26px}.cinematic-related>div>a:nth-child(2) .cinematic-related-icon{background:#65f4b9;color:#007653}.cinematic-related small{font:600 10px/14px var(--heading-font);letter-spacing:.02em;color:#394553}.cinematic-related h3{font:600 18px/26px var(--heading-font);letter-spacing:-.02em;margin-top:4px}.cinematic-related p{font:400 12px/18px var(--font);margin-top:2px}.cinematic-related>div>a>span:last-child{margin-left:auto;font-size:26px;color:#74808d}.cinematic-cta{margin-top:40px;padding:40px;border-radius:12px;background:linear-gradient(105deg,#0098c7,#006d50,#86b900);box-shadow:0 7px 9px #18213d26}.cinematic-cta button{display:flex;align-items:center;gap:6px;padding:16px 40px;background:#d0d0d1;border-radius:40px;box-shadow:inset 0 3px 10px white;font:600 14px/20px var(--heading-font);letter-spacing:-.02em}.cinematic-cta svg{width:18px;height:18px;color:#006d93}.cinematic-copy-status{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);padding:12px 20px;border-radius:12px;background:#173e47;color:white;box-shadow:0 4px 18px #0003;z-index:100;display:none;font-size:14px}.cinematic-copy-status.visible{display:block}
@media(max-width:1100px){.cinematic-prompt-break{display:none}.cinematic-break{display:none}.cinematic-workspace{gap:24px;grid-template-columns:1.3fr 1fr}.cinematic-reference dl{grid-template-columns:1fr}.cinematic-related>div>a{padding:20px;gap:12px}.cinematic-reference dl>div{display:flex;justify-content:space-between;gap:8px}}@media(max-width:800px){.cinematic-width{width:calc(100% - 40px)}.cinematic-intro h1{font-size:34px;line-height:42px}.cinematic-workspace{grid-template-columns:1fr;margin-top:32px}.cinematic-reference dl{grid-template-columns:repeat(3,1fr)}.cinematic-reference dl>div{display:block}.cinematic-steps,.cinematic-faq>div,.cinematic-related>div{grid-template-columns:1fr;gap:20px}.cinematic-production{margin-top:40px}.cinematic-related>header{align-items:flex-start}.cinematic-cta{padding:28px 20px}.cinematic-cta button{padding:16px 24px}.cinematic-intro-note{padding:24px}}@media(max-width:440px){.cinematic-width{width:calc(100% - 32px)}.cinematic-intro h1{font-size:30px;line-height:38px}.cinematic-page section>h2{font-size:26px;line-height:34px}.cinematic-editor{padding:20px 16px}.cinematic-editor>header{flex-wrap:wrap}.cinematic-prompt{padding:14px}.cinematic-variable{overflow-wrap:anywhere}.cinematic-quality{padding:20px;gap:12px}.cinematic-reference dl{grid-template-columns:1fr}.cinematic-reference dl>div{display:flex;justify-content:space-between;gap:8px}.cinematic-faq summary{font-size:16px;line-height:24px}.cinematic-related>header{flex-direction:column;gap:8px}.cinematic-related h3{font-size:16px;line-height:24px}.cinematic-related small{overflow-wrap:anywhere}.cinematic-related-icon{width:36px;height:44px}.cinematic-cta button{padding-inline:16px;font-size:12px}.cinematic-intro-note small{align-items:flex-start}.cinematic-reference figcaption header{flex-wrap:wrap}}
