:root{
  --ink:#121715; --green:#1E3A2F; --green2:#2B4A3D; --ivory:#F4EFE4; --paper:#FAF7F0;
  --stone:#6F746E; --rule:#C8BFAE; --gold:#B9A583;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --pad:clamp(1.4rem,5.5vw,4.5rem);
}
@font-face{font-family:"Cormorant Garamond";src:url(fonts/CormorantGaramond-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(fonts/CormorantGaramond-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(fonts/CormorantGaramond-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(fonts/CormorantGaramond-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Jost";src:url(fonts/Jost-300.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Jost";src:url(fonts/Jost-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Jost";src:url(fonts/Jost-500.woff2) format("woff2");font-weight:500;font-display:swap}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:300 1.0625rem/1.7 var(--sans);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:.005em;margin:0}
p{margin:0}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.5rem 1rem}
.wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad)}
.eyebrow{font:500 .7rem/1.4 var(--sans);letter-spacing:.32em;text-transform:uppercase;color:rgba(244,239,228,.78);margin-bottom:1.4rem}
.eyebrow.dark{color:var(--green2)}
.rule{display:block;width:56px;height:1px;background:var(--gold);margin:1.8rem 0}
.rule.light{background:rgba(244,239,228,.55)}

/* header */
.bar{position:absolute;inset:0 0 auto 0;z-index:5;display:flex;align-items:center;justify-content:space-between;
  padding:calc(env(safe-area-inset-top) + 1.2rem) var(--pad) 1.2rem;color:var(--ivory)}
.brand{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none}
.mark{width:28px;height:28px;flex:none}
.word{font:500 1.05rem/1 var(--serif);letter-spacing:.34em;text-transform:uppercase;display:flex;flex-direction:column;gap:.32rem}
.word span{font:400 .54rem/1 var(--sans);letter-spacing:.62em;opacity:.8}
.bar nav{display:flex;gap:2.2rem}
.bar nav a{font:400 .72rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;text-decoration:none;opacity:.85}
.bar nav a:hover{opacity:1}
@media (max-width:719px){.bar nav a:not(:last-child){display:none}}

/* hero */
.hero{position:relative;min-height:100svh;min-height:100vh;display:flex;align-items:flex-end;color:var(--ivory);background:var(--ink);overflow:hidden}
@supports(min-height:100svh){.hero{min-height:100svh}}
.hero picture,.hero img{position:absolute;inset:0;width:100%;height:100%}
.hero img{object-fit:cover;object-position:50% 30%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,23,21,.55) 0%,rgba(18,23,21,.05) 30%,rgba(18,23,21,.35) 58%,rgba(18,23,21,.92) 100%)}
.hero-in{position:relative;z-index:2;width:100%;max-width:1180px;margin:0 auto;padding:0 var(--pad) calc(env(safe-area-inset-bottom) + clamp(3.2rem,9vh,6.5rem))}
.hero h1{font-size:clamp(2.6rem,9.6vw,5.6rem);line-height:1.02;font-weight:500}
.lede{max-width:30rem;font-size:clamp(1rem,2.4vw,1.15rem);color:rgba(244,239,228,.86)}

/* approach */
.approach{padding:clamp(4.5rem,12vw,8.5rem) 0;background:var(--paper)}
.approach h2,.about h2{font-size:clamp(2rem,6vw,3.3rem);line-height:1.08;max-width:22ch}
.pillars{list-style:none;margin:clamp(2.8rem,7vw,4.5rem) 0 0;padding:0;display:grid;gap:0}
.pillars li{border-top:1px solid var(--rule);padding:1.8rem 0 2rem;display:grid;grid-template-columns:3rem 1fr;column-gap:1rem}
.pillars li:last-child{border-bottom:1px solid var(--rule)}
.num{font:400 .72rem/2.6 var(--sans);letter-spacing:.2em;color:var(--gold);grid-row:span 2}
.pillars h3{font-size:1.75rem;line-height:1.2;margin-bottom:.55rem}
.pillars p{color:var(--stone);max-width:34rem}
@media (min-width:900px){
  .pillars{grid-template-columns:repeat(3,1fr);gap:3rem}
  .pillars li,.pillars li:last-child{display:block;border-bottom:0;padding:2rem 0 0}
  .num{display:block;margin-bottom:1.6rem;line-height:1}
}

/* band */
.band{margin:0;background:var(--ink)}
.band img{width:100%;aspect-ratio:2.2/1;object-fit:cover;opacity:.94}
@media (max-width:699px){.band img{aspect-ratio:4/3}}

/* about */
.about{padding:clamp(4.5rem,12vw,8.5rem) 0;background:var(--ivory)}
.two{display:grid;gap:3rem}
.about-copy>p:not(.eyebrow){margin-top:1.6rem;max-width:34rem;color:#3c423e}
.leader .name{font:500 1.5rem/1.2 var(--serif)}
.leader .person+.person{margin-top:1.4rem}
.leader .role{font:400 .72rem/1.6 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--stone);margin-top:.35rem}
.about-img img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media (min-width:900px){.two{grid-template-columns:1.1fr .9fr;gap:6rem;align-items:center}}

/* contact */
.contact{background:var(--green);color:var(--ivory);padding:clamp(4.5rem,12vw,8rem) 0}
.contact h2{font-size:clamp(2.2rem,7vw,3.6rem);line-height:1.05}
.cols{display:grid;gap:2.6rem;margin-top:3rem;padding-top:2.6rem;border-top:1px solid rgba(244,239,228,.25)}
.cols h3{font:500 .72rem/1 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.cols p{color:rgba(244,239,228,.86);max-width:26rem}
.cols a{text-decoration:none;border-bottom:1px solid rgba(244,239,228,.35);padding-bottom:1px}
.cols p+p{margin-top:.8rem}
.muted{opacity:.7}
.btn{display:inline-block;margin-top:1.5rem;padding:1rem 1.9rem!important;border:1px solid rgba(244,239,228,.7)!important;font:400 .72rem/1 var(--sans);letter-spacing:.28em;text-transform:uppercase;transition:background .2s,color .2s}
.btn:hover{background:var(--ivory);color:var(--green)}
@media (min-width:800px){.cols{grid-template-columns:1fr 1fr;gap:5rem}}

/* footer */
.foot{background:var(--ink);color:rgba(244,239,228,.7);padding:3.2rem 0 calc(env(safe-area-inset-bottom) + 3rem);font-size:.8rem}
.foot .wrap{display:grid;gap:1.2rem}
.brand.small{color:var(--ivory)}
.brand.small .mark{width:24px;height:24px}
.brand.small .word{font-size:.92rem}
.credits{font-size:.68rem;line-height:1.6;color:rgba(244,239,228,.45);max-width:52rem}
.credits a{color:inherit}