.web-cases-section{position:relative;overflow:clip;background:#fff;padding-top:clamp(72px,9vw,112px);padding-bottom:clamp(72px,9vw,112px)}.web-cases-shell{position:relative;padding-block:clamp(8px,2vw,20px)}.web-cases-intro{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.75fr);gap:clamp(20px,4vw,56px);align-items:start;margin-bottom:clamp(36px,6vw,72px)}.web-cases-display{margin:0;font-family:var(--font-display);font-size:clamp(2.6rem,7vw,5.4rem);font-weight:700;letter-spacing:-.055em;line-height:.92;text-transform:uppercase;color:#101828}.web-cases-aside{margin:.35em 0 0;max-width:28rem;font-size:clamp(.95rem,1.4vw,1.05rem);line-height:1.55;color:var(--text-muted)}.web-cases-stage{position:absolute;left:0;right:0;top:38%;z-index:0;pointer-events:none;overflow:hidden}.web-cases-watermark{margin:0;white-space:nowrap;font-family:var(--font-display);font-size:clamp(4.5rem,14vw,10rem);font-weight:700;letter-spacing:-.04em;line-height:1;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px rgba(16,24,40,.1);transform:translate(-4%);-webkit-user-select:none;user-select:none}.web-cases-mosaic{position:relative;z-index:1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(24px,4vw,56px);row-gap:clamp(36px,6vw,72px);align-items:start;padding-bottom:clamp(12px,3vw,28px)}.web-case-shot{display:block;width:100%;text-decoration:none;color:inherit;background:transparent;border:0;border-radius:0;box-shadow:none;outline:none}.web-case-shot img{display:block;width:100%;height:auto;max-width:100%;border-radius:0;object-fit:contain;object-position:top center;background:#f3f4f6;transition:opacity .35s ease,filter .35s ease}.web-case-shot--large.web-case-shot--left{grid-column:span 7}.web-case-shot--small.web-case-shot--right,.web-case-shot--small.web-case-shot--left{grid-column:span 5}.web-case-shot--large.web-case-shot--right{grid-column:span 7}.web-case-shot--offset{margin-top:clamp(48px,10vw,140px)}.web-case-caption{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:start;margin-top:14px}.web-case-index{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.08em;color:var(--text-dim);padding-top:3px}.web-case-caption strong{display:block;font-family:var(--font-display);font-size:1.05rem;font-weight:700;letter-spacing:-.02em;line-height:1.2}.web-case-caption em{display:block;margin-top:3px;font-style:normal;font-size:.88rem;color:var(--text-muted)}.web-case-go{font-size:1.15rem;line-height:1;color:#101828;transition:transform .25s ease;padding-top:2px}.web-case-shot:hover img,.web-case-shot:focus-visible img{opacity:.92;filter:saturate(1.04)}.web-case-shot:hover .web-case-go,.web-case-shot:focus-visible .web-case-go{transform:translate(4px)}.web-case-shot:focus-visible .web-case-caption strong{text-decoration:underline;text-underline-offset:3px}body.web-case-scroll-lock{overflow:hidden;overscroll-behavior:none}.web-case-preview{position:fixed;inset:0;z-index:12000;display:grid;place-items:center;padding:clamp(18px,3.5vw,40px);background:#1414166b;backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);animation:web-case-preview-in .22s ease;overscroll-behavior:none}@keyframes web-case-preview-in{0%{opacity:0}to{opacity:1}}.web-case-preview-dialog{display:flex;flex-direction:column;min-height:0;width:min(1180px,94vw,calc((100vh - 56px)*1.55));aspect-ratio:16 / 10;max-height:calc(100vh - 56px);overflow:hidden;border-radius:12px;border:1px solid rgba(0,0,0,.18);background:#ececec;box-shadow:0 0 0 .5px #ffffff59 inset,0 1px 1px #0000000f,0 28px 80px #00000061,0 8px 24px #00000038;transform-origin:center center;animation:web-case-window-in .28s cubic-bezier(.2,.9,.2,1);transition:width .28s ease,height .28s ease,max-height .28s ease,aspect-ratio .28s ease,border-radius .28s ease}.web-case-preview-dialog.is-expanded{width:min(100vw - 28px,1480px);max-height:calc(100vh - 28px);height:calc(100vh - 28px);aspect-ratio:auto;border-radius:10px}@keyframes web-case-window-in{0%{opacity:0;transform:scale(.96) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.web-case-preview-titlebar{position:relative;display:grid;grid-template-columns:72px 1fr 72px;align-items:center;flex-shrink:0;height:44px;padding:0 14px;background:linear-gradient(180deg,#f6f6f6,#e8e8e8);border-bottom:1px solid rgba(0,0,0,.12);box-shadow:0 .5px #ffffffb3 inset;-webkit-user-select:none;user-select:none}.web-case-traffic{display:inline-flex;align-items:center;gap:8px}.web-case-traffic-btn{width:12px;height:12px;padding:0;border:0;border-radius:50%;cursor:pointer;box-shadow:0 0 0 .5px #0000002e inset,0 1px 1px #00000014;transition:filter .15s ease,transform .15s ease}.web-case-traffic-btn:hover{filter:brightness(1.05)}.web-case-traffic-btn:active{transform:scale(.92)}.web-case-traffic-btn.is-close{background:radial-gradient(circle at 35% 30%,#ff8e84,#ff5f57 55%,#e0443e)}.web-case-traffic-btn.is-minimize{background:radial-gradient(circle at 35% 30%,#ffd36a,#febc2e 55%,#dea123)}.web-case-traffic-btn.is-zoom{background:radial-gradient(circle at 35% 30%,#62e06b,#28c840 55%,#1aab29)}.web-case-preview-title{margin:0;text-align:center;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,sans-serif;font-size:13px;font-weight:600;letter-spacing:-.01em;color:#000000b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.web-case-traffic-spacer{display:block}.web-case-preview-frame{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;background:#fff;border-radius:0 0 11px 11px;overflow:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-x pan-y}.web-case-preview-dialog.is-expanded .web-case-preview-frame{border-radius:0 0 9px 9px}.web-case-preview-frame iframe{display:block;flex:1 1 auto;width:100%;height:0;min-height:0;border:0;background:#fff;overscroll-behavior:contain;touch-action:pan-x pan-y}.web-case-preview-static{display:flex;flex:1 1 auto;flex-direction:column;width:100%;height:0;min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;background:#f3f4f6}.web-case-preview-static img{display:block;width:100%;height:auto;flex:0 0 auto}.web-case-preview-static-bar{flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;padding:14px 18px;background:#101828;color:#e5e7eb;border-top:1px solid rgba(255,255,255,.08)}.web-case-preview-static-bar p{margin:0;flex:1 1 16rem;font-size:.875rem;line-height:1.45;color:#cbd5e1}.web-case-preview-open-live{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;padding:.55rem 1.1rem;border-radius:999px;font-size:.875rem;font-weight:600;text-decoration:none;color:#101828;background:#fff;transition:background .2s ease,transform .2s ease}.web-case-preview-open-live:hover{background:#f3f4f6}.web-case-preview-open-live:focus-visible{outline:2px solid #fff;outline-offset:2px}@media (max-width: 900px){.web-cases-intro{grid-template-columns:1fr;gap:16px;margin-bottom:36px}.web-cases-aside{margin-top:0;max-width:36rem}.web-cases-mosaic{grid-template-columns:1fr;row-gap:36px}.web-case-shot--large.web-case-shot--left,.web-case-shot--small.web-case-shot--right,.web-case-shot--small.web-case-shot--left,.web-case-shot--large.web-case-shot--right{grid-column:1}.web-case-shot--offset{margin-top:0}.web-case-shot--small{width:min(100%,92%);justify-self:end}.web-cases-watermark{font-size:clamp(3.2rem,18vw,6rem)}.web-case-preview-dialog{width:min(100%,94vw);height:min(72vh,640px);aspect-ratio:auto}}@media (max-width: 768px){.web-case-preview{place-items:stretch;padding:0}.web-case-preview-dialog,.web-case-preview-dialog.is-expanded{width:100%;max-width:none;height:100svh;height:100dvh;max-height:none;aspect-ratio:auto;border-radius:0;overflow:hidden}.web-case-preview-frame,.web-case-preview-dialog.is-expanded .web-case-preview-frame{border-radius:0}.web-case-preview-titlebar{grid-template-columns:56px 1fr 56px;height:40px;padding:0 10px}.web-case-preview-title{font-size:12px}.web-case-traffic-btn{width:14px;height:14px}.web-case-preview-static-bar{flex-direction:column;align-items:stretch;padding:12px 14px}.web-case-preview-open-live{width:100%;text-align:center}}@media (max-width: 640px){.web-case-shot--small{width:100%;justify-self:stretch}}@media (hover: hover) and (pointer: fine){.web-case-traffic:hover .web-case-traffic-btn.is-close:after,.web-case-traffic:focus-within .web-case-traffic-btn.is-close:after{content:"×";display:grid;place-items:center;font-size:9px;font-weight:700;line-height:1;color:#0000008c}.web-case-traffic:hover .web-case-traffic-btn.is-minimize:after,.web-case-traffic:focus-within .web-case-traffic-btn.is-minimize:after{content:"−";display:grid;place-items:center;font-size:10px;font-weight:700;line-height:1;color:#0000008c}.web-case-traffic:hover .web-case-traffic-btn.is-zoom:after,.web-case-traffic:focus-within .web-case-traffic-btn.is-zoom:after{content:"+";display:grid;place-items:center;font-size:9px;font-weight:700;line-height:1;color:#0000008c}.web-case-traffic-btn{display:grid;place-items:center}}