:root{--noir:#10261E;--onyx:#0E1110;--ivory:#F4EFE6;--stone:#E6E2D8;--gold:#C8A96B;--antique:#866630;--line-d:rgba(200,169,107,.28);--line-l:rgba(134,102,48,.3);--gut:clamp(20px,5vw,80px)}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font:400 16px/1.7 Montserrat,sans-serif;background:var(--noir);color:var(--ivory);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.wrap{max-width:1440px;margin:0 auto;padding-inline:var(--gut)}
section{padding-block:clamp(72px,9vw,136px)}
.light{background:var(--ivory);color:var(--noir)}
h1,h2,h3{font-family:"Josefin Sans",sans-serif;line-height:1.12}
h2{font-weight:700;font-size:clamp(34px,4.2vw,60px);letter-spacing:.04em;color:var(--gold);display:flex;align-items:center;gap:.4em}
.light h2{color:var(--antique)}
.bars{display:inline-flex;align-items:center;gap:.09em;height:1.1em;flex:none}
.bars b{width:2px;height:.68em;background:currentColor}
.bars b:nth-child(2){height:1.1em}
.kicker{font-size:12px;font-weight:600;letter-spacing:.38em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.light .kicker{color:var(--antique)}
.btn{display:inline-block;padding:15px 30px;font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;border:1px solid var(--gold);color:var(--gold);transition:background .3s,color .3s}
.btn:hover{background:var(--gold);color:var(--noir)}
.btn.solid{background:var(--gold);color:var(--noir)}
.btn.solid:hover{background:var(--ivory);border-color:var(--ivory)}
.more{font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--antique);border-bottom:1px solid currentColor;padding-bottom:5px;white-space:nowrap}
.more.on-dark{color:var(--gold)}

/* header */
.top{position:fixed;inset:0 0 auto;z-index:10;transition:background .35s}
.top.solid{background:rgba(16,38,30,.96)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:88px}
.top .logo{width:150px;flex:none}
.top .logo img{height:auto}
.top nav{display:flex;align-items:center;gap:26px;font-size:12px;font-weight:500;letter-spacing:.13em;text-transform:uppercase}
.top nav a:not(.btn):hover{color:var(--gold)}
.top nav .btn{padding:11px 20px}
.burger{display:none;background:none;border:0;color:var(--gold);padding:10px;cursor:pointer}
.burger span{display:block;width:26px;height:1.5px;background:currentColor;margin:6px 0}

/* hero */
.hero{position:relative;height:min(100svh,920px);min-height:640px;padding:0;display:flex;align-items:flex-end;overflow:hidden;background:var(--onyx)}
.hero>img{position:absolute;inset:0;animation:drift 22s ease-out both}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,17,16,.62) 0,rgba(14,17,16,.08) 26%,rgba(16,38,30,.66) 56%,var(--noir) 100%)}
@keyframes drift{from{transform:scale(1.07)}to{transform:scale(1)}}
.hero .wrap{position:relative;z-index:1;width:100%;padding-bottom:clamp(36px,5vw,68px)}
.hero h1{font-weight:300;font-size:clamp(40px,6.3vw,96px);letter-spacing:.015em;max-width:15em;color:var(--ivory)}
.hero h1 em{display:block;font-style:normal;font-weight:600;color:var(--gold)}
.hero-foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px;margin-top:28px}
.hero p{max-width:40em;font-size:clamp(15px,1.25vw,18px)}
.cta{display:flex;flex-wrap:wrap;gap:14px}

/* clients */
.clients{padding-block:clamp(56px,6vw,88px)}
.clients .lead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 32px;border-bottom:1px solid var(--line-d);padding-bottom:18px;margin-bottom:clamp(30px,4vw,52px)}
.clients .kicker{margin:0}
.clients .lead p{font-size:15px}
.wall{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(28px,3.4vw,52px) clamp(24px,4vw,64px);align-items:center;justify-items:center}
.wall img{width:auto;height:auto;max-width:100%;max-height:50px;object-fit:contain}
.wall img.tall{max-height:70px}

/* work */
.head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 40px;margin-bottom:clamp(32px,4vw,56px)}
.work{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(10px,1.2vw,18px)}
.card{grid-column:span 4;position:relative;overflow:hidden;aspect-ratio:3/2;background:var(--stone)}
.card.big{grid-column:span 7}.card.mid{grid-column:span 5}
.card.big,.card.mid{aspect-ratio:auto;height:clamp(260px,33vw,500px)}
.card>img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.card:hover>img{transform:scale(1.04)}

/* client logo on a photo */
.tag{position:absolute;inset:auto 0 0;display:flex;align-items:center;gap:20px;padding:72px 20px 16px;background:linear-gradient(180deg,transparent,rgba(14,17,16,.62) 45%,rgba(14,17,16,.9));pointer-events:none}
.tag img{width:auto;height:auto;max-width:140px;max-height:38px;object-fit:contain;filter:brightness(1.18)}
.hero>.tag{inset:112px var(--gut) auto auto;z-index:1;padding:0;background:none}
.hero>.tag img{max-width:150px;max-height:48px}

