/* Product-led motion composition. The software is the object, not the backdrop. */
.cinema-hero{position:relative;height:1100px;margin:0 18px;background:#20221f;border-radius:5px;color:#f2f0e8;--hero-progress:0;--hero-tilt:9deg;--hero-turn:-8deg;--hero-scale:1;--hero-lift:0px;--copy-opacity:1;--note-opacity:1}
.cinema-stage{position:sticky;top:0;height:min(860px,100svh);min-height:670px;overflow:hidden;perspective:1800px;border-radius:5px;background:radial-gradient(ellipse at 63% 32%,#55503a66,transparent 52%),linear-gradient(145deg,#20251f,#171b18 65%)}
.cinema-meta{position:absolute;top:28px;left:4%;right:4%;display:flex;justify-content:space-between;gap:25px;font-size:8px;letter-spacing:1.4px;color:#c4c8b9;z-index:3}.cinema-meta>p{display:flex;gap:10px;align-items:center}.cinema-meta .orange-dot{width:5px;height:5px}.cinema-meta>span{color:#7f8978;font-size:7px}.ambient-orbit{position:absolute;width:730px;height:730px;left:50%;top:-70px;transform:translateX(-50%);border:1px solid #6e73552b;border-radius:50%;box-shadow:0 0 0 80px #747a5310,0 0 0 160px #747a5308;pointer-events:none}
.hero-device-wrap{position:absolute;left:50%;top:92px;width:min(74%,1000px);transform:translateX(-50%) translateY(var(--hero-lift)) scale(var(--hero-scale));transform-origin:center 25%;will-change:transform;z-index:1}.hero-device{transform:rotateX(var(--hero-tilt)) rotateY(var(--hero-turn)) rotateZ(-1deg);border:5px solid #51574b;border-bottom-width:9px;box-shadow:0 50px 80px #0009,12px 12px 0 -4px #0d120c;border-radius:13px;overflow:hidden;background:#fafbf7;transform-origin:center;transition:transform .12s linear}.device-top{height:33px;background:#e3e6dc;color:#6e7567;display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:8px;letter-spacing:.3px;border-bottom:1px solid #d4d8cc}.device-dots{font-size:6px;letter-spacing:4px;color:#acb5a1}.device-lock{font-size:7px}.device-workspace{display:grid;grid-template-columns:155px 1fr;color:#30362a}.device-sidebar{background:#f1f2eb;padding:23px 13px 14px;display:flex;flex-direction:column;gap:4px;border-right:1px solid #e4e7dc;font-size:9px}.device-sidebar img{width:112px;mix-blend-mode:multiply;margin:0 auto 17px}.device-sidebar small{font-size:6px;letter-spacing:1.3px;color:#8c9480;margin:0 7px 10px}.device-sidebar>span{padding:8px;border-radius:3px;line-height:1.4}.device-sidebar>span.selected{background:#f6e3cc;color:#9e4e10}.device-profile{margin-top:auto;padding:16px 4px 0;border-top:1px solid #dfe4d4;font-size:7px;color:#868e7b}.device-profile i{display:inline-grid;place-items:center;width:22px;height:22px;background:#dfe5d4;border-radius:50%;font-style:normal;margin-right:4px}.device-content .demo-body{min-height:350px;padding:27px 30px}.device-content .demo-head{margin-bottom:22px}.device-content .demo-head h3{font-size:23px}.device-content .demo-kpis strong{font-size:25px}.device-content .bars{height:122px}.device-content .demo-chart{gap:27px}.floating-note{position:absolute;z-index:2;background:#d8ddcc;color:#30392b;padding:17px 18px 21px;width:175px;border:1px solid #eff3e0;box-shadow:0 20px 40px #0004;opacity:var(--note-opacity);transform:translateY(calc(var(--hero-lift) * -.25));transition:transform .12s linear}.floating-note>span{display:block;font-size:6px;letter-spacing:1px;color:#68745b;margin-bottom:10px}.floating-note>strong{font-size:13px;line-height:1.6;font-weight:500}.floating-note>i{position:absolute;right:14px;bottom:14px;font-style:normal;color:#78856b;font-size:19px}.note-one{left:5%;top:175px;transform:translateY(calc(var(--hero-lift) * -.25)) rotate(-5deg)}.note-two{right:5%;top:330px;transform:translateY(calc(var(--hero-lift) * -.25)) rotate(5deg);background:#edb476;border-color:#f3cb99}.note-two>span,.note-two>i{color:#7d5229}.cinema-copy{position:absolute;left:4%;right:4%;bottom:75px;z-index:3;opacity:var(--copy-opacity);transform:translateY(calc(var(--hero-progress) * 40px))}.hero-product-name{font-size:13px;letter-spacing:.5px;color:#f4ad65;margin-bottom:12px;font-weight:700}.hero-product-name>span{font-size:10px;font-weight:400;color:#c0c7b4;margin-left:10px}.cinema-copy h1{font-size:clamp(47px,6.45vw,96px);font-weight:400;letter-spacing:-4px;line-height:1.08;white-space:nowrap;margin:0 0 24px}.cinema-copy h1 em{color:#edbd89;letter-spacing:-4.5px}.mobile-break{display:none}.cinema-bottom{display:flex;justify-content:space-between;align-items:center;gap:25px;padding-top:20px;border-top:1px solid #6d745442}.cinema-bottom>p{font-size:11px;color:#aeb79d;line-height:1.8;max-width:350px}.cinema-bottom>.text-button{color:#d9dfd0;font-size:11px}.cinema-bottom .play-icon{border-color:#78816b}.cinema-bottom>.button{background:#f1a455;border-color:#f1a455;color:#232b1c;font-weight:700;font-size:12px;min-height:47px}.cinema-bottom>.button:hover{background:#ffbb72}.cinema-scroll{position:absolute;bottom:20px;left:4%;right:4%;display:flex;align-items:center;font-size:7px;letter-spacing:1.3px;color:#849174;gap:18px}.cinema-scroll i{font-size:18px;font-style:normal}.cinema-scroll button{margin-left:auto;width:32px;height:32px;border:1px solid #69765b;border-radius:50%;background:transparent;color:#c2ceb1;font-size:10px}.cinema-hero .demo-chart .task-row{font-size:8px}.n-one-story{display:grid;grid-template-columns:1fr 1fr;gap:100px;padding-top:30px;padding-bottom:110px}.story-heading{position:sticky;top:80px;align-self:start}.story-heading .eyebrow{color:#a16633;font-size:8px;margin-bottom:24px}.story-heading h2{font-size:57px}.story-heading h2 em{color:#797e6e}.story-heading>p:not(.eyebrow){font-size:13px;line-height:1.9;color:#727868;max-width:350px;margin:24px 0 14px}.story-timeline{border-left:1px solid #d3d8c8;padding-left:35px}.story-timeline article{position:relative;padding:8px 0 40px;margin-bottom:25px;border-bottom:1px solid #dbe0d0}.story-timeline article:before{content:'';width:7px;height:7px;background:#bb681f;position:absolute;left:-39px;top:13px;border-radius:50%;box-shadow:0 0 0 6px var(--paper)}.story-timeline article>span{font-size:8px;color:#a06a3c;letter-spacing:1.4px}.story-timeline h3{font-size:25px;letter-spacing:-.7px;margin:14px 0}.story-timeline p{font-size:12px;color:#727868;line-height:1.9}.story-flow{display:flex;align-items:center;gap:8px;margin-top:22px}.story-flow>b{border:1px solid #d0d8c3;font-size:8px;font-weight:500;padding:7px 9px;border-radius:3px}.story-flow>i{font-size:11px;font-style:normal;color:#8d987e}.brand-interlude{background:#242821;color:#ebeee2;display:grid;grid-template-columns:1.1fr 1fr;min-height:400px;overflow:hidden}.brand-interlude-copy{padding:70px 0 70px max(9%,calc((100vw - 1440px)/2));align-self:center;position:relative;z-index:2}.brand-interlude-copy .eyebrow{font-size:8px;color:#c6a176;margin-bottom:25px}.brand-interlude h2{font-size:clamp(29px,3.5vw,52px);line-height:1.2;white-space:nowrap}.brand-interlude h2 em{color:#cfaa81}.brand-interlude-copy>p:last-child{font-size:11px;color:#b1b9a3;margin-top:25px;line-height:1.9}.brand-interlude .hero-art{min-height:400px;background:#242821;border-radius:0}.brand-interlude .hero-art video{opacity:.85;mix-blend-mode:lighten;object-fit:cover;transform:scale(1.25)}.sap-section{margin-top:0;background:#eceee5;color:var(--ink);padding-top:75px;padding-bottom:65px}.sap-section .eyebrow{color:#8e632b}.sap-section .section-heading>p{color:#6d7762;font-size:12px}.sap-section h2{font-size:40px}.sap-section .serif{color:#69765b;display:inline}.sap-explorer{border-color:#c4cdb7;grid-template-columns:255px 1fr}.addon-selector{border-color:#c4cdb7}.selector-heading{color:#738263}.addon-selector [role=tab]{color:#667159}.addon-selector [role=tab]:hover{color:#20291a}.addon-selector [aria-selected=true]{color:#985119;font-weight:700}.addon-selector [role=tab] span{color:#91a27e}#addon-panel .addon-description{color:#69765b}#addon-panel li{color:#4d5e3b;border-color:#d6dfca}#addon-panel .inline-link{color:#8e521f;border-color:#c4b29a}#addon-panel .addon-note{color:#6c7c5b}.addon-type{color:#5c6d4a;border-color:#bdcba8}.sap-note{color:#69795b}.sap-note>span,.sap-note>p{color:#6d7a5f}.sap-section .addon-visual{background:#2c3027}.sap-section .chat-bubble{color:#d9dfcf}
@media(min-width:1500px){.cinema-copy{bottom:90px}.hero-device-wrap{top:105px;width:1000px}.device-content .demo-body{min-height:390px;padding:35px}.device-content .bars{height:160px}.device-workspace{grid-template-columns:175px 1fr}.device-sidebar{padding:28px 18px}.note-one{top:220px}.note-two{top:380px}.cinema-copy h1{font-size:96px}}
@media(max-width:1100px){.hero-device-wrap{width:78%;top:125px}.device-workspace{grid-template-columns:120px 1fr}.device-sidebar{font-size:8px;padding:18px 10px}.device-sidebar img{width:90px}.device-content .demo-body{padding:22px;min-height:320px}.device-content .demo-head h3{font-size:19px}.device-content .demo-kpis strong{font-size:20px}.device-content .demo-chart{grid-template-columns:1fr}.device-content .demo-tasks{display:none}.device-content .bars{height:115px}.floating-note{width:145px;padding:13px}.floating-note>strong{font-size:11px}.note-one{left:3%;top:195px}.note-two{right:3%;top:345px}.cinema-copy h1{font-size:6.5vw;letter-spacing:-3px}.cinema-copy h1 em{letter-spacing:-3.5px}.cinema-bottom>p{font-size:10px}.n-one-story{gap:50px}.story-heading h2{font-size:48px}.story-flow{gap:5px}.story-flow>b{font-size:7px;padding:6px}.cinema-stage{min-height:720px}.cinema-hero{height:1100px}}
@media(max-width:800px){.cinema-hero{margin:0 12px;height:990px}.cinema-stage{min-height:700px;height:850px;max-height:100svh}.cinema-meta{top:23px;font-size:7px}.cinema-meta>span{display:none}.hero-device-wrap{width:87%;top:120px}.device-content .demo-body{padding:18px;min-height:315px}.device-content .demo-kpis strong{font-size:20px}.device-content .demo-head{margin-bottom:20px}.device-content .demo-head h3{font-size:18px}.floating-note{width:125px}.floating-note>strong{font-size:10px}.floating-note>span{font-size:5px}.note-one{top:165px;left:2%}.note-two{top:350px;right:2%}.cinema-copy{bottom:83px}.hero-product-name{font-size:12px}.cinema-copy h1{font-size:6.7vw;letter-spacing:-2px}.cinema-copy h1 em{letter-spacing:-2.5px}.cinema-bottom{flex-wrap:wrap;gap:15px}.cinema-bottom>p{flex:1;font-size:10px}.cinema-bottom>.text-button{font-size:10px}.cinema-bottom>.button{font-size:10px;gap:15px;padding:11px 15px}.n-one-story{gap:35px}.story-heading h2{font-size:41px}.story-timeline{padding-left:25px}.story-timeline article:before{left:-29px}.story-timeline h3{font-size:22px}.story-flow{flex-wrap:wrap}.brand-interlude{min-height:320px;grid-template-columns:1fr 1fr}.brand-interlude .hero-art{min-height:320px}.brand-interlude-copy{padding:40px 0 40px 10%}.brand-interlude h2{font-size:30px}.brand-interlude-copy>p:last-child{font-size:10px}.sap-explorer{grid-template-columns:190px 1fr}}
@media(max-width:640px){.cinema-hero{margin:0 9px;height:820px}.cinema-stage{height:780px;min-height:730px;max-height:none}.cinema-meta{left:6%;right:6%;top:23px;font-size:6px;letter-spacing:1.1px}.hero-device-wrap{top:92px;width:610px;left:50%;transform:translateX(-50%) translateY(calc(var(--hero-lift) * .4)) scale(.54);transform-origin:center top}.device-workspace{grid-template-columns:120px 1fr}.device-content .demo-body{padding:22px;min-height:340px}.device-content .demo-head h3{font-size:20px}.device-content .demo-kpis strong{font-size:25px}.device-content .demo-chart{display:block}.device-content .bars{height:145px}.device-content .demo-head p{font-size:9px}.device-content .demo-kpis span{font-size:9px}.device-content .demo-kpis small{font-size:8px}.device-content .demo-badge{font-size:8px}.device-sidebar{font-size:9px}.device-content .chart-title{font-size:11px}.device-content .chart-months{font-size:9px}.floating-note{width:125px;padding:10px 12px 12px}.note-one{left:4%;top:270px;transform:rotate(-5deg)}.note-two{right:4%;top:300px;transform:rotate(5deg)}.floating-note>strong{font-size:10px}.floating-note>span{font-size:5px;margin-bottom:5px}.floating-note>i{font-size:14px;bottom:8px;right:9px}.cinema-copy{left:6%;right:6%;bottom:79px}.hero-product-name{font-size:12px;margin-bottom:18px}.hero-product-name>span{font-size:8px;margin-left:6px}.cinema-copy h1{font-size:46px;line-height:1.06;white-space:normal;letter-spacing:-2.6px;margin-bottom:22px}.cinema-copy h1 em{letter-spacing:-2.6px;font-size:44px}.mobile-break{display:block}.cinema-bottom{padding-top:15px;display:grid;grid-template-columns:1fr;gap:13px}.cinema-bottom>p{font-size:11px}.cinema-bottom>.text-button{font-size:10px;padding:5px 0}.cinema-bottom>.button{font-size:12px;width:100%;padding:11px 18px;min-height:46px}.cinema-scroll{left:6%;right:6%;bottom:20px;font-size:6px}.cinema-scroll button{height:30px;width:30px}.ambient-orbit{width:500px;height:500px;top:-30px}.n-one-story{display:block;padding-top:10px;padding-bottom:45px}.story-heading{position:relative;top:auto}.story-heading h2{font-size:43px}.story-heading>p:not(.eyebrow){font-size:12px;max-width:none}.story-heading .inline-link{font-size:12px}.story-timeline{margin:35px 0 0 5px;padding-left:25px}.story-timeline h3{font-size:24px}.story-timeline p{font-size:12px}.story-timeline article{padding-bottom:28px;margin-bottom:20px}.story-flow>b{font-size:8px;padding:7px 8px}.brand-interlude{grid-template-columns:1fr;min-height:0}.brand-interlude-copy{padding:45px 6% 0}.brand-interlude-copy h2{font-size:32px;white-space:normal}.brand-interlude-copy>p:last-child{font-size:11px}.brand-interlude .hero-art{min-height:240px;aspect-ratio:1.8}.brand-interlude .hero-art video{object-fit:contain;transform:scale(1.3)}.sap-section{padding-top:55px}.sap-section h2{font-size:35px}.sap-section .serif{display:block}.sap-explorer{grid-template-columns:1fr}.addon-selector [role=tab]{border-color:#d2dcc6}}
@media(prefers-reduced-motion:reduce){.cinema-hero{height:auto}.cinema-stage{position:relative}.hero-device-wrap,.hero-device,.floating-note,.cinema-copy{will-change:auto;transition:none}.cinema-copy{opacity:1;transform:none}.floating-note{opacity:1}}
