:root{--bg:#050505;--panel:#0c0c0c;--ink:#f3f3f3;--muted:#9a9a9a;--line:#232323;--red:#c90000;--red2:#ed1616;--max:1320px;--pad:clamp(20px,5vw,72px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.skip-link{position:fixed;left:12px;top:-80px;z-index:9999;background:#fff;color:#000;padding:10px 14px;border-radius:4px}.skip-link:focus{top:12px}.site-header{position:fixed;top:0;left:0;right:0;height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);z-index:100;background:linear-gradient(to bottom,rgba(0,0,0,.92),rgba(0,0,0,.15));backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.07);transition:.3s}.brand{display:flex;align-items:center;gap:11px;font-size:13px;letter-spacing:.15em;font-weight:700}.brand img{width:36px;height:31px;object-fit:contain}.brand b{color:var(--red2)}.site-nav{display:flex;align-items:center;gap:28px;font-size:12px;text-transform:uppercase;letter-spacing:.13em}.site-nav a{position:relative;color:#d4d4d4}.site-nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:var(--red2);transition:.25s}.site-nav a:hover:after,.site-nav a:focus-visible:after{right:0}.menu-toggle{display:none;background:none;border:0;width:42px;height:42px;padding:9px}.menu-toggle span{display:block;height:1px;background:#fff;margin:7px 0;transition:.25s}.section{padding:clamp(86px,10vw,150px) var(--pad)}.section-kicker{font-size:11px;letter-spacing:.2em;color:#b4b4b4;margin-bottom:24px}.reveal{opacity:1;transform:none}.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.js .reveal.in{opacity:1;transform:none}
.hero{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:#000}.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(circle at center,#000 0%,transparent 67%)}.hero-glow{position:absolute;border-radius:999px;filter:blur(70px);opacity:.18;pointer-events:none}.glow-a{width:34vw;height:34vw;left:-15vw;top:18%;background:#a40000}.glow-b{width:25vw;height:25vw;right:-10vw;bottom:5%;background:#700000}.hero-inner{position:relative;z-index:2;text-align:center;display:flex;flex-direction:column;align-items:center;padding:110px 20px 70px}.hero-mark{width:clamp(210px,28vw,410px);height:auto;filter:drop-shadow(0 18px 40px rgba(0,0,0,.45));animation:heroIn 1s cubic-bezier(.2,.7,.2,1) both}.hero-wordmark{margin-top:24px;animation:heroIn 1s .12s cubic-bezier(.2,.7,.2,1) both}.hero h1{font-size:clamp(48px,7vw,104px);line-height:.83;margin:0;letter-spacing:-.055em}.hero h1 span{font-weight:300}.hero h1 strong{font-weight:900;color:#fff}.hero-wordmark p{font-size:clamp(11px,1.05vw,16px);letter-spacing:.32em;margin:23px 0 0;color:#9d9d9d}.hero-wordmark em{font-style:normal;color:var(--red2)}.hero-cta{margin-top:46px;display:inline-flex;gap:20px;align-items:center;text-transform:uppercase;letter-spacing:.18em;font-size:10px;color:#bdbdbd}.hero-cta span{font-size:18px;animation:bounce 1.6s infinite}.hero-side{position:absolute;right:22px;top:50%;transform:translateY(-50%) rotate(90deg);transform-origin:center;font-size:9px;letter-spacing:.24em;color:#585858}.hero:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,var(--red),transparent)}
.intro{max-width:var(--max);margin:auto}.intro-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(44px,8vw,110px);align-items:center}.intro-copy h2,.services-head h2,.strength-copy h2,.work-header h2,.clients-copy h2{font-size:clamp(45px,6vw,88px);line-height:.98;letter-spacing:-.055em;margin:0 0 34px}.intro-copy h2 span{color:#636363}.intro-copy p{max-width:700px;color:#a8a8a8;line-height:1.8;font-size:14px}.intro-copy .lead{color:#e8e8e8;font-size:clamp(18px,2vw,26px);line-height:1.5;margin-bottom:28px}.intro-visual{margin:0;position:relative;aspect-ratio:4/5;overflow:hidden;background:#111}.intro-visual:before{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.1);z-index:1;pointer-events:none}.intro-visual img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.08)}.intro-visual figcaption{position:absolute;left:16px;bottom:14px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:#cfcfcf;z-index:2}
.goals{position:relative;min-height:790px;display:flex;align-items:center;overflow:hidden;padding-top:120px;padding-bottom:120px}.goals-bg{position:absolute;inset:0}.goals-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#050505 0%,rgba(5,5,5,.93) 38%,rgba(5,5,5,.45) 100%)}.goals-bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);opacity:.55}.goals-content{position:relative;width:min(var(--max),100%);margin:auto}.goals h2{font-size:clamp(25px,3vw,44px);font-weight:400;margin:0 0 42px;color:#aaa}.goal-words{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #333;border-bottom:1px solid #333}.goal-word{padding:28px 26px 32px;border-right:1px solid #333}.goal-word:last-child{border-right:0}.goal-word span{display:block;color:var(--red2);font-size:10px;letter-spacing:.18em;margin-bottom:34px}.goal-word strong{font-size:clamp(30px,5vw,70px);letter-spacing:-.05em;font-weight:500}.goal-note{max-width:700px;color:#b2b2b2;font-size:16px;line-height:1.8;margin:38px 0 0 auto}
.mv{max-width:var(--max);margin:auto;padding-top:0}.mv-panel{display:grid;grid-template-columns:1fr 1fr;min-height:620px;border-top:1px solid var(--line)}.mv-panel.reverse .mv-photo{order:2}.mv-panel.reverse .mv-copy{order:1}.mv-photo{overflow:hidden}.mv-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:transform 1s ease,filter .5s}.mv-panel:hover .mv-photo img{transform:scale(1.025);filter:grayscale(.45)}.mv-copy{padding:clamp(38px,6vw,78px);display:flex;justify-content:center;flex-direction:column;background:#080808}.eyebrow{font-size:10px;color:var(--red2);letter-spacing:.2em}.mv-copy h2{font-size:clamp(34px,4vw,62px);line-height:1.02;letter-spacing:-.045em;margin:26px 0}.mv-copy p{font-size:14px;line-height:1.8;color:#a7a7a7;max-width:520px}
.services{max-width:var(--max);margin:auto}.services-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:70px}.services-head p{width:370px;color:#949494;line-height:1.8;font-size:14px}.service-list{border-top:1px solid var(--line)}.service-row{display:grid;grid-template-columns:80px 1fr 1fr 40px;align-items:center;gap:30px;padding:34px 8px;border-bottom:1px solid var(--line);transition:background .25s,padding .25s;cursor:pointer}.service-row:hover,.service-row:focus-visible{background:#0b0b0b;padding-left:18px;padding-right:18px;outline:none}.service-row:focus-visible{box-shadow:inset 0 0 0 1px #555}.service-row>span{font-size:10px;color:#777;letter-spacing:.15em}.service-row h3{font-size:clamp(30px,4.5vw,68px);letter-spacing:-.04em;margin:0}.service-row p{color:#999;line-height:1.7;font-size:13px;max-width:440px}.service-row i{font-style:normal;color:var(--red2);font-size:25px}
.strength{display:grid;grid-template-columns:1fr 1fr;gap:0;padding-left:0;padding-right:0;background:#080808}.strength-visual{min-height:720px;overflow:hidden}.strength-visual img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);opacity:.78}.strength-copy{padding:clamp(70px,8vw,120px) var(--pad);display:flex;flex-direction:column;justify-content:center}.strength-copy p{color:#a3a3a3;line-height:1.8;max-width:580px;font-size:14px}.strength-copy p+p{margin-top:18px}
.work{max-width:var(--max);margin:auto}.work-header{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:60px}.work-header h2{margin-bottom:0}.work-header>p{color:#888;font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.work-card{grid-column:span 4;background:#090909;border:1px solid #1b1b1b;cursor:pointer;outline:none;transition:transform .3s,border-color .3s}.work-card:nth-child(1),.work-card:nth-child(8){grid-column:span 8}.work-card:hover,.work-card:focus-visible{transform:translateY(-5px);border-color:#3a3a3a}.work-media{aspect-ratio:16/10;overflow:hidden;background:#111}.work-card:nth-child(1) .work-media,.work-card:nth-child(8) .work-media{aspect-ratio:16/8}.work-media img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .45s;filter:saturate(.86) contrast(1.02)}.work-card:hover .work-media img{transform:scale(1.045);filter:saturate(1.05)}.work-meta{display:grid;grid-template-columns:34px 1fr 24px;gap:15px;align-items:start;padding:20px}.work-index{font-size:9px;color:#666;letter-spacing:.15em;padding-top:5px}.work-meta h3{font-size:15px;letter-spacing:-.01em;margin:0 0 5px}.work-meta p{margin:0;color:#777;font-size:10px;letter-spacing:.08em;text-transform:uppercase;line-height:1.5}.work-arrow{color:var(--red2);font-size:18px}
.clients{max-width:var(--max);margin:auto;display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:center}.clients-copy h2{font-size:clamp(42px,5.5vw,76px)}.clients-copy p{color:#929292;line-height:1.8;max-width:420px}.client-grid{display:grid;grid-template-columns:repeat(2,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}.client-card{min-height:190px;display:grid;place-items:center;background:#f5f5f5;border-right:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;padding:34px}.client-card:last-child{grid-column:1/-1}.client-card.dark-logo{background:#111;border-color:#2c2c2c}.client-card.dark-logo img{max-height:105px;max-width:220px}.client-card img{max-height:96px;max-width:190px;object-fit:contain}
.contact{position:relative;min-height:720px;display:grid;place-items:center;padding:110px var(--pad);overflow:hidden}.contact-bg,.contact-overlay{position:absolute;inset:0}.contact-bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}.contact-overlay{background:linear-gradient(90deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.82) 48%,rgba(0,0,0,.55) 100%)}.contact-inner{position:relative;z-index:2;width:min(var(--max),100%)}.contact h2{font-size:clamp(58px,8.5vw,128px);line-height:.86;letter-spacing:-.06em;margin:0 0 52px}.contact h2 em{font-style:normal;color:var(--red2)}.contact-actions{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border:1px solid #424242;text-transform:uppercase;letter-spacing:.14em;font-size:10px;transition:.25s}.button.primary{background:var(--red);border-color:var(--red);color:#fff}.button.primary:hover{background:#e00000}.button.ghost:hover{border-color:#888;background:rgba(255,255,255,.05)}
.footer{padding:70px var(--pad) 26px;display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:50px;border-top:1px solid var(--line);font-size:12px;color:#8f8f8f}.footer-brand{display:flex;align-items:center;gap:15px;color:#e6e6e6;letter-spacing:.15em;font-weight:700}.footer-brand img{width:44px;height:auto}.footer address{font-style:normal;line-height:1.75}.footer-links{display:flex;flex-direction:column;gap:8px;align-items:flex-end}.footer-links a:hover{color:#fff}.footer-bottom{grid-column:1/-1;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:22px;color:#555}.footer-bottom a:hover{color:#aaa}
.lightbox{width:min(1200px,94vw);height:min(840px,92vh);padding:0;border:1px solid #2f2f2f;background:#050505;color:#fff;overflow:hidden}.lightbox::backdrop{background:rgba(0,0,0,.9);backdrop-filter:blur(8px)}.lightbox figure{margin:0;width:100%;height:100%;display:grid;grid-template-rows:1fr auto;place-items:center;padding:44px 64px 28px}.lightbox img{max-width:100%;max-height:calc(92vh - 110px);object-fit:contain}.lightbox figcaption{width:100%;display:flex;justify-content:space-between;gap:20px;padding-top:16px;font-size:12px;letter-spacing:.08em}.lightbox figcaption span{color:#777}.lightbox-close,.lightbox-nav{position:absolute;z-index:4;background:rgba(0,0,0,.5);border:1px solid #333;cursor:pointer}.lightbox-close{right:14px;top:14px;width:40px;height:40px;font-size:26px}.lightbox-nav{top:50%;transform:translateY(-50%);width:42px;height:56px;font-size:34px}.lightbox-nav.prev{left:10px}.lightbox-nav.next{right:10px}.lightbox-nav[hidden]{display:none}
@keyframes heroIn{from{opacity:0;transform:translateY(26px) scale(.98)}to{opacity:1;transform:none}}@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@media (max-width:900px){.site-header{height:66px}.menu-toggle{display:block}.site-nav{position:fixed;top:66px;left:0;right:0;height:0;overflow:hidden;background:#050505;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0 var(--pad);gap:25px;opacity:0;transition:height .35s,opacity .25s}.site-nav.open{height:calc(100svh - 66px);opacity:1}.site-nav a{font-size:28px;letter-spacing:-.02em;text-transform:none}.hero-side{display:none}.intro-grid,.clients,.strength{grid-template-columns:1fr}.intro-visual{aspect-ratio:16/11}.goal-words{grid-template-columns:1fr}.goal-word{border-right:0;border-bottom:1px solid #333}.goal-word:last-child{border-bottom:0}.mv-panel{grid-template-columns:1fr;min-height:0}.mv-panel.reverse .mv-photo,.mv-panel.reverse .mv-copy{order:initial}.mv-photo{aspect-ratio:16/10}.services-head,.work-header{display:block}.services-head p{width:auto;margin-top:24px}.service-row{grid-template-columns:48px 1fr 32px;gap:18px}.service-row p{grid-column:2/-1;margin-top:0}.work-grid{grid-template-columns:1fr 1fr}.work-card,.work-card:nth-child(1),.work-card:nth-child(8){grid-column:auto}.work-card:nth-child(1) .work-media,.work-card:nth-child(8) .work-media{aspect-ratio:16/10}.clients{gap:50px}.footer{grid-template-columns:1fr 1fr}.footer-links{align-items:flex-start}.footer-brand{grid-column:1/-1}}
@media (max-width:620px){:root{--pad:20px}.section{padding-top:84px;padding-bottom:84px}.hero-inner{padding-top:90px}.hero-mark{width:min(58vw,260px)}.hero h1{font-size:50px}.hero-wordmark p{font-size:9px;letter-spacing:.22em}.intro-copy h2,.services-head h2,.strength-copy h2,.work-header h2,.clients-copy h2{font-size:43px}.intro-visual{aspect-ratio:4/5}.goals{min-height:0}.goal-word{padding-left:0}.goal-word strong{font-size:48px}.goal-note{font-size:14px}.mv-copy{padding:36px 22px}.service-row{grid-template-columns:36px 1fr 24px;padding:26px 0}.service-row h3{font-size:38px}.work-grid{grid-template-columns:1fr;gap:14px}.work-card,.work-card:nth-child(1),.work-card:nth-child(8){grid-column:auto}.client-grid{grid-template-columns:1fr}.client-card:last-child{grid-column:auto}.client-card{min-height:150px}.contact{min-height:620px}.contact h2{font-size:58px}.contact-actions{flex-direction:column}.button{width:100%}.footer{grid-template-columns:1fr;gap:30px}.footer-brand{grid-column:auto}.footer-bottom{grid-column:auto;flex-direction:column;gap:10px}.lightbox figure{padding:58px 18px 24px}.lightbox-nav{top:auto;bottom:60px}.lightbox-nav.prev{left:14px}.lightbox-nav.next{right:14px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.hero-mark,.hero-wordmark,.hero-cta span{animation:none!important}.work-card,.work-media img{transition:none}}

/* === Rev2 visual refinements === */
/* Landing: use supplied stage image as the hero background. */
.hero{
  background:
    linear-gradient(180deg,rgba(0,0,0,.34) 0%,rgba(0,0,0,.50) 58%,rgba(0,0,0,.78) 100%),
    url('../assets/images/about/hero-stage.webp') center center/cover no-repeat #000;
}
.hero-grid{opacity:.28}
.hero-glow{opacity:.11}
.hero-inner{filter:drop-shadow(0 2px 18px rgba(0,0,0,.45))}

/* Clients: make all client tiles dark for a consistent brand wall. */
.client-card,
.client-card.dark-logo{
  background:#0f0f0f;
  border-right:1px solid #2b2b2b;
  border-bottom:1px solid #2b2b2b;
}
.client-card.dark-logo img{
  max-height:105px;
  max-width:220px;
  filter:none;
}

@media (max-width:900px){
  /* On mobile the strength photo becomes a subtle background instead of
     taking a full screen before the copy. */
  .strength{
    position:relative;
    display:block;
    overflow:hidden;
    min-height:760px;
    background:#070707;
    isolation:isolate;
  }
  .strength::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:url('../assets/images/about/strength-light.webp') 58% center/cover no-repeat;
    filter:grayscale(1);
    opacity:.27;
  }
  .strength::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,.78) 48%,rgba(0,0,0,.94));
  }
  .strength-visual{display:none}
  .strength-copy{
    position:relative;
    z-index:1;
    min-height:760px;
    padding-top:110px;
    padding-bottom:110px;
    justify-content:center;
    background:transparent;
  }
  .strength-copy p{color:#c1c1c1}
}

@media (max-width:620px){
  .hero{
    background-position:center center;
  }
  .hero-inner{
    min-height:100svh;
    justify-content:center;
    padding-top:100px;
    padding-bottom:70px;
  }
  .strength{min-height:690px}
  .strength-copy{
    min-height:690px;
    padding-top:88px;
    padding-bottom:88px;
  }
  .strength-copy h2{font-size:42px;line-height:.96}
}


/* === Rev4 lightbox project navigation === */
.lightbox figure{grid-template-rows:1fr auto auto}
.lightbox-project-nav{
  width:100%;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:18px;
  padding-top:18px;
  margin-top:12px;
  border-top:1px solid #252525;
}
.project-nav{
  min-height:42px;
  padding:0;
  border:0;
  background:transparent;
  color:#d8d8d8;
  cursor:pointer;
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:9px;
  transition:color .2s,transform .2s;
}
.project-nav:hover,.project-nav:focus-visible{color:#fff;outline:none}
.project-prev{text-align:left}
.project-prev:hover{transform:translateX(-4px)}
.project-next{text-align:right}
.project-next:hover{transform:translateX(4px)}
#lightbox-project-count{font-size:9px;letter-spacing:.15em;color:#676767}
.project-nav[hidden]{display:block;visibility:hidden;pointer-events:none}
@media (max-width:620px){
  .lightbox figure{padding-bottom:18px}
  .lightbox-project-nav{gap:8px;padding-top:14px;margin-top:10px}
  .project-nav{font-size:8px;letter-spacing:.08em}
  #lightbox-project-count{font-size:8px}
}


/* === Rev5 mobile layout + branding refinements === */
.brand span{display:block;white-space:nowrap}

/* Landing hero back to clean black (no photo background). */
.hero{background:#000}
.hero-grid{opacity:.92}
.hero-glow{opacity:.18}
.hero-inner{filter:none}

@media (max-width:900px){
  /* ABOUT section on mobile: convert to image-backed overlay like Goals section. */
  .intro{
    position:relative;
    overflow:hidden;
    isolation:isolate;
    background:#060606;
  }
  .intro::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:url('../assets/images/about/about-stage.webp') center center/cover no-repeat;
    filter:grayscale(1);
    opacity:.38;
  }
  .intro::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:linear-gradient(180deg,rgba(0,0,0,.46) 0%,rgba(0,0,0,.68) 48%,rgba(0,0,0,.88) 100%);
  }
  .intro .section-kicker,
  .intro .intro-grid{position:relative;z-index:1}
  .intro-grid{display:block;gap:0}
  .intro-copy{max-width:720px}
  .intro-copy .lead{color:#efefef}
  .intro-copy p{max-width:100%;color:#cbcbcb}
  .intro-visual{display:none}

  /* Strength section on mobile: keep photo behind copy, but make it clearer. */
  .strength::before{
    background:url('../assets/images/about/strength-light.webp') 58% center/cover no-repeat;
    opacity:.42;
  }
  .strength::after{
    background:linear-gradient(180deg,rgba(0,0,0,.26) 0%,rgba(0,0,0,.58) 48%,rgba(0,0,0,.84) 100%);
  }
  .strength-copy p{color:#d2d2d2}
}

@media (max-width:620px){
  .brand{gap:9px;font-size:11px;letter-spacing:.11em}
  .brand img{width:34px;height:29px}
  .hero h1{font-size:clamp(40px,11.6vw,64px);line-height:.9}
  .hero-wordmark p{font-size:9px;letter-spacing:.18em}
  .hero-inner{min-height:100svh;justify-content:center;padding-top:100px;padding-bottom:70px}

  .intro{padding-top:96px;padding-bottom:96px}
  .intro::before{background-position:center 54%;opacity:.40}
  .intro-copy h2{max-width:330px}

  .strength::before{background-position:55% center;opacity:.44}
}