/* Closing call to action: a light card that overlaps the dark footer, with the team photo framed by the logo's square motifs */
.close{--cl-bg:#F7F7F5;--cl-foot:#121614;--cl-ink:#121614;--cl-green:#9FD7B1;
  position:relative;z-index:2;padding:var(--section-y) var(--gutter) 0;background:linear-gradient(180deg,var(--cl-bg) 0,var(--cl-bg) calc(100% - clamp(48px,5vw,64px)),var(--cl-foot) calc(100% - clamp(48px,5vw,64px)))}
.close-card{position:relative;max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:clamp(24px,4vw,64px);
  border:1px solid #E2E3E0;border-radius:var(--r-xl);padding:clamp(40px,5vw,72px) 0 clamp(40px,5vw,72px) clamp(24px,6vw,96px);
  background:radial-gradient(58% 72% at 60% 74%,rgba(159,215,177,.72),rgba(159,215,177,.28) 48%,transparent 78%),var(--page-bg,#F7F7F5)}
.close-copy{position:relative;z-index:2;max-width:30em}
.close-copy h2{font-size:var(--h2);line-height:1.06;letter-spacing:-.035em;font-weight:500;color:var(--cl-ink);text-wrap:balance}
.close-copy p{font-size:var(--lead);line-height:1.6;color:#2E3330;margin-top:24px;max-width:26em;text-wrap:balance}
.close-copy .btn{margin-top:32px;background:var(--cl-ink);color:#F7F7F5!important}
.close-copy .btn:hover{background:#2A302C;box-shadow:none}
.close-art{position:relative;margin-right:clamp(-56px,-3.5vw,-24px)}
.close-art .close-photo{position:relative;z-index:1;display:block;width:100%;aspect-ratio:681/500;object-fit:cover;border-radius:var(--r-lg)}
/* Brian's frame artwork, positioned as in the design relative to the 681 x 500 photo:
   the bottom-left frame (506 x 277) sits behind the photo, the right frame (402 x 412) sits over it */
.close-art .close-lines{position:absolute;height:auto;object-fit:fill;border-radius:0;pointer-events:none}
.close-art .close-lines.back{z-index:0;left:-12.48%;top:59.45%;width:74.3%;aspect-ratio:506/277}
.close-art .close-lines.front{z-index:2;left:56.42%;top:5%;width:59.03%;aspect-ratio:402/412}

.foot{background:#121614;color:#F7F7F5;padding:clamp(40px,5vw,56px) var(--gutter) 32px;position:relative;z-index:2}
.foot-wrap{max-width:var(--container);margin:0 auto}
.foot-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
.foot-brand .logo{width:146px;height:32px}
.foot-brand p{font-size:var(--small);line-height:1.6;color:#C9CCC9;margin-top:24px;max-width:24em}
.foot h3{font-size:var(--label);letter-spacing:var(--label-track);text-transform:uppercase;color:#9298A6;font-weight:400;margin-bottom:24px}
.foot ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.foot a{color:#F7F7F5;text-decoration:none;font-size:var(--body);opacity:.9;transition:opacity .2s}
.foot a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.foot-bottom{display:flex;justify-content:space-between;gap:16px;margin-top:clamp(48px,6vw,80px);padding-top:24px;border-top:1px solid rgba(255,255,255,.12);font-size:var(--label);color:#C9CCC9}
.foot-bottom a{font-size:var(--label)}

@media(max-width:900px){
  .close-card{grid-template-columns:1fr;padding:40px 24px 0}
  .close-art{margin:0 0 -1px}.close-art .close-photo{border-radius:var(--r-md) var(--r-md) 0 0}
  .close-art .close-lines{display:none}
  .foot-top{grid-template-columns:1fr 1fr 1fr}.foot-brand{grid-column:1/-1}
}
@media(max-width:560px){.foot-top{grid-template-columns:1fr}}