:root{color-scheme:dark;--bg:#111110;--ink:#f4f3ed;--muted:#b3b3aa;--line:#3c3c36;--accent:#dfff00;font-family:Arial,Helvetica,sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}a:hover{color:var(--accent)}header{padding:27px 4%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:30px}.logo{font-size:30px;font-weight:900;letter-spacing:-2px}.logo span{font-size:12px;vertical-align:top;letter-spacing:0;margin-left:4px}nav{display:flex;gap:28px;align-items:center}nav a{font-size:14px;padding:8px 0}nav a[aria-current]{border-bottom:2px solid var(--accent)}.menu-toggle{display:none}.skip{position:absolute;left:10px;top:-100px;padding:12px;background:var(--accent);color:#111;z-index:10}.skip:focus{top:10px}main{min-height:70vh}.eyebrow{text-transform:uppercase;font-size:12px;letter-spacing:1.6px;font-weight:600;line-height:1.6}.home-hero{padding:27px 4% 40px;background:var(--accent);color:#111}.hero-top{display:flex;justify-content:space-between}.wordmark{font-family:Arial Black,Arial,Helvetica,sans-serif;font-size:clamp(5rem,26vw,30rem);line-height:.94;letter-spacing:-.075em;font-weight:900;margin:38px 0 26px;transform:scaleX(1.025);transform-origin:left}.hero-bottom{display:flex;justify-content:space-between;align-items:end;border-top:1px solid #111;padding-top:25px}.hero-bottom p{font-size:clamp(23px,3vw,42px);line-height:1.12;letter-spacing:-1px;margin:0}.round-link{border:1px solid #111;border-radius:100%;height:65px;width:65px;display:grid;place-items:center;font-size:32px}.round-link:hover{background:#111;color:var(--accent)}.home-index{display:grid;grid-template-columns:1fr 3fr;gap:50px;padding:55px 4% 75px}.home-index>div>a{display:flex;align-items:center;gap:25px;border-bottom:1px solid var(--line);padding:25px 0}.home-index h2{flex:1;font-size:clamp(22px,3vw,40px);font-weight:500;letter-spacing:-1px;margin:0}.home-index a>span:last-child{font-size:14px}.number{color:var(--muted);font-size:12px}.page-intro{padding:64px 4% 55px}.page-intro .eyebrow{color:var(--accent);margin:0 0 32px}h1{font-size:clamp(56px,8.5vw,130px);line-height:.94;letter-spacing:-.06em;font-weight:700;margin:0 0 30px}p{line-height:1.65}.lead{color:var(--muted);font-size:20px;max-width:620px;margin:0}.split{padding:50px 4% 70px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1.35fr;gap:9%}.split h2,.contact-block h2{font-size:clamp(35px,4.5vw,64px);line-height:1.05;letter-spacing:-.04em;font-weight:500;margin:28px 0}.split>div>p:not(.eyebrow){color:var(--muted);max-width:470px}.playlist{min-width:0}iframe{border:0;border-radius:12px;display:block;background:#202020}.text-link{display:inline-block;margin-top:20px;font-size:14px;border-bottom:1px solid var(--line);padding-bottom:6px}.credits{padding:40px 4% 80px;border-top:1px solid var(--line)}.brand-list{display:flex;flex-wrap:wrap;gap:32px 50px;margin-top:40px}.brand-list span{font-size:clamp(24px,3vw,40px);font-weight:700;letter-spacing:-1px}.film{margin:0 4% 60px;background:#1d1d19;aspect-ratio:16/9;display:grid;place-items:center;border:1px solid var(--line);overflow:hidden}.film-empty{text-align:center}.film-empty .eyebrow{color:var(--accent)}.film-empty p{font-size:clamp(26px,5vw,70px);letter-spacing:-.04em;margin:12px 0}.film-empty>span:last-child{font-size:14px;color:var(--muted)}video{width:100%;max-height:100%;display:block}.story-copy p{font-size:19px;margin-top:0;margin-bottom:28px}.reel-note{padding:0 4% 65px;color:var(--muted)}.contact-block{padding:45px 4% 95px;border-top:1px solid var(--line)}.email-link{font-size:clamp(25px,5vw,70px);color:var(--accent);overflow-wrap:anywhere}footer{margin:0 4%;padding:30px 0;display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid var(--line)}footer>span{font-size:12px;color:var(--muted)}@media(min-width:1600px){body{max-width:1900px;margin:auto}}@media(max-width:760px){header{flex-wrap:wrap;padding:20px 5%;gap:15px}.menu-toggle:not([hidden]){display:block;background:transparent;border:1px solid var(--line);color:var(--ink);padding:9px 15px}nav{width:100%;flex-wrap:wrap;gap:14px 22px}body:has(.menu-toggle:not([hidden])) nav{display:none}body:has(.menu-toggle:not([hidden])) nav.is-open{display:flex}.home-hero{padding:22px 5% 30px}.hero-top .eyebrow{font-size:12px;max-width:145px}.hero-top .eyebrow:last-child{text-align:right}.wordmark{margin:40px 0;letter-spacing:-.08em}.home-index{grid-template-columns:1fr;gap:0;padding:30px 5% 50px}.home-index>div>a{gap:15px}.home-index a>span:last-child{font-size:12px}.page-intro{padding:45px 5% 40px}.lead{font-size:18px}.split{padding:35px 5% 50px;grid-template-columns:1fr;gap:28px}.split h2{margin:15px 0}.film{margin:0 5% 40px}.film-empty .eyebrow{font-size:12px}.credits{padding:30px 5% 50px}.brand-list{gap:24px 30px}.contact-block{padding:30px 5% 70px}footer{margin:0 5%;flex-wrap:wrap}}@media(prefers-reduced-motion:no-preference){a,button{transition:color .15s,background .15s}}

.story-page, .showreel-page { padding-top: 2rem; }

/* Continuous logo band; each duplicated group has identical dimensions. */
.brand-band { padding: 30px 0 10px; border-bottom: 1px solid var(--line); }
.brand-window { overflow-x: auto; scrollbar-width: thin; }
.brand-track { display: flex; width: max-content; }
.brand-group { display: flex; flex: none; list-style: none; margin: 0; padding: 0; }
.brand-group li { width: 200px; height: 110px; display: grid; place-items: center; flex: none; }
.brand-group img { width: 140px; height: 80px; object-fit: contain; }
.brand-tonal { filter: grayscale(1) invert(1) brightness(1.3); }
.brand-solid { filter: brightness(0) invert(1); }
.brand-band.is-animated .brand-window { overflow-x: hidden; }
.brand-band.is-animated .brand-track { animation: brand-scroll 100s linear infinite; }
.brand-band.is-paused .brand-track, .brand-band:hover .brand-track, .brand-band:focus-within .brand-track { animation-play-state: paused; }
.brand-band-controls { display: flex; justify-content: flex-end; padding: 0 4%; }
.brand-band-controls button { min-width: 65px; min-height: 44px; padding: 8px; background: none; border: none; color: var(--muted); cursor: pointer; font-size: 14px; }
.brand-band-controls button:hover { color: var(--accent); }
.brand-window:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
@keyframes brand-scroll { to { transform: translateX(-50%); } }
@media(max-width:760px) {
  .brand-group li { width: 145px; height: 90px; }
  .brand-group img { width: 105px; height: 65px; }
  .brand-band { padding-top: 20px; }
  .brand-band.is-animated .brand-track { animation-duration: 85s; }
}
@media(prefers-reduced-motion:reduce) {
  .brand-band.is-animated .brand-track { animation: none; }
  .brand-band.is-animated .brand-window { overflow-x: auto; }
  .brand-group[aria-hidden="true"] { display: none; }
}

.hero-bottom > .round-link:only-child { margin-left: auto; }


.project-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 34px 24px; margin: 0 4% 65px; }
.video-card { position: relative; padding: 0; border: 0; text-align: left; background: transparent; color: var(--ink); cursor: pointer; }
.video-card img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #222; }
.video-card > span:first-child { display: block; padding: 0 0 16px; font-family: Arial, Helvetica, sans-serif; font-size: 32px; font-weight: 700; letter-spacing: -.06em; line-height: 1.1; overflow-wrap: anywhere; }
.video-thumbnail { display: block; position: relative; margin-top: auto; }
.video-thumbnail::after { content: "▶"; position: absolute; right: 18px; top: 18px; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #111c; color: white; font-size: 14px; }
.video-card:hover { color: var(--accent); }
.video-card:hover .video-thumbnail::after { background: var(--accent); color: #111; }
.project-dialog { width: min(1120px,94vw); max-width: 94vw; max-height: 94dvh; padding: 18px; border: 1px solid var(--line); background: var(--bg); color: var(--ink); }
.project-dialog::backdrop { background: rgba(0,0,0,.88); }
.project-dialog-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 15px; }
.project-dialog h2 { font-size: 18px; font-weight: 400; margin: 0; }
.close-video { flex-shrink: 0; min-height: 44px; padding: 8px 14px; background: transparent; color: var(--ink); border: 1px solid var(--line); cursor: pointer; }
.close-video:hover { color: var(--accent); }
.project-dialog video { width: 100%; max-height: 75dvh; aspect-ratio: 16 / 9; object-fit: contain; background: #000; }
body.video-open { overflow: hidden; }
@media (max-width:600px) { .project-gallery { grid-template-columns: 1fr; gap: 24px; margin: 0 5% 40px; } .project-dialog { padding: 12px; } .project-dialog h2 { font-size: 16px; } }

.video-card { display: flex; flex-direction: column; justify-content: flex-end; min-width: 0; }
@media(max-width:760px) { .video-card > span:first-child { font-size: 26px; } }

/* Compact showreel grid scales with available screen width. */
.project-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; }
@media (max-width: 1100px) { .project-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .project-gallery { grid-template-columns: 1fr; } }