.tag img.sm,.hero>.tag img.sm,.page-hero>.tag img.sm{max-width:88px;max-height:22px}
.tag .word{font:600 15px/1 "Josefin Sans",sans-serif;letter-spacing:.34em;text-transform:uppercase;color:var(--gold)}

/* full-width feature photo */
.feature{position:relative;padding:0;background:var(--onyx);height:clamp(320px,52vw,820px);overflow:hidden}
.feature>img{object-position:70% 40%}
.feature>.tag{padding:0;background:none;inset:auto auto clamp(18px,2.6vw,36px) var(--gut)}

/* expertise */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,96px);align-items:center}
.split p+p{margin-top:16px}
.exp .big-photo{aspect-ratio:4/3.4;position:relative}
.exp .big-photo>img{object-position:50% 30%}
.exp .pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.5vw,20px);margin-top:clamp(28px,3vw,44px)}
.exp .pair figure{aspect-ratio:3/2;overflow:hidden;position:relative}
.exp .copy p{margin-top:22px;max-width:32em}
.exp h2{margin-bottom:0}
.brk{position:relative}
.brk::before,.brk::after{content:"";position:absolute;width:44px;height:44px;border:solid var(--gold);z-index:1}
.brk::before{top:-11px;left:-11px;border-width:1px 0 0 1px}
.brk::after{bottom:-11px;right:-11px;border-width:0 1px 1px 0}

/* services */
.services{background:var(--onyx)}
.svc{display:grid;grid-template-columns:repeat(2,1fr);column-gap:clamp(36px,6vw,96px)}
.svc li{list-style:none;display:grid;grid-template-columns:52px 1fr;padding-block:26px;border-top:1px solid var(--line-d)}
.svc{padding:0}
.svc span{font:300 24px/1.3 "Josefin Sans",sans-serif;color:var(--gold)}
.svc h3 a:hover{color:var(--gold)}
.svc h3{font-weight:600;font-size:22px;letter-spacing:.03em;color:var(--ivory)}
.svc p{font-size:15px;margin-top:6px;color:#cfd2c9}

/* about */
.about figure{aspect-ratio:1/1.08;overflow:hidden;position:relative}
.about .copy p{margin-top:22px;max-width:34em}
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:26px 36px;margin:34px 0}
.pillars h3{font-weight:700;font-size:19px;letter-spacing:.03em;color:var(--antique)}
.pillars p{font-size:14px;line-height:1.55;margin-top:4px}

/* closing */
.close{text-align:center;padding-block:clamp(80px,9vw,130px) 40px}
.close img.lg{width:min(250px,60vw);height:auto;margin:0 auto 40px}
.close h2{display:block;font-weight:300;color:var(--ivory);font-size:clamp(30px,3.7vw,52px);max-width:17em;margin:0 auto}
.close h2 em{font-style:normal;font-weight:600;color:var(--gold)}
.close .cta{justify-content:center;margin-top:34px}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:clamp(56px,6vw,88px);padding-top:30px;border-top:1px solid var(--line-d);font-size:14px;text-align:left}
.facts b{display:block;font-size:11px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.foot{margin-top:40px;font-size:12px;letter-spacing:.06em;opacity:.65;text-align:left}

/* inner pages */
.top nav a[aria-current]{color:var(--gold)}
.page-hero{position:relative;height:clamp(440px,62svh,640px);padding:0;display:flex;align-items:flex-end;overflow:hidden;background:var(--onyx)}
.page-hero>img{position:absolute;inset:0}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,17,16,.62),rgba(14,17,16,.12) 34%,rgba(16,38,30,.72) 72%,var(--noir))}
.page-hero .wrap{position:relative;z-index:1;width:100%;padding-bottom:clamp(30px,4vw,52px)}
.page-hero>.tag{inset:auto var(--gut) clamp(34px,4.4vw,58px) auto;z-index:1;padding:0;background:none}
.page-hero>.tag img{max-width:150px;max-height:48px}
h1.t{font-weight:600;font-size:clamp(40px,5.4vw,80px);letter-spacing:.03em;color:var(--gold)}
.plain{padding-block:clamp(140px,14vw,190px) clamp(40px,5vw,64px)}
.plain p,.lede{max-width:40em;margin-top:18px;font-size:clamp(16px,1.3vw,19px)}
.quote{font:300 clamp(30px,4vw,56px)/1.2 "Josefin Sans",sans-serif;max-width:17em}
.quote em{font-style:normal;font-weight:600;color:var(--gold)}
.light .quote em{color:var(--antique)}

