/* V4's open surfaces, glowing flow lines and chapter-sized presentation. */
body.cinematic-v5 { background:#090a0d; color:#f5f1e9; isolation:isolate; }
.film-backdrop {
  position:fixed; inset:0; z-index:-2; overflow:hidden; pointer-events:none;
  background:#0b0c0e; --scene-opacity:.52; --scene-scale:1.05;
}
.film-backdrop video,.film-poster {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:57% center; opacity:var(--scene-opacity); transform:scale(var(--scene-scale));
  transition:opacity 1.2s,transform 2s;
}
.film-backdrop video { opacity:0; }
.film-ready .film-backdrop video { opacity:var(--scene-opacity); }
.film-ready .film-poster { opacity:0; }
.film-shade { position:absolute; inset:0; background:linear-gradient(90deg,#050608e6 0%,#050608a1 32%,#05060838 68%,#05060840); }
.film-vignette { position:absolute; inset:0; background:linear-gradient(0deg,#090a0d9c,transparent 28%,transparent 70%,#090a0d80); }
.film-grain { position:absolute; inset:0; background-image:radial-gradient(#fff .6px,transparent .6px); background-size:28px 28px; opacity:.04; }
body[data-film-scene=product] .film-backdrop { --scene-opacity:.34; --scene-scale:1.18; }
body[data-film-scene=possibility] .film-backdrop { --scene-opacity:.46; --scene-scale:1.12; }
body[data-film-scene=closing] .film-backdrop { --scene-opacity:.52; --scene-scale:1.05; }
.cinematic-v5 .site-header { position:absolute; inset:0 0 auto; height:90px; z-index:5; border:0; }
.cinematic-v5 .hero {
  min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:115px 0 90px; scroll-margin-top:0;
}
.cinematic-v5 .hero:before { display:none; }
.cinematic-v5 .hero h1 { font-size:clamp(55px,min(7.2vw,10svh),114px); line-height:.99; }
.cinematic-v5 .hero .eyebrow { margin-bottom:22px; }
.cinematic-v5 .hero-intro { font-size:clamp(15px,1.15vw,19px); max-width:700px; margin-top:24px; line-height:1.7; }
.cinematic-v5 .hero-actions { margin-top:8px; }
.cinematic-v5 .hero-note { margin-top:18px; }
.intro-flow { position:relative; width:100%; height:160px; flex-shrink:0; margin-top:12px; }
.intro-wires { position:absolute; left:-4%; top:0; width:108%; height:100%; overflow:visible; }
.intro-traces { fill:none; stroke:url(#intro-wire-color); stroke-width:1.1; }
.intro-stream { fill:none; stroke:#ff7a61; stroke-width:2; stroke-dasharray:5 220; animation:intro-flow 6s linear infinite; filter:drop-shadow(0 0 5px #ff3029); }
.intro-node { position:absolute; top:calc(50% + 23px); transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:9px; min-width:100px; }
.intro-node:nth-of-type(1) { left:15%; }
.intro-node:nth-of-type(2) { left:38%; }
.intro-node:nth-of-type(3) { left:64%; }
.intro-node:nth-of-type(4) { left:86%; }
.intro-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:50%; font-size:22px; color:#ff8f7b; background:#150e0dda; outline:1px solid #9d352880; box-shadow:0 0 0 7px #a33c1010,0 0 32px #ff392e18; }
.intro-node strong { font-size:14px; font-weight:500; color:#e0d6d0; line-height:1.2; }
.intro-node small { font-size:8px; letter-spacing:1.1px; color:#ae8d83; line-height:1.5; }
.intro-approval .intro-icon { color:#fff; background:#b4261a; outline-color:#ff756277; }
@keyframes intro-flow { to { stroke-dashoffset:-900; } }
.hero-next { position:absolute; bottom:25px; left:50%; transform:translateX(-50%); }
.scene-next { display:flex; align-items:center; justify-content:center; gap:17px; font-size:8px; letter-spacing:1.5px; color:#c5a397; }
.scene-next>span:last-child { font-size:20px; color:#ff7866; animation:scene-down 2.5s ease-in-out infinite; }
@keyframes scene-down { 50% { translate:0 5px; } }

.cinematic-v5 main>.section {
  min-height:100svh; display:flex; flex-direction:column; justify-content:center;
  padding-block:clamp(55px,8vh,100px); scroll-margin-top:0;
}
.cinematic-v5 .walkthrough,.cinematic-v5 .finder-section,.cinematic-v5 .site-footer {
  background:transparent; border:0;
}
.cinematic-v5 .section-heading h2 { font-size:clamp(36px,4.3vw,64px); }
.cinematic-v5 .compact h2 { font-size:clamp(28px,2.8vw,42px); }
.cinematic-v5 .section-heading>p { font-size:14px; }
.cinematic-v5 .section-heading,.cinematic-v5 .result-story,.cinematic-v5 .finder-layout>div:first-child,.cinematic-v5 .signup-layout>div:first-child { text-shadow:0 2px 24px #0009; }
.cinematic-v5 .example-choices button {
  background:transparent; border:0; border-bottom:1px solid #ffffff30; border-radius:0;
  padding:19px 13px; box-shadow:none;
}
.cinematic-v5 .example-choices button[aria-selected=true] { background:#e4584c08; box-shadow:inset 0 -2px #ed6654; border-color:transparent; }
.cinematic-v5 .example-choices button:hover { background:#ffffff05; }
.cinematic-v5 .example-choices button>span:nth-child(2) { font-size:13px; }
.cinematic-v5 .example-choices small { color:#b4a8a2; font-size:10px; }
.cinematic-v5 .result-preview { border:0; border-radius:0; background:transparent; overflow:visible; gap:36px; min-height:425px; }
.cinematic-v5 .result-story { padding:24px 0; border:0; }
.cinematic-v5 .result-story h3 { font-size:clamp(28px,2.6vw,40px); }
.cinematic-v5 .result-app { background:transparent; padding:0 0 10px 28px; border-left:1px solid #ffffff1c; }
.cinematic-v5 .app-topbar { border-color:#ffffff25; }
.cinematic-v5 .preview-table td { border-color:#ffffff16; }
.cinematic-v5 .preview-table tr.highlight { background:#e4584c0b; }
.cinematic-v5 .board-column,.cinematic-v5 .board-item { background:transparent; border-radius:0; border-color:#ffffff20; }
.cinematic-v5 .board-item { border-width:0 0 1px; padding-inline:0; }
.cinematic-v5 .preview-change { border-color:#ffffff24; }
.cinematic-v5 .demo-toolbar { background:transparent; border-width:0 0 1px; border-color:#ffffff28; border-radius:0; padding-inline:0; }
.cinematic-v5 .event-demo { background:transparent; border:0; border-radius:0; overflow:visible; }
.cinematic-v5 .process-steps { padding:28px 0; border-color:#ffffff22; }
.cinematic-v5 .process-steps li>span { background:#08090b40; }
.cinematic-v5 .process-steps .current>span { background:#80292288; }
.cinematic-v5 .process-steps .complete>span { background:#294c3326; }
.cinematic-v5 .case-source { padding:28px 28px 20px 0; border-color:#ffffff1c; }
.cinematic-v5 .case-result { padding:28px 0 20px 28px; }
.cinematic-v5 .case-heading #case-id { color:#cb7975; }
.cinematic-v5 .lookup strong { color:#c5ab75; }
.cinematic-v5 .avatar { border-radius:3px; background:#ffffff08; color:#bec9d4; }
.cinematic-v5 .assignment strong { background:#ffffff05; border-color:#ffffff24; }
.cinematic-v5 .assignment strong.rule-changed { background:#84ba9520; border-color:#84ba9540; }
.cinematic-v5 .change-workflow { border-top:1px solid #ffffff22; padding-top:35px; }
.cinematic-v5 .rule-diff .rule-after { background:transparent; }
.cinematic-v5 .rule-diff .rule-after.active { background:#84ba9509; }
.cinematic-v5 .transfer-row,.cinematic-v5 .setup-grid article,.cinematic-v5 .workflow-details,.cinematic-v5 .data-details { border-color:#ffffff25; }
.cinematic-v5 .finder-section { background:linear-gradient(90deg,#14101120,transparent); }
.cinematic-v5 .finder-options button,.cinematic-v5 input,.cinematic-v5 textarea { background:#ffffff05; border-color:#ffffff29; border-radius:3px; }
.cinematic-v5 .finder-options button[aria-pressed=true] { background:#e1060010; border-color:#d87f6580; }
.cinematic-v5 .button:not(.primary) { background:transparent; border-color:#ffffff38; border-radius:3px; }
.cinematic-v5 .button:not(.primary):hover { background:#ffffff09; border-color:#d87f65; }
.cinematic-v5 .growth-details { border-color:#ffffff25; background:transparent; border-radius:0; }
.cinematic-v5 .growth-flow span { background:transparent; }
.cinematic-v5 .site-footer { padding-bottom:55px; }
.cinematic-v5 .signup-layout h2 { font-size:clamp(40px,5vw,78px); }
.cinematic-v5 .footer-bottom { border-color:#ffffff20; }

.scene-nav { position:fixed; right:16px; top:50%; transform:translateY(-50%); z-index:15; display:flex; flex-direction:column; gap:9px; }
.scene-nav a { width:20px; height:22px; position:relative; display:grid; place-items:center; }
.scene-nav a:after { content:''; width:4px; height:4px; background:#b49d9060; border-radius:50%; transition:background .2s,box-shadow .2s; }
.scene-nav a[aria-current=location]:after { background:#ff7f69; box-shadow:0 0 0 4px #d8482430; }
.scene-nav span { position:absolute; right:26px; top:0; padding:5px 9px; background:#121012ec; border:1px solid #ffffff20; border-radius:3px; font-size:9px; white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .2s; }
.scene-nav a:hover span,.scene-nav a:focus-visible span { opacity:1; }
.motion-control { position:fixed; right:24px; bottom:20px; z-index:20; background:#090a0ddb; backdrop-filter:blur(10px); border:1px solid #ffffff25; border-radius:3px; color:#d0bfb4; padding:11px 14px; font-size:10px; }
.motion-control:hover { color:white; border-color:#c67f65; }
.page-scroll-managed { scroll-behavior:auto; }
.motion-paused { scroll-behavior:auto; }
.page-hidden .intro-stream,.page-hidden .scene-next>span:last-child { animation-play-state:paused; }

@media(min-width:901px) and (max-height:850px) {
  .cinematic-v5 .hero { padding-top:105px; padding-bottom:73px; }
  .cinematic-v5 .hero h1 { font-size:clamp(48px,9svh,77px); }
  .cinematic-v5 .hero .eyebrow { margin-bottom:16px; }
  .cinematic-v5 .hero-intro { margin-top:18px; max-width:680px; font-size:15px; }
  .intro-flow { height:130px; margin-top:0; }
  .intro-icon { width:36px; height:36px; font-size:20px; }
  .intro-node { gap:7px; top:calc(50% + 22px); }
  .intro-node strong { font-size:12px; }
  .intro-node small { font-size:7px; }
  .cinematic-v5 .hero-note { margin-top:12px; }
  .hero-next { bottom:18px; }
  .cinematic-v5 main>.section { padding-block:44px; }
  .cinematic-v5 .examples .section-heading { margin-bottom:18px; }
  .cinematic-v5 .examples .eyebrow { margin-bottom:8px; }
  .cinematic-v5 .result-preview { min-height:365px; }
  .cinematic-v5 .result-story { padding-block:18px; }
  .cinematic-v5 .result-story h3 { font-size:30px; }
  .cinematic-v5 .input-note,.cinematic-v5 .your-part { margin-top:17px; }
  .cinematic-v5 .app-topbar { padding-block:15px; }
  .cinematic-v5 #app-preview-content { min-height:210px; padding-block:15px 10px; }
  .cinematic-v5 .choice-footer { padding-block:12px 18px; }
  .cinematic-v5 .demo-disclosure { margin-top:15px; }
}
@media(max-width:1100px) { .scene-nav { right:8px; } .cinematic-v5 .example-choices button>span:nth-child(2) { font-size:11px; } .cinematic-v5 .example-choices small { font-size:9px; } }
@media(max-width:900px), (any-pointer:coarse) {
  .scene-nav { display:none; }
  .cinematic-v5 main>.section { min-height:0; padding-block:65px; }
  .cinematic-v5 .hero { min-height:100svh; padding-top:120px; padding-bottom:90px; }
  .cinematic-v5 .hero h1 { font-size:clamp(48px,8vw,75px); }
  .cinematic-v5 .hero-intro { max-width:610px; }
  .cinematic-v5 .section-heading h2 { font-size:clamp(32px,5vw,44px); }
  .cinematic-v5 .compact h2 { font-size:30px; }
  .cinematic-v5 .section-heading>p { font-size:12px; }
  .film-backdrop video,.film-poster { object-position:68% center; }
  .film-shade { background:linear-gradient(90deg,#050608b0,#05060860),linear-gradient(0deg,#050608b0,transparent 80%); }
}
@media(max-width:850px) {
  .cinematic-v5 .result-preview { gap:18px; }
  .cinematic-v5 .result-story { padding:15px 0 22px; border-bottom:1px solid #ffffff1c; }
  .cinematic-v5 .result-app { border-left:0; padding:0 0 10px; }
  .cinematic-v5 .result-story h3 { font-size:32px; }
}
@media(max-width:560px) {
  .cinematic-v5 .site-header { height:80px; }
  .cinematic-v5 .hero { min-height:0; padding-top:117px; padding-bottom:88px; }
  .cinematic-v5 .hero h1 { font-size:clamp(39px,9.7vw,54px); }
  .cinematic-v5 .hero-intro { font-size:13px; line-height:1.8; margin-top:22px; }
  .cinematic-v5 .hero .eyebrow { margin-bottom:23px; }
  .intro-flow { width:100%; height:155px; margin-top:4px; }
  .intro-wires { left:-6%; width:112%; }
  .intro-node { min-width:0; width:74px; gap:8px; top:calc(50% + 26px); }
  .intro-node:nth-of-type(1) { left:9%; }.intro-node:nth-of-type(2) { left:36%; }.intro-node:nth-of-type(3) { left:64%; }.intro-node:nth-of-type(4) { left:91%; }
  .intro-icon { width:31px; height:31px; font-size:17px; }
  .intro-node strong { font-size:10px; line-height:1.4; min-height:28px; max-width:65px; }
  .intro-node small { display:none; }
  .cinematic-v5 .hero-actions { margin-top:5px; }
  .cinematic-v5 .hero-note { margin-top:21px; }
  .hero-next { bottom:24px; white-space:nowrap; font-size:7px; }
  .cinematic-v5 main>.section { padding-block:50px; }
  .cinematic-v5 .section-heading h2 { font-size:32px; }
  .cinematic-v5 .compact h2 { font-size:28px; }
  .cinematic-v5 .example-choices button { padding:15px 7px; }
  .cinematic-v5 .example-choices button>span:nth-child(2) { font-size:11px; }
  .cinematic-v5 .example-choices small { font-size:10px; }
  .cinematic-v5 .result-preview { gap:8px; }
  .cinematic-v5 .result-story { padding:18px 0 23px; }
  .cinematic-v5 .result-story h3 { font-size:29px; }
  .cinematic-v5 .result-app { padding:0; }
  .cinematic-v5 .case-source { padding:24px 0; }
  .cinematic-v5 .case-result { padding:24px 0; }
  .cinematic-v5 .process-steps { padding:24px 0; }
  .cinematic-v5 .change-workflow { padding-top:28px; }
  .cinematic-v5 .growth-details { padding:23px 0; border-inline:0; }
  .cinematic-v5 .signup-layout h2 { font-size:43px; }
  .cinematic-v5 .site-footer { padding-bottom:65px; }
  .motion-control { right:13px; bottom:12px; font-size:9px; padding:10px 12px; }
  body[data-film-scene=product] .film-backdrop { --scene-opacity:.26; }
}
@media(prefers-reduced-motion:reduce) {
  .intro-stream,.scene-next>span:last-child { animation:none; }
  .film-backdrop video,.film-poster { transform:none; transition:none; }
}