*,*::before,*::after{box-sizing:border-box}
:root{
  --ink:#0B0B0B; --paper:#FFFFFF; --off:#F4F4F4;
  --mut:#5A5A5A; --mutd:#A3A3A3;
  --rule:#DCDCDC; --ruled:#2A2A2A;
  --pad:clamp(20px,5vw,64px);
  --sec:clamp(72px,11vw,150px);
}
html,body{max-width:100%;overflow-x:hidden}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Inter Tight",system-ui,sans-serif;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-wrap:break-word;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:inherit}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,p,figure,blockquote{margin:0}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.hero :focus-visible,.services :focus-visible,.closing :focus-visible,
.ftr :focus-visible,.hdr :focus-visible,.ovl :focus-visible{outline-color:#fff}
.wrap{max-width:1240px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.skip{position:absolute;left:-9999px;top:0;background:#fff;color:#000;padding:10px 16px;z-index:200}
.skip:focus{left:8px;top:8px}

/* type helpers */
.idx,.btn-solid,.btn-bare,.btn-enq,.tlink,.num,.svc-t,.tile-n,.tile-i,.q-tag,
.ftr-tag,.totop,.promo,.vert-label,.scrollcue,.mq-track,.shot-lbl,.shot-num,
.hero-meta,.svc-foot,.ftr-cta{
  font-family:"Jost",system-ui,sans-serif;text-transform:uppercase;
}
.h2{
  font-family:"Jost",system-ui,sans-serif;text-transform:uppercase;font-weight:500;
  font-size:clamp(1.65rem,4.3vw,3.05rem);line-height:1.05;letter-spacing:.09em;
}
.h2-big{font-size:clamp(2rem,6.4vw,4.6rem);letter-spacing:.06em}
.h2-d{color:#fff}
.idx{font-size:.66rem;letter-spacing:.3em;color:var(--mut);font-weight:500}
.idx-d{color:var(--mutd)}
.lede{max-width:60ch;color:var(--mut);font-size:clamp(1rem,1.4vw,1.08rem);margin-top:20px}
.lede-d{color:#B4B4B4}
.link-row{margin-top:clamp(26px,3.5vw,40px)}
.tlink{font-size:.7rem;letter-spacing:.24em;font-weight:500;text-decoration:none;
  border-bottom:1px solid currentColor;padding-bottom:5px;display:inline-block;transition:opacity .2s}
.tlink:hover{opacity:.55}
.tlink-d{color:#fff}

/* buttons */
.btn-solid{
  display:inline-block;background:#fff;color:#0B0B0B;text-decoration:none;
  padding:17px 34px;font-size:.72rem;letter-spacing:.26em;font-weight:500;border:1px solid #fff;
  transition:background .25s,color .25s;
}
.btn-solid:hover{background:transparent;color:#fff}
.btn-bare{
  color:#fff;text-decoration:none;font-size:.72rem;letter-spacing:.26em;font-weight:500;
  border-bottom:1px solid #555;padding-bottom:6px;transition:border-color .25s;
}
.btn-bare:hover{border-color:#fff}

/* promo */
.promo{background:#000;color:#B4B4B4;font-size:.58rem;letter-spacing:.26em;
  text-align:center;padding:9px 14px;border-bottom:1px solid var(--ruled);line-height:1.7}
.promo-tag{color:#7a7a7a}

/* header */
.hdr{position:sticky;top:0;z-index:90;background:var(--ink);border-bottom:1px solid transparent;transition:border-color .3s}
.hdr.stuck{border-bottom-color:var(--ruled)}
.hdr-in{max-width:1240px;margin:0 auto;padding:12px var(--pad);display:flex;align-items:center;gap:16px}
.plate{display:block;background:#fff;padding:4px 6px}
.plate img{height:26px;width:auto}
.plate-lg{padding:14px 18px;box-shadow:16px 16px 0 rgba(255,255,255,.07)}
.plate-lg img{height:clamp(50px,8.4vw,92px);width:auto}
.plate-sm img{height:30px}
.brand{flex:0 0 auto;min-width:0}
.nav-desk{margin-left:auto;min-width:0}
.nav-desk ul{display:flex;gap:clamp(10px,1.5vw,22px);flex-wrap:wrap}
.nav-desk a{
  font-family:"Jost",sans-serif;text-transform:uppercase;font-size:.7rem;letter-spacing:.19em;
  color:#fff;text-decoration:none;padding:6px 0;position:relative;white-space:nowrap;font-weight:400;
}
.nav-desk a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:#fff;transition:width .28s}
.nav-desk a:hover::after,.nav-desk a[aria-current]::after{width:100%}
.btn-enq{
  flex:0 0 auto;border:1px solid #fff;color:#fff;text-decoration:none;padding:11px 20px;
  font-size:.63rem;letter-spacing:.22em;font-weight:500;transition:background .25s,color .25s;
}
.btn-enq:hover{background:#fff;color:var(--ink)}
.burger{display:none;margin-left:auto;background:none;border:1px solid #3a3a3a;
  width:48px;height:46px;flex-direction:column;gap:6px;align-items:center;justify-content:center;cursor:pointer}
.burger span{display:block;width:20px;height:1px;background:#fff}

@media(max-width:1080px){
  .nav-desk{display:none}
  .burger{display:flex}
  .btn-enq{display:none}
}

/* overlay */
.ovl{position:fixed;inset:0;background:var(--ink);z-index:120;display:flex;flex-direction:column;
  padding:18px var(--pad) 34px;overflow-y:auto}
.ovl[hidden]{display:none}
.ovl-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--ruled);padding-bottom:14px}
.ovl-lbl{font-family:"Jost",sans-serif;text-transform:uppercase;font-size:.62rem;letter-spacing:.3em;color:var(--mutd)}
.ovl-x{background:none;border:1px solid #3a3a3a;color:#fff;font-family:"Jost",sans-serif;
  text-transform:uppercase;font-size:.62rem;letter-spacing:.24em;padding:12px 18px;cursor:pointer}
.ovl-nav{margin:auto 0;padding:28px 0}
.ovl-nav a{display:block;font-family:"Jost",sans-serif;text-transform:uppercase;color:#fff;
  text-decoration:none;font-size:clamp(1.4rem,6.5vw,2.2rem);letter-spacing:.13em;font-weight:400;
  padding:12px 0;border-bottom:1px solid var(--ruled)}
.ovl-nav a[aria-current]{color:var(--mutd)}
.ovl-cta{display:block;text-align:center;background:#fff;color:var(--ink);text-decoration:none;
  font-family:"Jost",sans-serif;text-transform:uppercase;font-size:.72rem;letter-spacing:.26em;padding:18px}

/* hero */
.hero{position:relative;background:var(--ink);color:#fff;overflow:hidden;
  min-height:min(88vh,880px);display:flex;align-items:center;
  padding:clamp(48px,8vw,96px) 0 clamp(56px,8vw,96px);
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0 1px,transparent 1px 9px)}
.grooves{position:absolute;right:-18%;top:50%;transform:translateY(-50%);
  width:min(820px,110%);opacity:.07;pointer-events:none}
.hero-in{position:relative;z-index:2;max-width:1240px;margin:0 auto;width:100%;
  padding-left:var(--pad);padding-right:var(--pad)}
.hero-mark{margin-bottom:clamp(30px,4.5vw,54px)}
.plate-lg{display:inline-block}
.hero-h1{
  font-family:"Jost",sans-serif;text-transform:uppercase;font-weight:500;
  font-size:clamp(1.15rem,4.3vw,3.45rem);line-height:1.12;letter-spacing:.08em;
  display:flex;flex-direction:column;gap:.28em;
}
.hero-h1 .l1{white-space:nowrap}
.hero-h1 .l3{font-weight:400;max-width:22ch}
.hero-h1 em{font-style:normal;font-weight:300;color:var(--mutd)}
.hero-h1 .pipe{padding-left:.1em}
.hero-sub{margin-top:clamp(22px,3vw,32px);color:#B4B4B4;max-width:50ch}
.hero-cta{margin-top:clamp(28px,3.6vw,40px);display:flex;flex-wrap:wrap;gap:18px 30px;align-items:center}
.hero-meta{margin-top:clamp(36px,5vw,58px);display:grid;grid-template-columns:1fr;
  gap:0;border-top:1px solid #262626;max-width:820px}
.hero-meta li{border-bottom:1px solid #262626;padding:13px 0;font-size:.68rem;
  letter-spacing:.2em;color:#D6D6D6;display:flex;flex-wrap:wrap;gap:6px 14px;min-width:0}
.hero-meta span{color:#7d7d7d;letter-spacing:.26em;font-size:.6rem;min-width:112px}
@media(min-width:820px){
  .hero-meta{grid-template-columns:repeat(3,1fr);border-bottom:1px solid #262626}
  .hero-meta li{border-bottom:none;border-left:1px solid #262626;padding:16px 20px;
    flex-direction:column;gap:8px}
  .hero-meta li:first-child{border-left:none;padding-left:0}
  .hero-meta span{min-width:0}
}
.scrollcue{display:inline-flex;flex-direction:column;gap:10px;margin-top:clamp(30px,4vw,52px);
  text-decoration:none;color:#8a8a8a;font-size:.6rem;letter-spacing:.3em;transition:color .2s}
.scrollcue-r{width:1px;height:40px;background:linear-gradient(#4a4a4a,transparent)}
.scrollcue:hover{color:#fff}
.vert-label{position:absolute;right:20px;top:50%;transform:translateY(-50%) rotate(180deg);
  writing-mode:vertical-rl;font-size:.6rem;letter-spacing:.42em;color:#666;z-index:2;
  font-family:"Jost",sans-serif;text-transform:uppercase}
@media(max-width:1000px){.vert-label{display:none}}

/* marquee */
.marquee{background:#fff;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);
  overflow:hidden;max-width:100%;padding:16px 0}
.mq-track{display:flex;white-space:nowrap;width:max-content;font-size:.78rem;letter-spacing:.34em;
  font-weight:500;animation:mq 42s linear infinite}
.mq-track span{padding-right:.4em}
.marquee:hover .mq-track{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* grid sections */
.grid-12{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,3vw,48px)}
.approach,.listen,.proof,.closing{padding:var(--sec) 0}
.approach{background:#fff;border-bottom:1px solid var(--rule)}
.listen{background:var(--off)}
.proof{background:#fff}
.closing{background:var(--ink);color:#fff;
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 1px,transparent 1px 10px)}
.rail,.approach-body,.listen-body,.proof-body,.closing-body,.closing .idx{grid-column:1/13;min-width:0}
@media(min-width:920px){
  .rail{grid-column:1/5}
  .approach-body{grid-column:6/13}
  .listen-body{grid-column:5/13}
  .proof-body{grid-column:5/13}
  .closing .idx{grid-column:1/4}
  .closing-body{grid-column:4/13}
}
.approach .h2{max-width:20ch}

/* placeholder shot */
.shot{position:relative;margin-top:26px;background:var(--ink);
  aspect-ratio:3/2;border:1px solid var(--ink);display:flex;align-items:flex-end;
  padding:18px;box-shadow:14px 14px 0 var(--off)}
.shot-num{position:absolute;top:14px;left:18px;color:#3a3a3a;font-weight:300;
  font-size:2.6rem;line-height:1;letter-spacing:.04em}
.shot-lbl{color:#B4B4B4;font-size:.58rem;letter-spacing:.16em;line-height:1.9}

/* services */
.services{background:var(--ink);color:#fff;padding:var(--sec) 0}
.svc-head{display:flex;flex-direction:column;gap:14px;padding-bottom:clamp(28px,4vw,50px)}
.svc-list li{border-top:1px solid var(--ruled)}
.svc-list li:last-child{border-bottom:1px solid var(--ruled)}
.svc-list a{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:clamp(14px,3vw,40px);text-decoration:none;padding:clamp(18px,3vw,32px) clamp(6px,2vw,24px);
  transition:background .3s,color .3s;
}
.svc-list a:hover,.svc-list a:focus-visible{background:#fff;color:var(--ink)}
.svc-list a:hover .num,.svc-list a:focus-visible .num{color:#9a9a9a}
.svc-list a:hover .svc-d,.svc-list a:focus-visible .svc-d{color:var(--mut)}
.svc-list a:hover .svc-a{transform:translateX(8px)}
.num{font-weight:300;font-size:clamp(1.6rem,5vw,4rem);line-height:.85;color:#3f3f3f;
  letter-spacing:.04em;transition:color .3s;min-width:0}
.svc-t{font-size:clamp(1rem,2.4vw,1.7rem);font-weight:500;letter-spacing:.15em;min-width:0}
.svc-d{display:none}
.svc-a{font-size:1.2rem;transition:transform .3s;min-width:0}
@media(min-width:880px){
  .svc-list a{grid-template-columns:auto 5fr 6fr auto}
  .svc-d{display:block;font-family:"Inter Tight",sans-serif;text-transform:none;
    color:#A3A3A3;font-size:.98rem;transition:color .3s;min-width:0}
}
.svc-foot{margin-top:clamp(30px,4vw,48px);display:flex;flex-wrap:wrap;align-items:center;
  gap:12px 26px;font-size:.68rem;letter-spacing:.22em;color:#8f8f8f}

/* listen */
.eq{display:flex;align-items:flex-end;gap:6px;height:clamp(70px,10vw,120px);margin-top:30px}
.eq i{flex:1 1 auto;max-width:12px;background:var(--ink);height:20%;animation:bar 1.25s ease-in-out infinite}
.eq i:nth-child(2n){animation-duration:.95s}
.eq i:nth-child(3n){animation-duration:1.6s}
.eq i:nth-child(4n){animation-duration:1.1s}
.eq i:nth-child(5n){animation-duration:1.85s}
@keyframes bar{0%,100%{height:14%}50%{height:100%}}
.tiles{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--ink);
  margin-top:clamp(34px,4.5vw,52px)}
.tile{display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--ink);
  padding:20px 16px;text-decoration:none;transition:background .25s,color .25s}
.tile:hover{background:var(--ink);color:#fff}
.tile-i{font-size:.62rem;letter-spacing:.2em;color:#8a8a8a;font-weight:400}
.tile:hover .tile-i{color:#8a8a8a}
.tile-n{font-size:.8rem;letter-spacing:.24em;font-weight:500;flex:1 1 auto;min-width:0}
.tile-x{font-family:"Jost",sans-serif}
@media(min-width:760px){
  .tiles{grid-template-columns:repeat(3,1fr);border-top:none}
  .tile{border:1px solid var(--ink);margin-left:-1px;flex-direction:column;
    align-items:flex-start;gap:34px;padding:22px 20px;min-height:150px;position:relative}
  .tile-x{position:absolute;right:20px;top:20px}
  .tile-n{flex:0 0 auto}
}

/* proof */
.ph-note{font-family:"Jost",sans-serif;text-transform:uppercase;font-size:.6rem;letter-spacing:.2em;
  color:var(--mut);margin-top:18px;line-height:1.9;max-width:60ch}
.ph-note-d{color:#8f8f8f;max-width:56ch;margin-top:26px}
.quotes{display:grid;grid-template-columns:1fr;gap:0;margin-top:clamp(30px,4vw,48px)}
.q{border:1px solid var(--rule);border-top:2px solid var(--ink);
  padding:26px 24px 24px;margin-top:-1px;display:flex;flex-direction:column;min-width:0}
.q-tag{font-size:.55rem;letter-spacing:.18em;color:#6E6E6E;margin-bottom:16px;line-height:1.9}
.q blockquote{font-size:1.02rem;color:var(--ink);line-height:1.65;flex:1 1 auto}
.q figcaption{margin-top:22px;padding-top:16px;border-top:1px solid var(--rule);
  font-family:"Jost",sans-serif;text-transform:uppercase;
  font-size:.6rem;letter-spacing:.22em;color:var(--mut)}
@media(min-width:820px){
  .quotes{grid-template-columns:repeat(3,1fr)}
  .q{margin-top:0;margin-left:-1px}
}

/* closing */
.closing-body .btn-solid{margin-top:34px}
.closing-sub{margin-top:26px;color:#B4B4B4;font-size:.95rem}

/* footer */
.ftr{background:var(--ink);color:#fff;border-top:1px solid var(--ruled);padding-top:clamp(48px,7vw,84px)}
.ftr-grid{display:grid;grid-template-columns:1fr;gap:44px}
@media(min-width:860px){.ftr-grid{grid-template-columns:1.3fr 1fr 1fr}}
.ftr-tag{margin-top:22px;font-size:.57rem;letter-spacing:.22em;color:#B4B4B4;line-height:2.1;max-width:44ch}
.plate-sm{display:inline-block}
.ftr-nav ul{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;margin-top:20px}
@media(min-width:860px){.ftr-nav ul{grid-template-columns:1fr}}
.ftr-nav a{font-family:"Jost",sans-serif;text-transform:uppercase;font-size:.68rem;letter-spacing:.19em;
  text-decoration:none;color:#B4B4B4;transition:color .2s;display:inline-block;padding:3px 0}
.ftr-nav a:hover,.ftr-nav a[aria-current]{color:#fff}
.soc{display:flex;flex-wrap:wrap;gap:14px;margin-top:20px}
.soc a{display:block;color:#fff;opacity:.6;transition:opacity .2s;padding:6px}
.soc a:hover{opacity:1}
.soc svg{width:22px;height:22px}
.ftr-cta{display:inline-block;margin-top:26px;border:1px solid #4a4a4a;color:#fff;
  text-decoration:none;padding:13px 26px;font-size:.63rem;letter-spacing:.24em;
  transition:background .25s,color .25s,border-color .25s}
.ftr-cta:hover{background:#fff;color:var(--ink);border-color:#fff}
.ftr-btm{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center;
  border-top:1px solid var(--ruled);margin-top:clamp(44px,6vw,70px);padding-top:26px;padding-bottom:34px}
.ftr-btm p{font-size:.78rem;color:#8f8f8f}
.totop{font-size:.62rem;letter-spacing:.26em;text-decoration:none;color:#B4B4B4;
  border-bottom:1px solid #3a3a3a;padding-bottom:5px}
.totop:hover{color:#fff;border-color:#fff}

/* reveal */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .mq-track,.eq i{animation:none !important}
  .eq i{height:60%}
  .reveal{opacity:1;transform:none;transition:none}
}