/* viridisgrowth build 20261106-171436 */
:root{
  --forest:#0C1A13;
  --green:#1F3A2E;
  --green-deep:#16302A;
  --gold:#C9A961;
  --bronze:#8B6F47;
  --ivory:#F4F1E9;

  --bg:#FFFFFF;
  --bg-alt:#F5F7F5;
  --ink:#16211C;
  --muted:#55645B;
  --hair:#DFE5DF;
  --eyebrow:var(--bronze);

  --face:"Jost","Century Gothic","Twentieth Century","Futura","Trebuchet MS",sans-serif;
  --pad:clamp(22px,5vw,76px);
  --bay:clamp(5rem,11vw,11rem);

  /* one motion scale for the whole site: everything that fades or rises runs at
     --dur-quick, everything that draws a line runs at --dur-draw, and nothing
     invents its own timing. The hero moves slower than the rest. */
  --dur-quick:.85s;
  --dur-draw:1.6s;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-draw:cubic-bezier(.33,0,.15,1);
  --stagger:.12s;
  --dur-word:1.35s;
  --stagger-word:.17s;
  --bandH:0px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--ink);font:300 1.08rem/1.72 var(--face);overflow-x:clip;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- type ---------- */
.display{font-weight:200;font-size:clamp(3.1rem,7.7vw,8.6rem);line-height:1;letter-spacing:-.022em}
.display.long{font-size:clamp(2.7rem,6.1vw,6.9rem);line-height:1.03}
.huge{font-weight:200;font-size:clamp(2.7rem,6.9vw,7.6rem);line-height:1.04;letter-spacing:-.02em}
.huge.pair{font-size:clamp(2.5rem,5.3vw,6rem)}
h2{font-weight:200;font-size:clamp(2.1rem,4.1vw,4.3rem);line-height:1.1;letter-spacing:-.012em}
h3{font-weight:300;font-size:clamp(1.3rem,1.7vw,1.6rem);line-height:1.28;letter-spacing:-.003em}
.eyebrow{font-weight:400;font-size:.76rem;line-height:1.4;letter-spacing:.24em;text-transform:uppercase;color:var(--eyebrow)}
.lede{font-weight:300;font-size:clamp(1.08rem,1.35vw,1.3rem);line-height:1.62;max-width:40rem}
.body{color:var(--muted);max-width:39rem}
.body+.body{margin-top:1.25rem}

/* ---------- masthead ---------- */
.mast{position:fixed;inset:0 0 auto;z-index:50;color:var(--ink);transition:background .5s var(--ease),box-shadow .5s var(--ease),color .3s}
.mast-in{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:clamp(18px,2.3vw,30px) var(--pad);transition:padding .5s var(--ease)}
.mast.solid{background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 1px 0 var(--hair)}
.mast.solid .mast-in{padding-block:13px}
body.film-full .mast:not(.solid){color:var(--ivory)}
.mark{display:flex;flex-direction:column;gap:.3rem;text-decoration:none;line-height:1}
.mark .glyph{font-size:1.55rem;font-weight:400;letter-spacing:.14em}
.mark .glyph i{font-style:normal}
.mark .full{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;opacity:.74;white-space:nowrap}
.pages{display:flex;gap:clamp(1.1rem,2.7vw,2.9rem);transition:color .3s}
nav.pages a{position:relative;display:inline-block;color:inherit;text-decoration:none;font-weight:400;font-size:.8rem;line-height:1.72;letter-spacing:.18em;text-transform:uppercase;padding:.45rem 0;opacity:.84;transition:opacity .4s}
nav.pages a:hover,nav.pages a[aria-current]{opacity:1}
nav.pages a::after{content:"";position:absolute;left:0;right:.18em;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-quick) var(--ease)}
nav.pages a:hover::after,nav.pages a[aria-current]::after{transform:scaleX(1)}

/* ---------- the film ---------- */
.hero{position:relative;overflow:hidden;overflow:clip}
.hero-main{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end}
.hero-copy{position:relative;z-index:2;padding:clamp(7.5rem,17vh,11rem) var(--pad) clamp(2.5rem,7vh,5rem)}
.hero-copy .rule{display:block;width:clamp(56px,6vw,92px);height:1px;background:var(--gold);margin:clamp(1.4rem,3.2vh,2.4rem) 0;transform-origin:left;transition:transform var(--dur-draw) var(--ease-draw) .95s}
.js .hero-copy .rule{transform:scaleX(0)}
.js .hero-copy .lede,.js .hero-copy .bigmail{opacity:0;transform:translateY(14px);transition:opacity var(--dur-quick) var(--ease) 1.25s,transform var(--dur-quick) var(--ease) 1.25s}
.hero.play .rule{transform:scaleX(1)}
.hero.play .lede,.hero.play .bigmail{opacity:1;transform:none}

