*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#10211b;color:#ece9d7;font:17px/1.65 system-ui,sans-serif}a{color:inherit;text-underline-offset:5px}a:hover{color:#d6c993}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #e9d9a4;outline-offset:6px}.skip{position:absolute;top:-100px;left:20px;background:#ece9d7;color:#10211b;padding:12px;z-index:5}.skip:focus{top:10px}header,footer{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:28px 5vw;border-bottom:1px solid #ffffff22}.brand{text-decoration:none;font-size:16px;letter-spacing:.22em}.brand span{font-size:11px;display:block;letter-spacing:.42em}nav{display:flex;gap:28px;font-size:14px}main{max-width:1440px;margin:auto;padding:0 6vw}section{margin:110px 0}.intro{margin:90px 0 100px}h1,h2,h3{font-family:Georgia,serif;font-weight:400;line-height:1.07;letter-spacing:-.035em;margin:20px 0}h1{font-size:clamp(48px,6.2vw,94px);max-width:1100px}h2{font-size:clamp(36px,4.5vw,64px)}h3{font-size:34px}p{max-width:750px}.eyebrow{font-size:11px;letter-spacing:.17em;font-weight:600;color:#d4cdaa}.lede{font-size:21px;line-height:1.6;margin:30px 0}.button{display:inline-block;padding:13px 22px;border:1px solid #b7b99966;border-radius:4px;text-decoration:none;margin-top:12px}.screening,.product-moment{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:8%;padding:60px 0;border-block:1px solid #ffffff22}.screening video,.product-moment video{width:100%;height:540px;object-fit:contain;background:#090e0b;border-radius:10px}.muted{color:#b6c1b7;font-size:13px;max-width:320px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.grid.thirds{grid-template-columns:repeat(3,minmax(0,1fr))}.section-heading{margin-bottom:40px}.section-heading>p:last-child{color:#bac6bd}.work-card{border:1px solid #ffffff20;background:#0c1914;border-radius:12px;overflow:hidden}.work-card>div{padding:27px}.work-card p{font-size:15px}.work-card .eyebrow{font-size:10px}.work-card video{width:100%;display:block;aspect-ratio:16/9;background:#090e0b;object-fit:contain}.thirds video{aspect-ratio:9/12;max-height:420px}.web-card{text-decoration:none}.web-card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}.web-card span{font-size:14px}details{margin-top:32px;padding:20px 0;border-top:1px solid #ffffff22}summary{cursor:pointer}.closing{border-top:1px solid #ffffff22;padding-top:70px}footer{border-top:1px solid #ffffff22;border-bottom:0;font-size:13px}video:focus-visible{outline:3px solid #e9d9a4}@media(max-width:700px){body{font-size:16px}header{padding:22px 6vw;align-items:flex-start;gap:16px}nav{gap:12px;font-size:12px;flex-wrap:wrap;justify-content:flex-end}.brand{font-size:12px}.brand span{font-size:9px}main{padding:0 6vw}section{margin:70px 0}.intro{margin:64px 0}h1{font-size:48px}h2{font-size:40px}h3{font-size:30px}.lede{font-size:18px}.screening,.product-moment{grid-template-columns:1fr;gap:24px;padding:32px 0}.screening video,.product-moment video{height:430px}.grid,.grid.thirds{grid-template-columns:1fr}.thirds video{max-height:520px}.work-card>div{padding:22px}footer{flex-wrap:wrap;gap:16px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Portfolio proof and media proportions. */
.intro {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  align-items: center;
  gap: 6%;
  margin: 48px 0 80px;
}
.intro h1 { font-size: clamp(44px, 5.1vw, 74px); }
.intro .lede { font-size: 19px; margin: 24px 0; }
.featured-work { margin: 0; min-width: 0; scroll-margin-top: 24px; }
.featured-work video {
  display: block;
  width: min(100%, 243px);
  margin: 0 auto;
  aspect-ratio: 9 / 16;
  object-fit: contain;
  background: #090e0b;
  border: 1px solid #ffffff20;
  border-radius: 10px;
}
.featured-work h2 { font-size: 30px; margin: 12px 0; }
.featured-work figcaption > p { font-size: 14px; margin: 10px 0; }
.featured-work figcaption .eyebrow { font-size: 10px; margin-top: 20px; }
.featured-work .muted { max-width: 100%; font-size: 12px; }
.thirds video { aspect-ratio: 9 / 16; max-height: none; }
.product-moment video { width: min(100%, 300px); height: auto; aspect-ratio: 9 / 16; justify-self: center; }
.web-card img { height: auto; aspect-ratio: 1165 / 747; object-fit: contain; }
@media (max-width: 700px) {
  .intro { grid-template-columns: 1fr; gap: 28px; margin: 28px 0 64px; }
  .intro h1 { font-size: 44px; margin: 16px 0; }
  .intro .lede { font-size: 17px; margin: 16px 0; }
  .intro .button { margin-top: 0; }
  .featured-work h2 { font-size: 28px; }
  .featured-work video { width: min(100%, 220px); }
  .thirds video { width: min(100%, 300px); margin: 0 auto; }
}