.video-case-page { background: var(--paper); }
.case-header { background: transparent; }
.back-link { display: inline-block; color: #b7cbd4; margin-bottom: 28px; font-size: 13px; text-underline-offset: 5px; }
.section-index { display: inline-block; color: var(--mint-deep); font-size: 13px; font-weight: 700; }
.case-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 42px; background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.15); }
.case-facts div { padding: 16px 18px; background: rgba(9,29,40,.65); }
.case-facts span, .case-facts strong { display: block; }
.case-facts span { color: #91abb6; font-size: 11px; }
.case-facts strong { font-size: 13px; margin-top: 4px; }
.demo-boundary { display: flex; gap: 13px; padding: 16px; background: rgba(255,255,255,.6); border-left: 4px solid var(--amber); font-size: 13px; }
.demo-boundary i { flex: 0 0 auto; width: 9px; height: 9px; margin-top: 6px; border-radius: 50%; background: var(--amber); }
.demo-boundary strong { display: block; }
.app-logo { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 8px 8px 8px 3px; background: var(--mint); color: var(--ink-deep); font-weight: 800; font-size: 18px; }
.video-hero { min-height: 735px; margin-top: -92px; padding: 176px max(24px, calc((100vw - var(--max)) / 2)) 90px; display: grid; grid-template-columns: 1.08fr .92fr; gap: 90px; align-items: center; color: white; background: radial-gradient(circle at 78% 48%, rgba(159,228,192,.12), transparent 23%), linear-gradient(118deg, var(--ink-deep), #153747 70%, #1e4a55); }
.video-hero h1 { font-size: clamp(48px, 6.2vw, 78px); }
.production-orbit { height: 455px; position: relative; border: 1px solid rgba(255,255,255,.12); background: rgba(9,29,40,.42); }
.production-orbit::before, .production-orbit::after { content: ""; position: absolute; left: 50%; top: 50%; translate: -50% -50%; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; width: 310px; height: 310px; }
.production-orbit::after { width: 190px; height: 190px; border-style: dashed; }
.orbit-center { position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: 112px; height: 112px; border-radius: 50%; display: grid; place-items: center; align-content: center; color: var(--ink-deep); background: var(--mint); z-index: 2; }
.orbit-center b { font-size: 38px; line-height: 1; }
.orbit-center span { font-size: 11px; }
.orbit-stage { position: absolute; display: flex; align-items: center; gap: 9px; padding: 9px 13px; min-width: 92px; border: 1px solid rgba(255,255,255,.18); background: #102f3f; font-size: 12px; }
.orbit-stage i { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--ink-deep); background: var(--sky); font-style: normal; font-size: 10px; }
.stage-brief { left: 7%; top: 13%; }.stage-script { right: 8%; top: 17%; }.stage-visual { right: 3%; bottom: 19%; }.stage-qc { left: 42%; bottom: 5%; }.stage-delivery { left: 4%; bottom: 24%; }
.video-story { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; padding: 110px 0 70px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; }
.story-lead h2, .video-solution h2, .video-role h2 { font-size: 42px; margin: 18px 0 25px; }
.story-lead p { color: var(--muted); font-size: 17px; }
.story-points { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); background: var(--line); gap: 1px; }
.story-points div { padding: 27px; background: white; }
.story-points b, .story-points span { display: block; }
.story-points span { color: var(--muted); margin-top: 7px; font-size: 13px; }
.video-solution { padding: 100px max(24px, calc((100vw - var(--max)) / 2)); display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; background: #dbe7eb; }
.video-solution ol { list-style: none; padding: 0; margin: 0; }
.video-solution li { display: grid; grid-template-columns: 42px 140px 1fr; gap: 12px; padding: 17px 0; border-top: 1px solid #afc2c9; }
.video-solution i { font-style: normal; color: var(--muted); font-size: 11px; }
.video-solution span { color: var(--muted); font-size: 14px; }
.video-role { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; padding: 110px 0; display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; }
.role-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.role-cards div { padding: 26px; border: 1px solid var(--line); background: white; }
.role-cards b, .role-cards span { display: block; }.role-cards span { margin-top: 7px; color: var(--muted); font-size: 13px; }
.video-demo-section { padding: 110px max(24px, calc((100vw - var(--max)) / 2)); background: #dbe7eb; }
.video-demo-intro { display: grid; grid-template-columns: .3fr .75fr 1fr 1fr; gap: 28px; margin-bottom: 42px; align-items: start; }
.video-demo-intro h2 { font-size: 42px; }.video-demo-intro > p { color: var(--muted); }
.video-app { overflow: hidden; border: 1px solid #afc3cb; background: white; box-shadow: 0 26px 70px rgba(13,34,48,.14); }
.video-app-bar { min-height: 72px; padding: 0 22px; display: flex; justify-content: space-between; align-items: center; color: white; background: var(--ink-deep); }
.video-app-bar > div:first-child { display: flex; align-items: center; gap: 12px; }.video-app-bar small { color: #8fa7b2; }
.batch-actions { display: flex; gap: 9px; }.batch-actions button { padding: 9px 13px; color: white; border: 1px solid #506b77; background: transparent; cursor: pointer; }.batch-actions .start-production { color: var(--ink-deep); border-color: var(--mint); background: var(--mint); font-weight: 700; }.batch-actions button:disabled { opacity: .45; cursor: default; }
.video-stats { display: grid; grid-template-columns: repeat(4,1fr); border-bottom: 1px solid var(--line); }.video-stats div { padding: 19px 22px; border-right: 1px solid var(--line); }.video-stats div:last-child { border: 0; }.video-stats span,.video-stats b { display:block; }.video-stats span { color: var(--muted); font-size: 11px; }.video-stats b { font-size: 24px; }
.batch-progress { padding: 15px 21px; background: #f4f8f9; border-bottom: 1px solid var(--line); }.batch-progress span { color: var(--muted); font-size: 12px; }.batch-progress > div { height: 4px; margin-top: 9px; overflow: hidden; background: #dbe5e9; }.batch-progress i { display: block; width: 0; height: 100%; background: var(--mint-deep); transition: width .25s ease; }
.video-workspace { display: grid; grid-template-columns: .95fr 1.05fr; min-height: 520px; }.video-task-list { border-right: 1px solid var(--line); }.video-task-row { width: 100%; padding: 18px 20px; display: grid; grid-template-columns: 28px 1fr auto; gap: 12px; align-items: start; text-align: left; color: var(--ink); border: 0; border-bottom: 1px solid #e0e8eb; background: white; cursor: pointer; }.video-task-row.selected { background: #eaf4f1; box-shadow: inset 4px 0 var(--mint-deep); }.video-task-row input { margin-top: 5px; accent-color: var(--mint-deep); }.video-task-row b,.video-task-row small { display:block; }.video-task-row small { color:var(--muted); margin-top:3px; }.video-state-pill { padding:4px 8px; border-radius:20px; font-size:10px; background:#e9f1f4; color:#486977; }.video-state-pill.failed { background:#fff0df; color:#895c1b; }.video-state-pill.delivered { background:#e3f4eb; color:#267251; }.video-state-pill.running { background:#e8eefb; color:#3c5e9b; }
.video-task-detail { padding: 30px 34px; }.video-detail-top { display:flex; justify-content:space-between; gap:18px; }.video-detail-top h3 { margin:0 0 4px; font-size:23px; }.video-detail-top p { color:var(--muted); font-size:12px; }.video-flow { display:grid; grid-template-columns:repeat(5,1fr); gap:7px; margin:25px 0; }.video-flow div { min-height:76px; padding:10px 8px; border:1px solid var(--line); text-align:center; }.video-flow i { width:24px;height:24px;margin:0 auto 6px;display:grid;place-items:center;border-radius:50%;font-style:normal;font-size:10px;border:1px solid #b9c9d0;color:#7d929b; }.video-flow span { font-size:11px; }.video-flow .complete i { background:var(--mint);border-color:var(--mint);color:var(--ink-deep); }.video-flow .current { border-color:var(--amber);background:#fffaf1; }.video-flow .failed { border-color:var(--coral);background:#fff3ef; }.video-flow .failed i { border-color:var(--coral);color:#9b4f3f; }
.task-brief { padding:15px 17px; background:#f4f8f9; color:var(--muted); font-size:13px; }.task-brief b { color:var(--ink); }.failure-card { margin-top:18px; padding:18px; border-left:4px solid var(--coral); background:#fff1ec; }.failure-card strong,.failure-card span { display:block; }.failure-card span { margin-top:5px;color:#795247;font-size:13px; }.task-actions { display:flex;gap:10px;margin-top:20px; }.task-actions button { padding:9px 13px;border:1px solid var(--line);background:white;color:var(--ink);cursor:pointer; }.task-actions .rework { background:var(--amber);border-color:var(--amber);font-weight:700; }.empty-task { color:var(--muted);text-align:center;padding:55px 20px; }
.video-boundary { width:min(calc(100% - 48px),var(--max)); margin:0 auto; padding:100px 0; display:grid; grid-template-columns:.65fr 1.35fr;gap:70px; }.video-boundary h2{font-size:38px}.video-boundary p{padding:18px 0;border-top:1px solid var(--line);color:var(--muted)}.video-boundary strong{color:var(--ink)}.video-case-page footer a{color:#c0d1d8}
@media(max-width:900px){.video-hero,.video-story,.video-solution,.video-role,.video-demo-intro,.video-boundary{grid-template-columns:1fr}.video-hero{padding-top:150px}.video-story,.video-role,.video-boundary{width:min(calc(100% - 32px),var(--max));gap:38px}.video-workspace{grid-template-columns:1fr}.video-task-list{border-right:0;border-bottom:1px solid var(--line);max-height:330px;overflow:auto}.video-demo-intro{gap:18px}}
@media(max-width:560px){.video-hero{margin-top:-76px;padding-top:120px;gap:45px}.video-hero h1{font-size:43px}.case-facts{grid-template-columns:1fr}.production-orbit{height:390px}.production-orbit::before{width:260px;height:260px}.production-orbit::after{width:150px;height:150px}.orbit-stage{min-width:80px;padding:7px 9px}.stage-script{right:2%}.stage-visual{right:1%}.stage-qc{left:36%}.story-points,.role-cards{grid-template-columns:1fr}.video-solution li{grid-template-columns:30px 1fr}.video-solution li span{grid-column:2}.video-demo-section{padding-top:75px}.video-app-bar{align-items:flex-start;padding:16px;gap:12px}.video-app-bar small{display:none}.batch-actions{flex-direction:column}.video-stats{grid-template-columns:1fr 1fr}.video-stats div:nth-child(2){border-right:0}.video-stats div:nth-child(-n+2){border-bottom:1px solid var(--line)}.video-task-detail{padding:25px 18px}.video-flow{grid-template-columns:1fr}.video-flow div{min-height:auto;display:grid;grid-template-columns:28px 1fr;align-items:center;text-align:left}.video-flow i{margin:0}.task-actions{flex-direction:column}}
@media(prefers-reduced-motion:reduce){.batch-progress i{transition:none}}

/* LINZO build-sheet visual pass */
.video-case-page{background:var(--paper)}.video-hero{min-height:790px;background:var(--ink-deep);grid-template-columns:1.08fr .92fr;position:relative;overflow:hidden}.video-hero::before{content:"QC / ON";position:absolute;right:-15px;bottom:-36px;color:rgba(255,255,255,.035);font-size:clamp(120px,16vw,250px);font-weight:900;letter-spacing:-.08em;line-height:1}.video-hero-copy,.production-orbit{position:relative;z-index:1}.video-hero h1{font-size:clamp(55px,6.5vw,88px);line-height:1.01;letter-spacing:-.065em}.case-facts{border:0;border-top:1px solid rgba(255,255,255,.28);background:transparent}.case-facts div{padding:18px 18px 4px 0;background:transparent}.case-facts div+div{padding-left:18px;border-left:1px solid rgba(255,255,255,.15)}
.production-orbit{height:480px;border:1px solid #6f858d;background:#f7f8f4;color:var(--ink);box-shadow:20px 22px 0 rgba(156,232,191,.07),0 35px 80px rgba(0,0,0,.25);transform:rotate(1deg)}.production-orbit::before,.production-orbit::after{border-color:#c2cdca}.orbit-head,.orbit-foot{position:absolute;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:13px 17px;font-size:9px;letter-spacing:.09em}.orbit-head{top:0;color:#91a6ad;background:#102f3c}.orbit-head i{color:var(--mint);font-style:normal}.orbit-foot{bottom:0;border-top:1px solid var(--line);background:#e9ece8;color:var(--muted)}.orbit-foot b{color:var(--mint-deep)}.orbit-center{border-radius:0;width:122px;height:122px}.orbit-stage{border-color:#aebcba;background:#edf0ec}.orbit-stage i{border-radius:0;background:var(--sky)}
.video-story{padding:125px 0 90px;grid-template-columns:.8fr 1.2fr}.story-lead h2,.video-solution h2,.video-role h2{font-size:48px;line-height:1.08;letter-spacing:-.05em}.story-points{border:0;border-top:5px solid var(--ink);box-shadow:0 24px 65px rgba(7,27,37,.07)}.story-points div{padding:31px}.video-solution{padding-top:120px;padding-bottom:120px;background:var(--paper-warm)}.video-solution li{grid-template-columns:50px 160px 1fr;padding:22px 0;border-color:#afbcb8}.video-solution i{color:var(--mint-deep);font-weight:800}.video-role{padding:125px 0}.role-cards{gap:0;border-top:5px solid var(--ink);box-shadow:0 22px 60px rgba(7,27,37,.06)}.role-cards div{padding:30px;border:0;border-bottom:1px solid var(--line)}.role-cards div:nth-child(even){border-left:1px solid var(--line)}
.video-demo-section{padding-top:125px;padding-bottom:135px;background:#dfe2dd}.video-demo-intro{grid-template-columns:.25fr .8fr 1fr;gap:34px}.video-demo-intro h2{font-size:50px;line-height:1.05;letter-spacing:-.05em}.video-demo-intro .demo-boundary{grid-column:3;background:transparent;border-top:4px solid var(--amber);border-left:0;padding:15px 0}.video-app{border:0;border-top:6px solid var(--ink-deep);box-shadow:18px 22px 0 #c8cfca,0 35px 80px rgba(7,27,37,.13)}.video-app-bar{min-height:80px}.app-logo{border-radius:0}.batch-actions button{min-height:44px}.video-stats div{padding:24px 26px}.video-stats b{font-size:32px;letter-spacing:-.05em}.batch-progress>div{height:6px}.video-task-row{padding:21px 23px}.video-task-row.selected{background:#e1eee7;box-shadow:inset 6px 0 var(--mint-deep)}.video-state-pill{border-radius:0}.video-task-detail{padding:38px 42px}.video-flow div{border-top:4px solid var(--line);border-left:0;border-right:0;border-bottom:0}.video-flow i{border-radius:0}.task-brief{border-top:1px solid var(--line)}.failure-card{border-left:0;border-top:5px solid var(--coral)}.task-actions button{min-height:44px}.video-boundary{padding:120px 0}.video-boundary h2{font-size:46px;letter-spacing:-.05em}
@media(max-width:900px){.video-hero,.video-story,.video-solution,.video-role,.video-demo-intro,.video-boundary{grid-template-columns:1fr}.video-demo-intro .demo-boundary{grid-column:auto}}
@media(max-width:560px){.video-hero{min-height:auto}.video-hero h1{font-size:49px}.case-facts div+div{padding-left:0;border-left:0}.production-orbit{height:420px;transform:none}.video-demo-intro h2,.story-lead h2,.video-solution h2,.video-role h2{font-size:39px}.role-cards{grid-template-columns:1fr}.role-cards div:nth-child(even){border-left:0}.video-app{box-shadow:8px 10px 0 #c8cfca}.video-task-detail{padding:27px 20px}}