.panel{position:absolute;inset:0;z-index:0;overflow:hidden;background:#14271D}
.film{position:absolute;inset:0;z-index:0;background:#14271D center/cover no-repeat}
.film[data-film="home"]{background-image:url(/assets/film/home.jpg)}
.film[data-film="approach"]{background-image:url(/assets/film/approach.jpg)}
.film[data-film="commitments"]{background-image:url(/assets/film/commitments.jpg)}
.film[data-film="contact"]{background-image:url(/assets/film/contact.jpg)}
.film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.7s linear}
.film video.on{opacity:1}
.film video.off{transition:none}
.scrim{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(180deg,rgba(12,26,19,.58) 0%,rgba(12,26,19,.12) 26%,rgba(12,26,19,.2) 52%,rgba(12,26,19,.9) 100%),
  linear-gradient(90deg,rgba(12,26,19,.46) 0%,rgba(12,26,19,0) 62%)}
.film-ctl{position:absolute;right:var(--pad);top:calc(100svh - 74px);z-index:4;width:34px;height:34px;border-radius:50%;border:1px solid rgba(244,241,233,.42);color:var(--ivory);display:grid;place-items:center;opacity:.72;transition:opacity .4s,border-color .4s}
.film-ctl:hover{opacity:1;border-color:var(--gold)}
.film-ctl::before{content:"";position:absolute;inset:-5px}
.film-ctl svg{width:10px;height:10px;fill:currentColor}
.film-ctl .i-play{display:none}
.film-ctl[aria-pressed="true"] .i-play{display:block}
.film-ctl[aria-pressed="true"] .i-pause{display:none}
.no-film .film-ctl{display:none}
.h1-dup{display:none}

/* Home banner: the film fills the screen and carries the copy and the criteria band */
.hero.full .hero-main{min-height:calc(100vh - var(--bandH));min-height:calc(100svh - var(--bandH))}
.hero.full .panel{bottom:calc(-1*var(--bandH))}
.hero.full .hero-copy{color:var(--ivory)}
.hero.full .hero-copy .lede{color:rgba(244,241,233,.92)}
.hero.full .band{--hair:rgba(244,241,233,.28);--eyebrow:var(--gold);color:var(--ivory)}

/* every other film page: a white page with the film in a panel, and the headline crosses into it.
   The curve is painted over a square film, never clipped into it: a rounded clip on video
   shows square black corners on Windows. */

.hero.panelled .scrim{background:linear-gradient(180deg,rgba(12,26,19,.5) 0%,rgba(12,26,19,.1) 30%,rgba(12,26,19,.3) 100%)}

/* headline settles word by word */
.split .wd{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.16em;margin-bottom:-.16em}
.split .wd>span{display:inline-block;transform:translateY(112%);transition:transform var(--dur-word) var(--ease) calc(var(--i)*var(--stagger-word) + .15s)}
.hero.play .split .wd>span,.plain.play .split .wd>span{transform:none}

/* criteria band */
.band{position:relative;z-index:3;margin:0 var(--pad);border-top:1px solid var(--hair);display:grid;grid-template-columns:repeat(4,1fr);gap:0 clamp(1.5rem,3vw,3.5rem);padding:clamp(1.2rem,2.2vw,1.9rem) 0 clamp(1.8rem,3.2vw,2.8rem)}
.band .k{display:block;font-weight:400;font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--eyebrow);margin-bottom:.55rem}
.band .v{display:block;font-weight:200;font-size:clamp(1.45rem,2.45vw,2.5rem);line-height:1.16;letter-spacing:-.008em}

/* ---------- reveal ---------- */
.js .rise{opacity:0;transform:translateY(26px);transition:opacity var(--dur-quick) var(--ease) calc(var(--r,0)*var(--stagger)),transform var(--dur-quick) var(--ease) calc(var(--r,0)*var(--stagger))}
.js .rise.seen{opacity:1;transform:none}

