:root{--bg: #0A0A0A;--surface: #131311;--text: #F2F0EA;--text-muted: #8A887F;--border: #232320;--accent: #E8442A;--font-display: "Space Grotesk", sans-serif;--font-body: "Inter", sans-serif;--container: 1180px;--gutter: 24px}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased}body{overflow-x:hidden}a{color:inherit;text-decoration:none}img,video{max-width:100%;display:block}.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}.nav{position:sticky;top:0;z-index:20;background:#0a0a0ad9;backdrop-filter:blur(6px);border-bottom:1px solid var(--border)}.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}.nav-name{font-family:var(--font-display);font-weight:500;font-size:15px;letter-spacing:.5px;text-transform:uppercase}.nav-links{display:none;gap:28px;font-size:13px;color:var(--text-muted)}.nav-links a:hover{color:var(--text)}.nav-cta{font-size:12px;letter-spacing:.5px;text-transform:uppercase;border:1px solid var(--border);padding:8px 16px;border-radius:2px;white-space:nowrap}.nav-cta:hover{border-color:var(--text-muted)}@media (min-width: 900px){.nav-links{display:flex}}.hero{padding:96px 0 56px;border-bottom:1px solid var(--border)}.hero-eyebrow{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);margin:0 0 20px}.hero-title{font-family:var(--font-display);font-weight:500;font-size:clamp(48px,11vw,128px);line-height:.92;letter-spacing:-1px;text-transform:uppercase;margin:0}.hero-sub{max-width:480px;color:var(--text-muted);font-size:16px;line-height:1.6;margin:28px 0 0}.section-label{font-family:var(--font-display);font-weight:500;font-size:20px;text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px}.section-label:before,.section-label:after{content:""}.section-head{display:flex;align-items:baseline;justify-content:space-between;padding:40px 0 20px}.section-count{font-size:13px;color:var(--text-muted)}.portfolio-grid{display:grid;grid-template-columns:1fr;gap:28px;padding-bottom:8px}.work-card{position:relative}.work-preview{position:relative;aspect-ratio:4 / 5;background:var(--surface);border-radius:4px;overflow:hidden}.work-preview.is-featured{aspect-ratio:16 / 9}.work-preview.is-vertical{aspect-ratio:4 / 5}.work-preview.is-vertical .js-lazy-video{object-fit:contain;background:#000}.work-preview video,.work-preview .ph{width:100%;height:100%;object-fit:contain;background:#000}.js-lazy-video{width:100%;height:100%;object-fit:cover;display:block;background:var(--surface)}.play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;border:none;background:#0a0a0a8c;color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(2px);transition:opacity .2s ease,background .2s ease}.play-btn svg{margin-left:3px}.play-btn:hover{background:#0a0a0abf}.work-preview.is-playing .play-btn,.work-preview.is-loading .play-btn{opacity:0;pointer-events:none}@media (min-width: 769px){.play-btn{display:none}}.sound-btn{position:absolute;bottom:12px;right:12px;width:34px;height:34px;border-radius:50%;border:none;background:#0a0a0a99;color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .2s ease,background .2s ease;z-index:5}.sound-btn:hover{background:#0a0a0ad9}.work-preview.is-playing .sound-btn{opacity:1;pointer-events:auto}@media (max-width: 768px){.sound-btn{display:none}}.sound-btn .icon-unmuted,.sound-btn.is-unmuted .icon-muted{display:none}.sound-btn.is-unmuted .icon-unmuted{display:block}.ph{display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:12px;letter-spacing:.5px;text-transform:uppercase;text-align:center;padding:12px;background:repeating-linear-gradient(135deg,#17171490,#17171490 10px,#1c1c1890 10px 20px)}.work-meta{display:flex;align-items:baseline;gap:12px;padding:14px 2px 0}.work-index{font-family:var(--font-display);font-size:13px;color:var(--text-muted)}.work-title{font-family:var(--font-display);font-weight:500;font-size:17px;text-transform:uppercase;letter-spacing:-.2px;flex:1}.work-tag{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}@media (min-width: 640px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1000px){.portfolio-grid{grid-template-columns:repeat(3,1fr);gap:32px 28px}}.work-card.is-featured{grid-column:1 / -1}.approach-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--border);border:1px solid var(--border);margin-bottom:40px}.approach-item{background:var(--bg);padding:28px 24px}.approach-item h3{font-family:var(--font-display);font-weight:500;font-size:16px;text-transform:uppercase;margin:0 0 10px;letter-spacing:.3px}.approach-item p{color:var(--text-muted);font-size:14px;line-height:1.6;margin:0}@media (min-width: 700px){.approach-grid{grid-template-columns:repeat(2,1fr)}}.contact{padding:72px 0 80px;border-top:1px solid var(--border)}.contact-title{font-family:var(--font-display);font-weight:500;font-size:clamp(40px,9vw,96px);text-transform:uppercase;line-height:.95;letter-spacing:-1px;margin:0 0 32px}.contact-links{display:flex;flex-wrap:wrap;gap:12px 28px;font-size:14px;color:var(--text-muted)}.contact-links a{border-bottom:1px solid transparent}.contact-links a:hover{color:var(--text);border-color:var(--text)}footer{padding:24px 0 40px;color:var(--text-muted);font-size:12px}.loading-spinner{position:absolute;top:50%;left:50%;width:30px;height:30px;margin:-15px 0 0 -15px;border:2.5px solid rgba(242,240,234,.25);border-top-color:var(--text);border-radius:50%;opacity:0;pointer-events:none;transition:opacity .15s ease}.work-preview.is-loading .loading-spinner{opacity:1;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.back-to-top{position:fixed;bottom:24px;right:24px;width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:#0a0a0ad9;backdrop-filter:blur(6px);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .2s ease,transform .2s ease,border-color .2s ease;z-index:30}.back-to-top.is-visible{opacity:1;transform:translateY(0);pointer-events:auto}.back-to-top:hover{border-color:var(--text-muted)}@media (min-width: 769px){.back-to-top{bottom:32px;right:32px}}
