*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#0A0A0A;--surface:#141414;--card:#141414;--text:#E8E6E1;--muted:#777;--accent:#E03C31;--border:#1E1E1E;--mono:'IBM Plex Mono',monospace;--sans:'Plus Jakarta Sans',sans-serif}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{background:var(--bg);color:var(--text);font-family:var(--sans);line-height:1.5}
a{color:inherit;text-decoration:none}img,video{display:block;width:100%;height:100%;object-fit:cover}
::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border)}::selection{background:var(--accent);color:#fff}
.nav{position:sticky;top:0;z-index:100;padding:0 40px;height:56px;display:flex;justify-content:space-between;align-items:center;background:rgba(10,10,10,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.nav-logo{font-weight:800;font-size:16px;letter-spacing:-.5px}.nav-logo span{color:var(--accent)}.nav-links{display:flex;gap:24px;list-style:none}.nav-links a{font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.5px;transition:color .2s}.nav-links a:hover,.nav-links a.active{color:var(--text)}.nav-toggle{display:none}.nav-links.open{display:flex}
.hero{padding:42px 40px 30px;border-bottom:1px solid var(--border)}.hero-top{display:flex;justify-content:space-between;align-items:flex-end}.hero-name{font-size:48px;font-weight:800;letter-spacing:-2.5px;line-height:1}.hero-name span{color:var(--accent)}.hero-contact{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.hero-contact a{font-family:var(--mono);font-size:10px;color:var(--muted)}.hero-kicker{margin-top:10px;font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--accent)}.hero-tagline{margin-top:0;font-size:13px;color:#9a9a9a;max-width:920px;line-height:1.34}.hero-roles{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}.hero-roles span{font-family:var(--mono);font-size:9px;letter-spacing:.8px;text-transform:uppercase;padding:5px 12px;border:1px solid var(--border);color:var(--muted)}
.filter-bar{margin-top:22px}.filter-pill,.pill{font-family:var(--mono);font-size:8px;letter-spacing:.8px;text-transform:uppercase;padding:4px 10px;border:1px solid var(--border);color:var(--muted);background:transparent;line-height:1;white-space:nowrap}.filter-pill{cursor:pointer}.filter-pill.active,.pill-accent{border-color:var(--accent);color:var(--accent)}
.section-header{padding:32px 40px 20px;display:flex;justify-content:space-between;align-items:baseline}.section-title,.vid-section-title{font-family:var(--mono);font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--accent);font-weight:600}.section-count,.vid-section-tools,.page-header-sub{font-family:var(--mono);font-size:9px;color:var(--muted)}
.project-grid{padding:0 40px 56px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:var(--card);border:1px solid var(--border);overflow:hidden;display:block;transition:border-color .3s,transform .3s}.card:hover{border-color:#333;transform:translateY(-2px)}.card-thumb{width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--surface)}.card-thumb img,.card-thumb video{transition:transform .4s ease}.card:hover .card-thumb img,.card:hover .card-thumb video{transform:scale(1.03)}.card-info{padding:14px 16px 16px}.card-name{font-size:14px;font-weight:700;letter-spacing:-.3px;margin-bottom:6px}.card-desc{font-size:12px;line-height:1.5;color:#919191;margin-bottom:10px;min-height:54px}.card-pills{display:flex;flex-wrap:wrap;gap:5px}
.footer{padding:40px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border)}.footer-cta{font-size:20px;font-weight:700;letter-spacing:-.5px}.footer-cta span{color:var(--accent)}.footer-links{display:flex;gap:20px}.footer-links a{font-family:var(--mono);font-size:10px;color:var(--muted)}
.page-header{padding:40px 40px 0}.page-header-inner{border-top:2px solid var(--accent);padding-top:24px;padding-bottom:8px;display:flex;justify-content:space-between;align-items:baseline}.page-header h1{font-size:36px;font-weight:800;letter-spacing:-1.5px}.page-header h1 span{color:var(--accent)}
.reel-section{padding:28px 40px 32px;display:grid;grid-template-columns:2fr 1fr;gap:28px;align-items:center;border-bottom:1px solid var(--border)}.reel-player{aspect-ratio:16/9;background:var(--surface);border:1px solid var(--border);position:relative;overflow:hidden}.reel-player iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.reel-info h2{font-size:22px;font-weight:700;letter-spacing:-.5px;margin-bottom:10px}.reel-info p{font-family:var(--mono);font-size:10px;color:var(--muted);line-height:1.7}
.vid-section{padding:28px 40px;border-bottom:1px solid var(--border)}.vid-section-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px}
.ai-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.ai-grid-5{grid-template-columns:repeat(5,1fr)}.ai-card,.social-card,.other-card{border:1px solid var(--border);overflow:hidden;display:block;transition:border-color .25s,transform .25s}.ai-card:hover,.social-card:hover,.other-card:hover{border-color:#333;transform:translateY(-2px)}.ai-card-thumb{width:100%;aspect-ratio:9/16;overflow:hidden;background:var(--surface)}.ai-card-thumb video,.social-card-thumb video{transition:transform .35s ease}.ai-card:hover .ai-card-thumb video,.social-card:hover .social-card-thumb video{transform:scale(1.03)}.ai-card-info{padding:10px 12px}.ai-card-name{font-size:11px;font-weight:600;margin-bottom:3px}.ai-card-tool{font-family:var(--mono);font-size:8px;color:var(--muted)}
.social-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.social-grid-viral .social-card-thumb{aspect-ratio:9/16;background:var(--surface)}
.other-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.other-thumb{aspect-ratio:16/9;background:var(--surface);overflow:hidden}.other-info{padding:12px 14px;display:flex;justify-content:space-between;gap:12px;align-items:center}.other-name{font-size:12px;font-weight:600}.other-role{font-family:var(--mono);font-size:8px;color:var(--muted);text-align:right}.embed-grid{display:grid;gap:14px}.embed-grid-3{grid-template-columns:repeat(3,1fr)}.embed-card{border:1px solid var(--border);background:var(--card);overflow:hidden;transition:border-color .25s,transform .25s}.embed-card:hover{border-color:#333;transform:translateY(-2px)}.embed-frame{position:relative;aspect-ratio:16/9;background:var(--surface);overflow:hidden}.embed-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.embed-info{padding:12px 14px;display:flex;justify-content:space-between;gap:12px;align-items:center}.embed-name{font-size:12px;font-weight:600}.embed-role{font-family:var(--mono);font-size:8px;color:var(--muted);text-align:right}
@media (max-width:1100px){.ai-grid-5{grid-template-columns:repeat(3,1fr)}.social-grid-viral{grid-template-columns:repeat(3,1fr)}.other-grid{grid-template-columns:repeat(2,1fr)}.embed-grid-3{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.nav{padding:0 24px}.hero,.page-header,.vid-section,.reel-section,.section-header,.project-grid,.footer{padding-left:24px;padding-right:24px}.hero-top{flex-direction:column;align-items:flex-start;gap:16px}.hero-contact{align-items:flex-start}.project-grid{grid-template-columns:repeat(2,1fr);padding-bottom:40px}.reel-section{grid-template-columns:1fr}.social-grid-viral{grid-template-columns:repeat(3,1fr)}.embed-grid-3{grid-template-columns:1fr}.vid-section-head{flex-direction:column;gap:4px}}
@media (max-width:600px){.nav-links{display:none;position:absolute;top:56px;left:0;right:0;padding:14px 20px 18px;background:rgba(10,10,10,.98);border-bottom:1px solid var(--border);flex-direction:column;gap:14px}.nav-links.open{display:flex}.nav-toggle{display:block;background:none;border:none;width:24px;height:18px;position:relative}.nav-toggle span{display:block;width:100%;height:2px;background:var(--text);position:absolute;left:0}.nav-toggle span:first-child{top:0}.nav-toggle span:last-child{bottom:0}.nav{padding:0 20px}.hero{padding:24px 20px 20px}.hero-name{font-size:28px;letter-spacing:-1.5px}.hero-kicker{margin-top:8px}.hero-copy-wrap{gap:6px;margin-top:8px;margin-bottom:12px}.hero-tagline{font-size:13px;line-height:1.42}.section-header{padding:20px 20px 14px}.project-grid{padding:0 20px 32px;grid-template-columns:1fr;gap:12px}.card-desc{min-height:0}.page-header{padding:24px 20px 0}.page-header-inner{flex-direction:column;gap:6px}.page-header h1{font-size:28px}.reel-section,.vid-section{padding:20px}.ai-grid-5,.social-grid-viral{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.other-grid,.embed-grid-3{grid-template-columns:1fr;gap:10px}.footer{padding:28px 20px;flex-direction:column;gap:16px;align-items:flex-start}.other-info,.embed-info{flex-direction:column;align-items:flex-start}.other-role,.embed-role{text-align:left}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.hero,.page-header{animation:fadeUp .5s ease both}.section-header,.reel-section{animation:fadeUp .5s ease .1s both}.card,.vid-section{animation:fadeUp .4s ease both}


:root{--accent:#5F86F2;}
.hero-copy-wrap{max-width:1040px;display:grid;gap:4px;margin-top:6px;margin-bottom:10px}
.hero-copy-wrap .hero-tagline{max-width:1000px;margin:0}
.card-thumb-logo{background:#0f0f10;display:flex;align-items:center;justify-content:center;padding:clamp(24px,5vw,56px)}
.card-thumb-logo img{width:72%;height:auto;object-fit:contain;filter:brightness(0) invert(1)}
.embed-grid-5{grid-template-columns:repeat(3,1fr)}
.embed-name{color:var(--text);font-size:12px;font-weight:600}
.embed-name:hover{color:var(--accent)}
@media (max-width:1320px){.embed-grid-5{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.hero-copy-wrap{max-width:760px}}
@media (max-width:700px){.embed-grid-5{grid-template-columns:1fr} .card-thumb-logo img{width:64%}}


/* mobile nav drawer */
body.nav-open{overflow:hidden}
@media (max-width:600px){
  .nav{z-index:200}
  .nav-links{display:flex;position:fixed;top:0;right:-280px;left:auto;bottom:0;width:260px;padding:84px 24px 24px;background:rgba(12,12,12,.98);border-left:1px solid var(--border);border-bottom:none;flex-direction:column;gap:18px;z-index:220;transition:right .22s ease}
  .nav-links a{font-size:11px;color:var(--text)}
  .nav-links.open{right:0}
  .nav-toggle{display:block;position:relative;z-index:230;background:none;border:none;width:24px;height:18px;cursor:pointer}
  .nav-toggle span{display:block;width:100%;height:2px;background:var(--text);position:absolute;left:0;transition:transform .2s ease,opacity .2s ease}
  .nav-toggle span:first-child{top:3px}
  .nav-toggle span:last-child{bottom:3px}
  .nav-toggle[aria-expanded="true"] span:first-child{transform:translateY(5px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:last-child{transform:translateY(-5px) rotate(-45deg)}
  .nav::after{content:"";position:fixed;inset:0;background:rgba(0,0,0,.56);opacity:0;pointer-events:none;transition:opacity .22s ease;z-index:210}
  body.nav-open .nav::after{opacity:1;pointer-events:auto}
}


.hero-title-block{display:grid;gap:10px}
.hero-side{display:grid;gap:12px;justify-items:end}
.hero-toolbox{border:1px solid var(--border);padding:10px 12px 12px;min-width:min(420px,42vw);max-width:420px}
.hero-toolbox-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.hero-toolbox-title{font-family:var(--mono);font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--accent);font-weight:600}
.hero-toolbox-pills{display:flex;flex-wrap:wrap;gap:6px}
.hero-toolbox-pills span{font-family:var(--mono);font-size:8px;letter-spacing:.6px;text-transform:uppercase;padding:5px 8px;border:1px solid var(--border);color:var(--muted);line-height:1;white-space:nowrap}
.card-thumb-dark{background:#090909;display:flex;align-items:center;justify-content:center;padding:18px}
.card-thumb-dark img{width:100%;height:100%;object-fit:contain}
.workflow-copy{max-width:980px;margin-bottom:16px}
.workflow-copy p{font-size:13px;line-height:1.7;color:#9a9a9a;max-width:980px}
.workflow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.workflow-frame{border:1px solid var(--border);background:#0f0f11;aspect-ratio:16/10;overflow:hidden}
.workflow-frame img{width:100%;height:100%;object-fit:contain}
@media (max-width:1100px){.hero-side{justify-items:start}.hero-toolbox{min-width:0;max-width:100%}}
@media (max-width:900px){.hero-top{align-items:flex-start}.hero-side{width:100%}}
@media (max-width:700px){.hero-top{display:grid;gap:12px}.hero-side{justify-items:start}.hero-toolbox{width:100%;padding:10px 10px 12px}.workflow-grid{grid-template-columns:1fr}}


/* apr10 alignment pass */
.hero{padding:34px 28px 28px}
.section-header,.project-grid,.footer,.page-header,.reel-section,.vid-section{padding-left:28px;padding-right:28px}
.hero-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:28px 40px;align-items:start}
.hero-title-block{gap:8px}
.hero-name{margin-left:0}
.hero-copy-wrap{max-width:980px;margin-top:8px;margin-bottom:14px}
.hero-side{width:min(100%,420px);justify-self:end;align-self:start;gap:10px}
.hero-contact{margin-top:2px;gap:4px}
.hero-contact a{font-size:11px;line-height:1.4}
.hero-toolbox{width:100%;min-width:0;max-width:none;padding:12px 14px 14px}
.hero-toolbox-head{margin-bottom:9px}
.hero-toolbox-title{font-size:10px;letter-spacing:2.6px}
.hero-toolbox-pills{gap:7px}
.hero-toolbox-pills span{font-size:8px;padding:5px 9px}
.hero-roles{margin-top:18px}
@media (max-width:1100px){
  .hero{padding:30px 24px 24px}
  .section-header,.project-grid,.footer,.page-header,.reel-section,.vid-section{padding-left:24px;padding-right:24px}
  .hero-top{grid-template-columns:minmax(0,1fr) 360px;gap:24px 28px}
}
@media (max-width:900px){
  .hero-top{grid-template-columns:1fr;gap:16px}
  .hero-side{justify-self:start;width:100%;max-width:460px}
  .hero-contact{align-items:flex-start}
}
@media (max-width:600px){
  .hero{padding:24px 20px 20px}
  .section-header,.project-grid,.footer,.page-header,.reel-section,.vid-section{padding-left:20px;padding-right:20px}
  .hero-toolbox{padding:10px 12px 12px}
}



/* apr11 homepage cleanup */
.hero-tools-inline,.hero-tools-row,.hero-toolbox,.hero-divider{display:none !important}
.hero{
  padding:26px 34px 20px;
}
.hero-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:4px 20px;
  align-items:start;
}
.hero-title-block{gap:2px}
.hero-name{
  font-size:52px;
  line-height:.94;
  letter-spacing:-2.4px;
  margin:0;
}
.hero-kicker{
  font-size:11px;
  letter-spacing:3px;
  margin-top:0;
}
.hero-copy-wrap{
  max-width:1180px;
  margin-top:6px;
  margin-bottom:10px;
  gap:6px;
}
.hero-copy-wrap .hero-tagline{
  font-size:13px;
  line-height:1.42;
  color:#8f8f8f;
}
.hero-side{
  justify-self:end;
  align-self:start;
}
.hero-contact{
  margin-top:2px;
  gap:2px;
  align-items:flex-end;
}
.hero-contact a{
  font-size:10px;
  line-height:1.35;
  opacity:.78;
}
.hero-roles{
  margin-top:8px;
}
.filter-bar-compact,.filter-bar{
  gap:7px;
}
.filter-bar-compact .filter-pill,.filter-bar .filter-pill{
  font-size:8px;
  letter-spacing:1.4px;
  padding:8px 12px;
}
@media (max-width:900px){
  .hero-top{
    grid-template-columns:1fr;
    gap:10px;
  }
  .hero-side{justify-self:start}
  .hero-contact{align-items:flex-start}
}
@media (max-width:600px){
  .hero{
    padding:22px 20px 18px;
  }
  .hero-name{font-size:34px;letter-spacing:-1.6px}
  .hero-copy-wrap .hero-tagline{font-size:12px}
  .filter-bar-compact .filter-pill,.filter-bar .filter-pill{
    font-size:7px;
    padding:7px 10px;
  }
}


/* apr11 homepage bio + toolbox pass */
.hero{
  padding: 26px 34px 20px;
}
.hero-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:6px 20px;
  align-items:start;
}
.hero-title-block{
  gap:4px;
}
.hero-name{
  font-size:52px;
  line-height:.94;
  letter-spacing:-2.4px;
  margin:0;
}
.hero-kicker{
  font-size:11px;
  letter-spacing:3px;
  margin-top:0;
}
.hero-copy-wrap{
  max-width:1160px;
  display:grid;
  gap:8px;
  margin-top:14px;
  margin-bottom:12px;
}
.hero-copy-wrap .hero-tagline{
  max-width:1100px;
  margin:0;
  font-size:13px;
  line-height:1.5;
  color:#8f8f8f;
}
.hero-tools-inline{
  display:flex !important;
  flex-wrap:wrap;
  align-items:baseline;
  gap:8px;
  max-width:1160px;
  margin:0 0 12px;
  font-size:10px;
  line-height:1.6;
  letter-spacing:1px;
}
.hero-tools-inline-label{
  color:var(--accent);
  font-family:var(--mono);
  text-transform:uppercase;
  white-space:nowrap;
}
.hero-tools-inline-text{
  color:#747474;
  font-family:var(--mono);
  text-transform:uppercase;
}
.hero-divider{
  display:block !important;
  width:100%;
  max-width:1160px;
  height:1px;
  background:rgba(255,255,255,.08);
  margin:0 0 14px;
}
.hero-roles{
  margin-top:0;
}
.filter-bar-compact,.filter-bar{
  gap:7px;
}
.filter-bar-compact .filter-pill,.filter-bar .filter-pill{
  font-size:8px;
  letter-spacing:1.4px;
  padding:8px 12px;
}
@media (max-width:900px){
  .hero-top{
    grid-template-columns:1fr;
    gap:10px;
  }
  .hero-side{
    justify-self:start;
  }
  .hero-contact{
    align-items:flex-start;
  }
}
@media (max-width:600px){
  .hero{
    padding:22px 20px 18px;
  }
  .hero-name{
    font-size:34px;
    letter-spacing:-1.6px;
  }
  .hero-copy-wrap{
    margin-top:12px;
    gap:7px;
  }
  .hero-copy-wrap .hero-tagline{
    font-size:12px;
    line-height:1.5;
  }
  .hero-tools-inline{
    font-size:9px;
    line-height:1.55;
    gap:6px;
  }
  .filter-bar-compact .filter-pill,.filter-bar .filter-pill{
    font-size:7px;
    padding:7px 10px;
  }
}