/* ---------- statement ---------- */
.block{background:var(--green-deep);color:var(--ivory);padding:var(--bay) var(--pad);--eyebrow:var(--gold);--muted:rgba(244,241,233,.72);--hair:rgba(244,241,233,.18)}
.block .after{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,39rem);margin-top:clamp(2.5rem,5vw,4.5rem)}
.block .after>*{grid-column:2}
.lit .w{opacity:.2;transition:opacity .5s linear}
.lit .w.on{opacity:1}

/* ---------- chapters with a pinned index ---------- */
.chapters{padding:var(--bay) var(--pad);display:grid;grid-template-columns:minmax(150px,23%) minmax(0,1fr);gap:0 clamp(2rem,5vw,6rem)}
.chapters>.eyebrow{grid-column:1/-1;margin-bottom:clamp(2.5rem,5vw,4.5rem)}
.focus{grid-column:1/-1;max-width:78rem;margin-bottom:clamp(4rem,8vw,8rem)}
.focus .eyebrow{margin-bottom:1.4rem}
.focus h2{font-size:clamp(2.3rem,4.9vw,5.3rem);line-height:1.08;letter-spacing:-.018em}
.focus .body{margin-top:clamp(1.6rem,3vw,2.6rem)}
.idx{position:sticky;top:clamp(6rem,24vh,12rem);align-self:start;display:grid;gap:.95rem}
.idx span{display:block;font-size:.95rem;font-weight:300;color:var(--muted);opacity:.62;padding-left:1.15rem;position:relative;transition:opacity .6s,color .6s}
.idx span::before{content:"";position:absolute;left:0;top:.82em;width:.55rem;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.idx span.on{opacity:1;color:var(--ink)}
.idx span.on::before{transform:scaleX(1)}
.chap{padding-bottom:clamp(4.5rem,9vw,8.5rem)}
.chap:last-child{padding-bottom:0}
.chap .eyebrow{margin-bottom:1.3rem}
.chap h2{max-width:21em;margin-bottom:clamp(1.5rem,2.6vw,2.3rem)}
.levers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,3rem);margin-top:clamp(2.5rem,5vw,4.5rem)}
.levers article{border-top:1px solid var(--hair);padding-top:1.4rem}
.levers h3{margin-bottom:.8rem}
.levers p{color:var(--muted);font-size:1rem;line-height:1.65}

/* ---------- pinned film band, the next section slides over it ---------- */
.pin{position:relative}
.film-band{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;color:var(--ivory);display:flex;align-items:center;background:#14271D}
.film-band .scrim{background:linear-gradient(180deg,rgba(12,26,19,.5) 0%,rgba(12,26,19,.46) 50%,rgba(12,26,19,.66) 100%)}
.film-band .over{position:relative;z-index:2;padding:clamp(3rem,8vh,5rem) var(--pad) 0}
.film-band .eyebrow{color:var(--gold);margin-bottom:1.25rem}
.film-band p:not(.eyebrow){margin-top:1.4rem;max-width:32rem;color:rgba(244,241,233,.92)}
.film-band .film-ctl{top:auto;bottom:clamp(2.2rem,5vh,3.5rem)}
.over-next{position:relative;z-index:2;margin-top:45vh;background:var(--bg)}

.promises{padding:var(--bay) var(--pad);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(3rem,5vw,5rem) clamp(2rem,4vw,4.5rem)}
.promises article{border-top:1px solid var(--hair);padding-top:1.5rem;position:relative}
.promises article::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-draw) var(--ease-draw)}
.promises article:hover::before{transform:scaleX(1)}
.promises .n{display:block;font-size:.76rem;letter-spacing:.2em;color:var(--eyebrow);margin-bottom:1.7rem}
.promises h3{font-weight:200;font-size:clamp(1.55rem,2.1vw,2.1rem);line-height:1.2;margin-bottom:.9rem}
.promises p{color:var(--muted);font-size:1rem;line-height:1.66}