/* gallery */
.masonry{columns:3;column-gap:14px}
.tile{position:relative;display:block;width:100%;margin-bottom:14px;break-inside:avoid;overflow:hidden;background:var(--stone)}
.tile>img{height:auto;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.tile:hover>img{transform:scale(1.03)}
.lb{position:fixed;inset:0;z-index:30;display:none;align-items:center;justify-content:center;background:rgba(14,17,16,.96);padding:20px}
.lb.on{display:flex}
.lb img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.lb button{position:absolute;top:16px;right:20px;background:none;border:0;color:var(--gold);font:300 40px/1 "Josefin Sans",sans-serif;padding:8px;cursor:pointer}

/* cards, steps, leaders */
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,48px)}
.cards3>div{border-top:1px solid var(--line-d);padding-top:22px}
.light .cards3>div{border-color:var(--line-l)}
.cards3 h3{font-weight:600;font-size:23px;letter-spacing:.03em;color:var(--gold)}
.light .cards3 h3{color:var(--antique)}
.cards3 p{font-size:15px;margin-top:8px}
.strip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:clamp(40px,5vw,72px)}
.strip figure{position:relative;aspect-ratio:4/3;overflow:hidden}
.steps{padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:30px clamp(20px,3vw,44px)}
.steps li{list-style:none;border-top:1px solid var(--line-l);padding-top:16px}
.steps span{font:300 30px/1 "Josefin Sans",sans-serif;color:var(--antique)}
.steps h3{font-weight:700;font-size:20px;letter-spacing:.03em;margin-top:10px}
.steps p{font-size:14px;line-height:1.55;margin-top:5px}
.leaders .role{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#cfd2c9;margin-top:6px;line-height:1.5}
.grp{display:flex;align-items:center;gap:20px;margin:clamp(36px,4vw,56px) 0 clamp(24px,3vw,36px);font-size:12px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--gold)}
.grp::after{content:"";flex:1;height:1px;background:var(--line-d)}
.wall.full{grid-template-columns:repeat(5,1fr)}
.wall.full img{max-height:60px}

/* service disciplines */
.discs{display:grid;gap:clamp(48px,6vw,96px);margin-top:clamp(44px,5vw,76px)}
.disc{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:center}
.disc:nth-child(even) figure{order:2}
.disc figure{aspect-ratio:3/2;overflow:hidden}
.disc span{font:300 26px/1 "Josefin Sans",sans-serif;color:var(--gold)}
.disc h2{display:block;font-size:clamp(28px,3vw,42px);margin-top:10px}
.disc ul{padding:0;margin-top:20px}
.disc li{list-style:none;padding-block:10px;border-top:1px solid var(--line-d);font-size:15px}

/* contact */
.enq{display:grid;gap:18px}
.enq label{display:grid;gap:6px;font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.enq input,.enq select,.enq textarea{font:400 16px/1.5 Montserrat,sans-serif;color:var(--ivory);background:transparent;border:0;border-bottom:1px solid var(--line-d);border-radius:0;padding:10px 0;width:100%;letter-spacing:0;text-transform:none}
.enq select option{color:var(--noir)}
.enq input:focus,.enq select:focus,.enq textarea:focus{outline:0;border-bottom-color:var(--gold)}
.enq .btn{justify-self:start;cursor:pointer;background:var(--gold);color:var(--noir);font-family:inherit}
.details{display:grid;gap:26px;align-content:start}
.details b{display:block;font-size:11px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.details a{border-bottom:1px solid var(--line-d)}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:space-between;align-items:center;margin-top:34px;font-size:12px;letter-spacing:.06em}
.foot-nav .foot{margin:0}
.foot-nav nav{display:flex;flex-wrap:wrap;gap:6px 24px;opacity:.8}
.bare{padding-top:0}

@media (max-width:980px){
  .masonry{columns:2}
  .cards3{grid-template-columns:1fr}
  .disc{grid-template-columns:1fr}
  .disc:nth-child(even) figure{order:0}
  .steps{grid-template-columns:repeat(2,1fr)}
  .wall.full{grid-template-columns:repeat(4,1fr)}
  .wall{grid-template-columns:repeat(4,1fr)}
  .split,.svc{grid-template-columns:1fr}
  .exp .copy{order:-1}
  .card.big,.card.mid{grid-column:span 12}
  .card{grid-column:span 6}
  .card:nth-child(7){grid-column:span 12}
  .card.big,.card.mid{height:auto;aspect-ratio:3/2}
}
@media (max-width:1240px){
  .top .wrap{height:72px}.top .logo{width:118px}
  .burger{display:block}
  .top nav{position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;padding:6px var(--gut) 24px;background:var(--noir);display:none}
  .top.open{background:var(--noir)}
  .top.open nav{display:flex}
  .top nav a:not(.btn){padding:14px 0;width:100%;border-bottom:1px solid var(--line-d)}
  .top nav .btn{margin-top:18px}
  }
@media (max-width:600px){
  .kicker{letter-spacing:.26em}
  .masonry{columns:1}
  .steps{grid-template-columns:1fr}
  .strip{grid-template-columns:1fr}
  .wall.full{grid-template-columns:repeat(3,1fr)}
  .page-hero>.tag{display:none}
  .wall{grid-template-columns:repeat(3,1fr)}
  .card,.card:nth-child(7){grid-column:span 12}
  .pillars{grid-template-columns:1fr}
  .facts{grid-template-columns:1fr}
  .cta .btn{flex:1 1 100%;text-align:center}
  .brk::before{left:-7px}.brk::after{right:-7px}
}
@media (prefers-reduced-motion:reduce){.hero>img{animation:none}.card>img{transition:none}html{scroll-behavior:auto}}