.case-media-panel{padding:0!important;background-color:#f7f4ed;background-image:linear-gradient(rgba(21,153,186,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(21,153,186,.035) 1px,transparent 1px);background-size:52px 52px;overflow:hidden!important}
.case-media-shell{width:100%;height:100%;display:grid;grid-template-columns:minmax(300px,31%) 1fr;grid-template-rows:minmax(0,1fr) 154px;overflow:hidden}
.case-media-copy{grid-row:1/3;padding:clamp(28px,4.5vh,56px) clamp(26px,3.7vw,58px);border-right:1px solid var(--line);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}.case-eyebrow{margin:0 0 clamp(17px,2.5vh,28px);color:#087e9e;font:700 10px ui-monospace,Consolas,monospace;letter-spacing:.13em;display:flex;align-items:center;gap:14px}.case-eyebrow i{width:54px;height:1px;background:var(--cyan)}.case-media-copy h2{font:800 clamp(36px,3.8vw,60px)/1.16 "Songti SC",STSong,serif;letter-spacing:-.045em;margin:0}.case-media-lead{max-width:470px;margin:19px 0;color:#405b70;font:600 clamp(12px,.92vw,15px)/1.8 "Songti SC",STSong,serif}.case-tags{display:flex;gap:8px;flex-wrap:wrap}.case-tags span{padding:6px 11px;border:1px solid rgba(21,153,186,.58);border-radius:4px;background:rgba(255,253,248,.55);color:#167c95;font-size:10px}.media-status{margin-top:clamp(20px,3.5vh,42px);padding-top:14px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:5px 14px;position:relative;z-index:2}.media-status small{grid-column:1/-1;color:var(--cyan);font-size:8px;letter-spacing:.12em}.media-status strong{font:700 15px "Songti SC",STSong,serif}.media-status span{font:9px ui-monospace,monospace;color:var(--muted);align-self:center}.case-line{position:absolute;left:-70px;right:10%;bottom:4%;height:105px;opacity:.3}.case-line:before,.case-line:after,.case-line i{content:"";position:absolute;left:0;bottom:15px;width:270px;height:74px;border:1px solid var(--cyan);border-right:0;border-radius:80px 0 0 0;transform:skewX(24deg)}.case-line:after{left:22px;bottom:1px}.case-line i:nth-child(1){left:45px;bottom:29px}.case-line i:nth-child(2){left:165px;bottom:9px;width:370px;height:1px;border:0;border-top:1px solid var(--cyan);border-radius:0;transform:none}.case-line i:nth-child(3){left:154px;bottom:41px;width:300px;height:1px;border:0;border-top:1px solid var(--cyan);border-radius:0;transform:none}
.case-media-panel .media-stage{min-width:0;min-height:0;padding:15px clamp(20px,2.8vw,44px) 9px;position:relative}.case-media-panel .stage-frame{width:100%;height:100%;margin:0;border:1px solid rgba(8,42,80,.17);border-radius:11px;overflow:hidden;background:#102538;position:relative;box-shadow:0 12px 35px rgba(8,42,80,.08)}.case-media-panel .stage-frame img,.case-media-panel .stage-frame video{width:100%;height:100%;display:block;object-fit:cover;background:#071521}.case-media-panel .stage-frame video{object-fit:contain}.case-media-panel .stage-frame [hidden]{display:none}.case-media-panel .stage-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(5,23,37,.3),transparent 30%);pointer-events:none}.case-media-panel .stage-frame figcaption{position:absolute;z-index:2;left:12px;bottom:11px;color:#fff;background:rgba(7,28,43,.72);backdrop-filter:blur(8px);padding:8px 12px;border-radius:4px;font-size:11px}.case-media-panel .stage-arrow{position:absolute;z-index:3;top:50%;width:38px;height:38px;margin-top:-19px;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(7,28,43,.42);color:#fff;cursor:pointer;transition:.2s}.case-media-panel .stage-arrow:hover{background:var(--ink)}.case-media-panel .stage-arrow.previous{left:31px}.case-media-panel .stage-arrow.next{right:54px}
.case-media-panel .media-browser{min-width:0;padding:5px clamp(20px,2.8vw,44px) 11px;display:grid;grid-template-columns:132px minmax(0,1fr) 46px;align-items:center;gap:14px}.case-media-panel .browser-heading strong{display:block;font:800 20px "Songti SC",STSong,serif}.case-media-panel .browser-heading span{display:block;margin-top:6px;font-size:8px;line-height:1.55;color:var(--muted)}.case-media-panel .thumbnail-pages{min-width:0}.case-media-panel .thumbnail-grid{display:none;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.case-media-panel .thumbnail-grid.active{display:grid}.case-media-panel .media-thumb{height:99px;padding:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--white);cursor:pointer;position:relative;opacity:.72;transition:.2s}.case-media-panel .media-thumb:hover,.case-media-panel .media-thumb.active{opacity:1;border-color:var(--cyan);box-shadow:0 0 0 2px rgba(21,153,186,.12)}.case-media-panel .media-thumb img{width:100%;height:100%;object-fit:cover;display:block}.case-media-panel .media-thumb span{position:absolute;right:5px;bottom:5px;min-width:22px;padding:3px 5px;border-radius:3px;background:rgba(7,28,43,.73);color:#fff;font:8px ui-monospace,monospace}.case-media-panel .video-thumb i{position:absolute;left:50%;top:50%;width:31px;height:31px;margin:-16px;border:1px solid #fff;border-radius:50%;display:grid;place-items:center;padding-left:2px;background:rgba(7,28,43,.45);color:#fff;font-style:normal;font-size:10px}.case-media-panel .page-controls{display:grid;gap:7px}.case-media-panel .page-controls button{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--muted);font:9px ui-monospace,monospace;cursor:pointer}.case-media-panel .page-controls button.active{background:var(--ink);border-color:var(--ink);color:#fff}
@media(min-width:761px) and (max-width:1100px){.case-media-shell{grid-template-columns:34% 66%}.case-media-copy{padding-left:24px;padding-right:24px}.case-media-panel .media-browser{grid-template-columns:94px 1fr 38px;padding-left:14px;padding-right:14px}.case-media-panel .browser-heading strong{font-size:16px}.case-media-panel .media-thumb{height:86px}.case-media-panel .page-controls button{width:32px;height:32px}.case-media-panel .stage-arrow.next{right:30px}}
@media(max-width:760px){.case-media-panel{height:calc(100dvh - 118px)!important;min-height:610px!important}.case-media-shell{grid-template-columns:1fr;grid-template-rows:135px minmax(0,1fr) 106px}.case-media-copy{grid-row:auto;padding:14px 16px 10px;border-right:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;align-content:center;column-gap:10px}.case-eyebrow{margin:0 0 7px;font-size:8px}.case-media-copy h2{font-size:29px;line-height:1.06}.case-media-lead{grid-column:1/-1;margin:7px 0 0;font-size:9px;line-height:1.5;max-width:none}.case-tags,.media-status,.case-line{display:none}.case-media-panel .media-stage{padding:8px 10px 5px}.case-media-panel .stage-frame{border-radius:7px}.case-media-panel .stage-frame figcaption{font-size:9px;padding:6px 8px;left:7px;bottom:7px}.case-media-panel .stage-arrow{width:32px;height:32px;margin-top:-16px}.case-media-panel .stage-arrow.previous{left:17px}.case-media-panel .stage-arrow.next{right:17px}.case-media-panel .media-browser{padding:4px 10px 7px;grid-template-columns:minmax(0,1fr) 29px;gap:6px}.case-media-panel .browser-heading{display:none}.case-media-panel .thumbnail-grid{gap:4px}.case-media-panel .media-thumb{height:76px;border-radius:4px}.case-media-panel .media-thumb span{font-size:6px}.case-media-panel .video-thumb i{width:24px;height:24px;margin:-12px}.case-media-panel .page-controls{gap:4px}.case-media-panel .page-controls button{width:27px;height:27px;font-size:7px}}
@media(max-height:700px) and (min-width:761px){.case-media-shell{grid-template-rows:minmax(0,1fr) 126px}.case-media-copy{padding-top:22px;padding-bottom:22px}.case-media-copy h2{font-size:42px}.case-media-lead{margin:12px 0}.media-status{margin-top:18px}.case-media-panel .media-thumb{height:82px}.case-media-panel .media-browser{padding-bottom:7px}}
.case-selector{width:min(100%,360px);margin:-10px 0 14px;padding:8px 30px 8px 10px;border:1px solid rgba(21,153,186,.45);background:rgba(255,253,248,.72);color:#275268;font-size:11px;outline:none}.case-selector:focus{border-color:var(--cyan)}
@media(max-width:760px){.case-selector{grid-column:2;margin:0;max-width:145px;padding:6px;font-size:9px;align-self:start}.case-media-copy h2{grid-column:1}.case-media-lead{grid-column:1/-1}}