/* ---------- plain (no film) page head and figures ---------- */
.plain{padding:clamp(9.5rem,24vh,15rem) var(--pad) clamp(3.5rem,6vw,5.5rem)}
.plain .lede{margin-top:clamp(1.6rem,3vw,2.6rem);color:var(--muted)}
.plain .eyebrow{margin-bottom:1.4rem}
.plain .bigmail{margin-top:clamp(1.6rem,3vw,2.6rem)}
.figures{margin:0 var(--pad);border-top:1px solid var(--hair);display:grid;grid-template-columns:repeat(2,1fr)}
.figures>div{padding:clamp(1.8rem,3.2vw,3.2rem) clamp(1rem,3vw,3rem) clamp(2.4rem,4vw,4.2rem) 0;border-bottom:1px solid var(--hair)}
.figures>div:nth-child(even){padding-left:clamp(1.25rem,3vw,3rem);border-left:1px solid var(--hair)}
.figures .k{display:block;font-weight:400;font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;color:var(--eyebrow);margin-bottom:1rem}
.figures .v{display:block;font-weight:200;font-size:clamp(2.5rem,5.8vw,6.2rem);line-height:1.06;letter-spacing:-.02em}
.figures .v.sm{font-size:clamp(2.1rem,4vw,4.2rem);line-height:1.14}

.process{padding:var(--bay) var(--pad)}
.process .eyebrow{margin-bottom:1.3rem}
.process h2{margin-bottom:clamp(2.5rem,5vw,4.5rem)}
.process h2+.body{margin-top:clamp(-3rem,-3vw,-1rem)}
.steps li{display:grid;grid-template-columns:clamp(3rem,7vw,7rem) minmax(0,.86fr) minmax(0,1fr);gap:.4rem clamp(1rem,3vw,3rem);padding:clamp(1.3rem,2.3vw,2.2rem) 0;border-top:1px solid var(--hair);align-items:baseline}
.steps li:last-child{border-bottom:1px solid var(--hair)}
.steps .n{font-size:.78rem;letter-spacing:.2em;color:var(--eyebrow)}
.steps b{font-weight:200;font-size:clamp(1.4rem,2.3vw,2.35rem);line-height:1.18}
.steps span{color:var(--muted)}

/* ---------- closing band ---------- */
.cta{padding:var(--bay) var(--pad);background:var(--green-deep);color:var(--ivory)}
.bigmail{display:inline-block;font-weight:200;font-size:clamp(1.3rem,3.45vw,3.5rem);line-height:1.2;letter-spacing:-.008em;text-decoration:none;background:linear-gradient(var(--gold),var(--gold)) 0 100%/100% 1px no-repeat;padding-bottom:.28em;transition:background-size var(--dur-quick) var(--ease)}
.bigmail:hover{background-size:0 1px;background-position:100% 100%}
.cta .bigmail{margin-top:clamp(1.8rem,3.4vw,3rem)}
.hero-copy .bigmail{margin-top:clamp(1.6rem,3vw,2.6rem)}

.routes{padding:var(--bay) var(--pad) 0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(2rem,4vw,4.5rem)}
.routes article{border-top:1px solid var(--hair);padding-top:1.5rem}
.routes h3{font-weight:200;font-size:clamp(1.55rem,2.1vw,2.1rem);line-height:1.2;margin-bottom:.9rem}
.routes p{color:var(--muted)}
.fine{padding:clamp(4rem,7vw,6.5rem) var(--pad) var(--bay);display:grid;grid-template-columns:1fr 2fr;gap:clamp(2rem,4vw,4.5rem)}
.fine h3{font-weight:400;font-size:.76rem;letter-spacing:.26em;text-transform:uppercase;color:var(--eyebrow);margin-bottom:1rem}
.fine p{color:var(--muted);max-width:42rem}

