:root{--bg:#080a08;--panel:#10130f;--panel2:#151915;--text:#f4f6ef;--muted:#a6aea1;--line:#242b22;--accent:#b8ff42;--max:1240px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;line-height:1.6}.noise{position:fixed;inset:0;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");z-index:20}.site-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px max(24px,calc((100vw - var(--max))/2));background:rgba(8,10,8,.85);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.06)}.brand{font:700 19px/1 Space Grotesk;text-decoration:none;color:#fff;letter-spacing:-.04em}.brand span{color:var(--accent)}.nav{display:flex;gap:26px}.nav a,.text-link{color:var(--muted);text-decoration:none;font-size:14px}.nav a:hover,.text-link:hover{color:#fff}.button{display:inline-flex;align-items:center;justify-content:center;background:var(--accent);color:#0b0d09;text-decoration:none;font-weight:700;border-radius:999px;padding:12px 18px;font-size:14px}.button.small{padding:9px 14px}.hero,.section,footer{width:min(var(--max),calc(100% - 48px));margin:auto}.hero{min-height:78vh;display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;padding:80px 0}.eyebrow,.tag{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--accent);margin:0 0 15px}.hero h1,.section h2{font-family:Space Grotesk;font-weight:600;letter-spacing:-.055em;line-height:.98;margin:0}.hero h1{font-size:clamp(52px,6.5vw,92px)}.hero h1 span{color:#adb4aa}.hero-text{font-size:18px;color:var(--muted);max-width:660px;margin:24px 0}.hero-actions{display:flex;align-items:center;gap:20px}.availability{margin-top:24px;color:var(--muted);font-size:13px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:8px;box-shadow:0 0 18px rgba(184,255,66,.65)}.hero-collage{display:grid;grid-template-columns:1.1fr .9fr;grid-template-rows:1fr 1fr;gap:10px;aspect-ratio:1/1;border-radius:24px;overflow:hidden;transform:rotate(1.2deg)}.hero-collage img{width:100%;height:100%;object-fit:cover;min-height:0}.hero-collage img:first-child{grid-row:1/3}.section{padding:90px 0;border-top:1px solid var(--line)}.intro-strip{padding:25px 0;display:flex;gap:30px;align-items:center;overflow:hidden}.intro-strip>p{white-space:nowrap;color:var(--muted);font-size:12px}.ticker{display:flex;gap:35px;white-space:nowrap;font:600 12px Space Grotesk;color:#d7ddd3}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:38px}.section h2{font-size:clamp(38px,5vw,64px)}.section-note{max-width:460px;color:var(--muted);margin:0}.featured-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.project-card,.work-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:.25s ease}.project-card:hover,.work-card:hover{transform:translateY(-4px);border-color:#394134}.project-card{cursor:pointer}.hero-project{grid-column:1/3}.wide-project{grid-column:1/3}.media{background:#0b0d0a;overflow:hidden}.project-card .media{aspect-ratio:16/9}.hero-project .media{aspect-ratio:21/9}.wide-project .media{aspect-ratio:21/8}.media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}.project-card:hover .media img,.work-card:hover .media img{transform:scale(1.025)}.project-info{padding:22px}.project-info h3,.card-copy h3{font:600 25px/1.08 Space Grotesk;letter-spacing:-.035em;margin:4px 0 10px}.project-info p:last-child,.card-copy p:last-child{color:var(--muted);margin:0;font-size:14px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.filter{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:999px;padding:9px 13px;cursor:pointer}.filter.active,.filter:hover{background:var(--accent);border-color:var(--accent);color:#090b08}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.work-card .media{aspect-ratio:16/10}.card-copy{padding:18px}.card-copy h3{font-size:20px}.about-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:70px}.about-copy p{font-size:18px;color:#d7dcd3}.timeline{display:grid;gap:12px}.timeline>div{padding:18px;border:1px solid var(--line);background:var(--panel);border-radius:14px}.timeline span{font-size:10px;letter-spacing:.13em;color:var(--accent);font-weight:700}.timeline h3{margin:5px 0 0;font:600 20px Space Grotesk}.timeline p{margin:4px 0;color:var(--muted)}.skills{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}.skills span{padding:9px 12px;border:1px solid var(--line);border-radius:999px;color:#d4d9d0;font-size:13px}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.process-grid>div{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px}.process-grid span{color:var(--accent);font:700 12px Space Grotesk}.process-grid h3{font:600 21px Space Grotesk;margin:18px 0 8px}.process-grid p{color:var(--muted);font-size:14px;margin:0}.contact{text-align:center;padding-bottom:120px}.contact h2{font-size:clamp(46px,6vw,78px)}.contact>p:not(.eyebrow):not(.location){color:var(--muted);font-size:18px}.contact-links{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:30px}.contact-links a{border:1px solid var(--line);border-radius:999px;padding:11px 15px;color:#fff;text-decoration:none}.contact-links a:hover{border-color:var(--accent);color:var(--accent)}.location{font-size:13px;color:var(--muted);margin-top:24px}footer{border-top:1px solid var(--line);padding:25px 0 40px;display:flex;justify-content:space-between;color:#747d70;font-size:12px}.project-modal{position:fixed;inset:0;z-index:80;display:none}.project-modal.open{display:block}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(8px)}.modal-panel{position:absolute;inset:3vh max(3vw,18px);max-width:1180px;margin:auto;background:#0c0f0b;border:1px solid #293026;border-radius:20px;overflow:auto;box-shadow:0 30px 90px rgba(0,0,0,.55)}.modal-close{position:sticky;float:right;top:15px;margin:15px 15px -65px 0;z-index:5;width:42px;height:42px;border:1px solid rgba(255,255,255,.15);border-radius:50%;background:rgba(0,0,0,.58);color:#fff;font-size:26px;cursor:pointer}.modal-media{background:#050605}.modal-media video,.modal-media img{display:block;width:100%;max-height:72vh;object-fit:contain}.modal-content{padding:36px 42px 50px}.modal-content h2{font:600 clamp(36px,5vw,62px)/1 Space Grotesk;letter-spacing:-.05em;margin:0 0 16px}.modal-lead{font-size:18px;color:#c6ccc1;max-width:850px}.case-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:10px;margin:28px 0}.case-grid>div{border:1px solid var(--line);border-radius:13px;padding:15px}.case-grid span{display:block;font-size:10px;color:var(--accent);font-weight:700;letter-spacing:.12em}.case-grid p{margin:7px 0 0;font-size:14px}.case-note{max-width:850px}.case-note h3{font:600 22px Space Grotesk;margin:0 0 8px}.case-note p{color:var(--muted)}.modal-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:28px}.modal-gallery img{width:100%;border-radius:12px;border:1px solid var(--line)}.modal-open{overflow:hidden}[hidden]{display:none!important}@media(max-width:900px){.nav{display:none}.hero{grid-template-columns:1fr;min-height:auto;padding:60px 0}.hero-collage{max-width:650px}.section-heading{align-items:start;flex-direction:column}.work-grid{grid-template-columns:repeat(2,1fr)}.about-layout{grid-template-columns:1fr}.process-grid{grid-template-columns:repeat(2,1fr)}.case-grid{grid-template-columns:1fr}.modal-content{padding:28px 22px 40px}}@media(max-width:620px){.site-header{padding:14px 18px}.site-header .button.small{display:none}.hero,.section,footer{width:min(100% - 28px,var(--max))}.hero{padding:46px 0}.hero h1{font-size:48px}.hero-actions{align-items:flex-start;flex-direction:column}.hero-collage{aspect-ratio:4/5}.intro-strip{display:none}.section{padding:64px 0}.featured-grid,.work-grid{grid-template-columns:1fr}.hero-project,.wide-project{grid-column:auto}.hero-project .media,.wide-project .media,.project-card .media{aspect-ratio:16/10}.project-info h3{font-size:22px}.process-grid{grid-template-columns:1fr}.modal-panel{inset:10px}.modal-gallery{grid-template-columns:1fr}footer{gap:12px;flex-direction:column}}


/* Showreel slot */
.showreel-placeholder{position:relative;overflow:hidden;border-radius:22px;aspect-ratio:16/9;background:#111;border:1px solid rgba(255,255,255,.08)}
.showreel-placeholder img{width:100%;height:100%;object-fit:cover;opacity:.62}
.showreel-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.58))}
.showreel-overlay span{font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:.14em;font-size:.8rem}
.showreel-overlay p{max-width:520px;color:rgba(255,255,255,.72);margin:.6rem 0 0}


