:root{--bg:#151514;--surface:#232321;--ink:#f2f2ea;--muted:#b4b4ac;--accent:#f2f2ea;--font-display:"Helvetica Neue",Arial,sans-serif;--font-body:"Helvetica Neue",Arial,sans-serif;--gap:16px;--pad:32px}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:100px minmax(0,1fr) 76px;height:100svh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,.gallery:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button{border:0;background:none}button:disabled{opacity:.3;cursor:default}.header{display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad)}.wordmark{font-weight:800;font-size:50px;letter-spacing:-4px;line-height:1}.wordmark span{font-size:11px;letter-spacing:0;vertical-align:top;display:inline-block;margin:8px 0 0 9px}.menu-button{font-size:14px;padding:10px 0 10px 24px}.menu-button span{margin-left:28px;font-size:21px}main{min-height:0;min-width:0}.gallery{height:100%;display:flex;gap:var(--gap);overflow-x:auto;overflow-y:hidden;padding:0 var(--pad);scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);scrollbar-width:none;overscroll-behavior-x:contain}.gallery::-webkit-scrollbar{display:none}.panel{position:relative;flex:0 0 clamp(280px,29vw,490px);height:100%;overflow:hidden;scroll-snap-align:start;text-align:left;padding:0;background:var(--surface);isolation:isolate}.visual,.scrim{position:absolute;inset:0;z-index:-1}.visual{background-size:cover;background-position:center;transform:scale(1.025);transition:transform 1.2s cubic-bezier(.2,.65,.2,1),filter .6s;filter:saturate(.7)}.panel:hover .visual{transform:scale(1.07);filter:saturate(.95)}.scrim{background:linear-gradient(180deg,rgba(21,21,20,.12),rgba(21,21,20,.22) 30%,rgba(21,21,20,.55) 65%,rgba(21,21,20,.85))}.panel h2{position:absolute;top:47%;left:27px;right:20px;margin:0;font-family:var(--font-display);font-weight:700;font-size:clamp(28px,3.1vw,49px);line-height:1.04;letter-spacing:-1.6px;text-shadow:0 1px 20px rgba(21,21,20,.3)}.panel-bottom{position:absolute;left:28px;right:26px;bottom:28px;display:flex;justify-content:space-between;align-items:end;gap:20px;font-size:11px;line-height:1.6}.panel-bottom span:last-child{font-size:25px;line-height:1}.commerce .visual{background-image:url('https://spiel.company/wp-content/uploads/2023/10/DSC01053-e1696241454499.jpg')}.planning .visual{background-image:url('https://spiel.company/wp-content/uploads/2022/04/001.webp')}.web .visual{background-image:url('https://spiel.company/wp-content/uploads/2024/02/shr_xn8s8qu.jpg')}.ai .visual{background-image:url('https://spiel.company/wp-content/uploads/2024/02/woman-computer-chatgpt-7761176.jpg')}.travel .visual{background-image:url('https://spiel.company/wp-content/uploads/2023/11/00_AdobeStock_205999579.jpeg')}.oil-visual{background:radial-gradient(ellipse at 55% 23%,#b4b4ac 0%,#232321 48%,#151514 86%)}.ripple{position:absolute;width:120%;height:90%;border:1px solid rgba(242,242,234,.4);border-radius:50%;left:0;top:4%;transform:rotate(-35deg);box-shadow:inset 0 0 35px rgba(242,242,234,.15),0 0 60px rgba(242,242,234,.08)}.ripple:before,.ripple:after{content:"";position:absolute;inset:22px;border:1px solid rgba(242,242,234,.3);border-radius:50%}.ripple:after{inset:70px}.collab{font-size:1.25em}.footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 var(--pad);font-size:11px}.copyright{white-space:nowrap}.preview-note{color:var(--muted);font-size:10px;letter-spacing:.02em;margin:0}.gallery-controls{display:flex;align-items:center;gap:18px}.gallery-controls button{font-size:25px;padding:9px}.gallery-controls span{font-size:11px;font-variant-numeric:tabular-nums;min-width:28px}dialog{border:1px solid var(--surface);background:var(--bg);color:var(--ink);max-width:680px;width:calc(100% - 40px);padding:72px 48px 48px;max-height:85svh;overflow:auto}dialog::backdrop{background:rgba(21,21,20,.8);backdrop-filter:blur(9px)}.close{position:absolute;right:22px;top:15px;font-size:32px;padding:4px 10px}.dialog-label{font-size:12px;color:var(--muted);margin:0 0 26px}.dialog-label:empty{display:none}dialog h2{font-weight:500;font-size:clamp(26px,4vw,45px);letter-spacing:-1px;line-height:1.1;margin:0 0 30px}#detail-copy{font-size:15px;line-height:1.95;margin:0;max-width:55ch;white-space:pre-line}.contact-link{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--muted);padding:20px 0 14px;margin-top:35px}.menu-brand{font-size:60px;letter-spacing:-4px;font-weight:800;margin-bottom:35px}#menu nav{display:grid}#menu nav a{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-bottom:1px solid var(--surface);font-size:23px}#menu>p{color:var(--muted);font-size:11px;margin:35px 0 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1700px){.panel{flex-basis:28vw}}@media(max-width:700px){:root{--pad:20px;--gap:12px}body{grid-template-rows:80px minmax(0,1fr) 80px}.wordmark{font-size:42px}.panel{flex-basis:calc(100vw - 68px)}.panel h2{font-size:36px;left:25px;top:48%}.panel-bottom{left:25px;bottom:26px}.preview-note{position:absolute;bottom:7px;left:20px;font-size:9px}.footer{padding-bottom:10px}.gallery-controls{gap:14px}.menu-button{font-size:13px}dialog{padding:65px 28px 32px}.menu-brand{font-size:46px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.visual,.panel:hover .visual{transform:none}}@media(max-height:500px){body{grid-template-rows:65px minmax(0,1fr) 50px}.wordmark{font-size:36px}.panel h2{font-size:25px;top:30%}.panel-bottom{bottom:15px}.preview-note{display:none}}