/* ---------- footer ---------- */
.foot{position:relative;overflow:hidden;background:var(--forest);color:var(--ivory);padding:clamp(4rem,7vw,6.5rem) var(--pad) 2.2rem;--muted:rgba(244,241,233,.64);--hair:rgba(244,241,233,.16)}
.foot-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.5fr 1fr 1.25fr .8fr;gap:2.5rem clamp(2rem,4vw,4rem)}
.foot h4{font-weight:400;font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.foot p{color:var(--muted);font-size:.96rem;line-height:1.75}
.foot a{text-decoration:none;transition:color .4s}
.foot a:hover{color:var(--ivory)}
.foot-mark{position:relative;z-index:1;display:block;margin:clamp(3rem,6vw,5.5rem) 0 clamp(1.2rem,2vw,1.8rem);font-weight:200;font-size:clamp(5rem,23.5vw,26rem);line-height:.82;letter-spacing:.03em;color:transparent;-webkit-text-stroke:1px rgba(201,169,97,.32);white-space:nowrap;-webkit-user-select:none;user-select:none}
.foot-legal{position:relative;z-index:1;border-top:1px solid var(--hair);padding-top:1.2rem;font-size:.82rem!important}

/* ---------- film panel, wide screens ---------- */
@media (min-width:901px){
  .hero.panelled .hero-main{justify-content:center}
  .hero.panelled .hero-copy{z-index:1;padding-top:clamp(8rem,18vh,11rem);padding-bottom:clamp(3rem,8vh,5rem)}
  .hero.panelled .panel{left:auto;right:0;width:53vw;z-index:2}
  .hero.panelled .hero-main::after{--r:clamp(90px,15vw,270px);content:"";position:absolute;bottom:-1px;right:calc(53vw - var(--r));width:calc(var(--r) + 3px);height:calc(var(--r) + 1px);z-index:3;pointer-events:none;background:radial-gradient(circle at 100% 0,transparent calc(var(--r) - .5px),var(--bg) calc(var(--r) + .5px))}
  .hero.panelled .lede{max-width:calc(47vw - var(--pad) - 2.5rem);color:var(--muted)}
  .hero.panelled .bigmail{font-size:clamp(1.15rem,2.28vw,2.7rem)}
  .hero.panelled .h1-dup{display:block;position:absolute;margin:0;color:var(--ivory);z-index:1;pointer-events:none}
  .hero.panelled .film-ctl{top:auto;bottom:28px;right:28px}
  body.has-panel .mast:not(.solid) .pages{color:var(--ivory)}
}

/* ---------- phones and small tablets ---------- */
@media (max-width:900px){
  .levers,.promises,.routes{grid-template-columns:1fr}
  .chapters{grid-template-columns:1fr}
  .idx{display:none}
  .block .after{grid-template-columns:1fr}
  .block .after>*{grid-column:1}
  .fine{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot a{display:inline-block;padding:.5rem 0}
  .steps li{grid-template-columns:2.6rem 1fr}
  .steps b,.steps span:not(.n){grid-column:2}
  .hero.panelled .panel{--r:clamp(64px,20vw,130px);position:relative;inset:auto;height:50vh;height:50svh;min-height:300px}
  .hero.panelled .panel::after{content:"";position:absolute;left:0;bottom:-1px;width:var(--r);height:calc(var(--r) + 1px);z-index:3;pointer-events:none;background:radial-gradient(circle at 100% 0,transparent calc(var(--r) - .5px),var(--bg) calc(var(--r) + .5px))}
  .hero.panelled .hero-main{justify-content:flex-start}
  .hero.panelled .hero-copy{padding-top:clamp(2rem,5vh,3rem)}
  .hero.panelled .film-ctl{top:auto;bottom:16px;right:16px}
  body.has-panel .mast:not(.solid){color:var(--ivory)}
  .hero.full .film-ctl{top:92px}
}
@media (max-width:720px){
  .mast-in{flex-direction:column;align-items:flex-start;gap:.3rem;padding-block:12px}
  .mast.solid .mast-in{padding-block:7px}
  .mark{flex-direction:row;align-items:baseline;gap:.6rem}
  .mark .glyph{font-size:1.15rem}
  .pages{gap:clamp(.55rem,3.2vw,1.05rem)}
  nav.pages a{font-size:.75rem;letter-spacing:.1em;padding:.4rem 0}
  nav.pages a::before{content:"";position:absolute;inset:-6px -.3rem -7px}
  .mark{position:relative}
  .mark::after{content:"";position:absolute;inset:-12px 0 -6px}
  .band .k{letter-spacing:.14em}
  .display{font-size:12.4vw}
  .display.long{font-size:10.6vw}
  .huge{font-size:11.2vw}
  .huge.pair{font-size:9.4vw}
  .focus h2{font-size:8.6vw}
  .bigmail,.hero-copy .bigmail{font-size:5.5vw}
  .band{grid-template-columns:1fr 1fr;gap:1.2rem 1.25rem}
  .figures{grid-template-columns:1fr}
  .figures>div:nth-child(even){padding-left:0;border-left:0}
  .figures .v{font-size:11.5vw}
  .figures .v.sm{font-size:9vw}
  .foot-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .split .wd>span,.hero-copy .lede,.hero-copy .bigmail,.hero-copy .rule,.js .rise{transition:none!important;transform:none!important;opacity:1!important}
  .lit .w{opacity:1!important}
}