/* Final publishing helpers */
.showreel-shell video{width:100%;display:block;aspect-ratio:16/9;object-fit:cover;background:#050505;border-radius:18px}
.showreel-shell video[hidden]{display:none}
.clickable-project:focus-visible,.filter:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:4px}
img{max-width:100%}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* Hero showreel: square 1080x1080 reel lives in the top-right hero slot. */
.hero-reel{position:relative;aspect-ratio:1/1;border-radius:24px;overflow:hidden;background:#0b0d0a;border:1px solid var(--line);transform:rotate(1.2deg)}
.hero-reel .hero-collage{width:100%;height:100%;border-radius:0;transform:none}
.hero-reel>video{width:100%;height:100%;display:block;object-fit:cover;background:#050605}
.hero-reel-label{position:absolute;left:18px;bottom:18px;z-index:2;display:flex;flex-direction:column;gap:2px;padding:9px 12px;border-radius:10px;background:rgba(8,10,8,.72);backdrop-filter:blur(8px);pointer-events:none}
.hero-reel-label span{font:700 10px Space Grotesk;letter-spacing:.14em;color:var(--accent)}
.hero-reel-label small{font-size:10px;color:#d7ddd3}
.hero-reel.is-live .hero-reel-label small{display:none}
@media(max-width:900px){.hero-reel{max-width:650px;width:100%}}
@media(max-width:620px){.hero-reel{aspect-ratio:1/1}}