.art-doc{
  --art-print: var(--fg);
  --art-quiet: var(--fg2);
  --art-faint: var(--fg3);
  --art-hair: var(--line);
  --art-hair-soft: color-mix(in srgb, var(--fg) 11%, transparent);
  color:var(--art-print);
}

.artifact{position:relative;margin:0 0 30px;max-width:600px;isolation:isolate}
#governance-2 .artifact{max-width:none;margin-bottom:34px}
.art-obj{position:relative}
.art-sheet{
  position:relative;
  background:transparent;
  border:1px solid var(--art-hair);
  border-radius:3px;
  padding:30px 32px 26px;
}

.art-lbl{
  display:block;
  font-family:SuisseMono,ui-monospace,monospace;
  font-weight:400;
  font-size:14px;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--art-faint);
  margin:0 0 14px;
  line-height:1.4;
}
.art-lbl--r{margin:0;text-align:right;color:var(--art-print)}
.art-meta{
  display:block;
  font-family:SuisseMono,ui-monospace,monospace;
  font-size:14px;
  letter-spacing:.02em;
  line-height:1.55;
  color:var(--art-faint);
  margin:0;
  max-width:none;
  text-wrap:pretty;
}
.art-row-t{
  font-family:Suisse,system-ui,sans-serif;
  font-weight:400;
  font-size:17px;
  line-height:1.35;
  color:var(--art-print);
}
.art-rank{
  flex:0 0 auto;width:24px;
  font-family:SuisseMono,ui-monospace,monospace;
  font-size:14px;letter-spacing:.06em;
  font-variant-numeric:tabular-nums;
  color:var(--art-faint);
  line-height:1.5;
}
.art-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.art-li{display:flex;align-items:center;gap:14px}
.art-foot{margin-top:22px}

.art-titlebar{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  border-bottom:1px solid var(--art-hair);
  padding:0 0 16px;margin:0 0 18px;
}
.art-titlebar .art-lbl{margin:0}
.art-doc--record .art-foot{border-top:1px solid var(--art-hair);padding-top:16px;display:grid;gap:6px}
.art-list--states{gap:0}
.art-li--state{padding:13px 0;border-bottom:1px solid var(--art-hair-soft)}
.art-li--state:first-child{padding-top:0}
.art-li--state:last-child{border-bottom:0;padding-bottom:0}
.art-li--state .art-row-t{flex:1 1 auto}
.art-state-w{
  flex:0 0 auto;
  font-family:SuisseMono,ui-monospace,monospace;
  font-size:14px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--art-quiet);
}
.art-li--state.is-returned{box-shadow:inset 2px 0 0 var(--art-print);padding-left:14px}
.art-li--state.is-returned .art-state-w{color:var(--art-print)}

.artifact .art-obj{opacity:0;transform:translateY(14px);transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1)}
.artifact.is-in .art-obj{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){
  .artifact .art-obj{transition:none;opacity:1;transform:none}
}

@media (max-width:900px){
  .artifact,#governance-2 .artifact{max-width:100%;margin-bottom:26px}
  #governance-2 .artifact{margin-top:20px}
  .art-doc--record .art-sheet{padding:22px 20px 20px}
  .art-row-t{font-size:16px}
  .artifact .art-obj{transform:translateY(12px)}
  .artifact.is-in .art-obj{transform:translateY(0)}
}



.takes{
  grid-column:1 / -1;
  display:block;
  max-width:none;
  margin:calc(var(--unit)*1.6) 0 0;
  position:relative;
  isolation:isolate;
}

.take{
  position:sticky;
  top:0;
  z-index:1;
  height:100vh;
  overflow:hidden;
  scroll-snap-align:start;
  scroll-snap-stop:normal;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background:#07081a;
}
.take + .take{margin-top:30vh}
.take:nth-child(2){z-index:2}.take:nth-child(3){z-index:3}.take:nth-child(4){z-index:4}
.take:nth-child(5){z-index:5}.take:nth-child(6){z-index:6}
.take::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;height:1px;
  z-index:5;
  background:rgba(242,239,232,.18);
  opacity:var(--take-rule,0);
  pointer-events:none;
}

.take-frame{position:absolute;inset:0;overflow:hidden}
.take-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:var(--tp,50% 50%);
  transform:scale(1.06);
  filter:saturate(.88) contrast(1.03) brightness(.95);
  will-change:transform;
}
.take-frame{
  --take-scrim:radial-gradient(132% 118% at -6% 108%,
    rgba(7,8,26,.90) 0%,
    rgba(7,8,26,.886) 18%,
    rgba(7,8,26,.846) 32%,
    rgba(7,8,26,.776) 45%,
    rgba(7,8,26,.676) 56%,
    rgba(7,8,26,.546) 66%,
    rgba(7,8,26,.406) 75%,
    rgba(7,8,26,.266) 83%,
    rgba(7,8,26,.146) 90%,
    rgba(7,8,26,.060) 95%,
    rgba(7,8,26,.015) 98.5%,
    rgba(7,8,26,0) 100%);
}
.take-treatment{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:var(--take-scrim);
}
.take-treatment span{
  position:absolute;inset:0;
  opacity:.13;
  background-image:radial-gradient(circle at 9px 9px,rgba(242,239,232,.5) 0 1px,transparent 1.5px);
  background-size:17px 17px;
  mix-blend-mode:screen;
  -webkit-mask-image:var(--take-scrim);
  mask-image:var(--take-scrim);
}

.take-head,.take-body{
  position:relative;
  z-index:3;
  opacity:var(--take-copy,1);
  transform:translate3d(0,var(--take-lift,0px),0);
  transition:none;
  width:100%;
  padding:0 var(--pad);
  text-align:left;
  color:var(--bone);
  text-shadow:0 2px 34px rgba(7,8,26,.6);
}
.take-body{padding-bottom:8vh}

.take-stamp{
  display:inline-block;
  margin:0 0 18px;
  padding:7px 12px;
  border:1px solid rgba(242,239,232,.42);
  border-radius:3px;
  font-family:SuisseMono,ui-monospace,monospace;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1.2;
  color:rgba(242,239,232,.94);
  text-shadow:0 2px 24px rgba(7,8,26,.8);
}
.take-name{
  margin:0;
  font-family:Suisse,system-ui,sans-serif;
  font-weight:400;
  font-size:clamp(40px,12.5vw,var(--tn,152px));
  line-height:.96;
  letter-spacing:-.03em;
  color:var(--bone);
  text-wrap:balance;
}
.take-line{
  display:block;
  margin:13px 0 0;
  font-family:SuisseMono,ui-monospace,monospace;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(242,239,232,.86);
}
.take-note{
  margin:18px 0 0;
  max-width:40ch;
  font-size:var(--fs-body);
  line-height:1.5;
  color:rgba(242,239,232,.94);
  text-wrap:pretty;
}
.take-quote{
  margin:20px 0 0;
  padding:16px 0 0;
  border-top:1px solid rgba(242,239,232,.26);
  max-width:42ch;
  font-family:Suisse,system-ui,sans-serif;
  font-size:clamp(17px,1.5vw,21px);
  line-height:1.34;
  letter-spacing:-.012em;
  color:var(--bone);
  text-wrap:pretty;
}
.take-attr{
  display:block;
  margin:10px 0 0;
  font-family:SuisseMono,ui-monospace,monospace;
  font-size:9.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(242,239,232,.66);
}
.take-cta{margin:26px 0 0}
@media (min-width:901px){
  .take-cta{--btn-bg:#F4F1EA;--btn-fg:#12101C;--btn-bg-i:#12101C;--btn-fg-i:#F4F1EA}
}
.take.is-cleared .take-body{pointer-events:none}

@media (min-width:901px) and (max-height:820px){
  .take-name{font-size:clamp(40px,9vw,112px)}
  .take-note{font-size:16px;margin-top:14px}
  .take-quote{font-size:18px;margin-top:16px;padding-top:13px}
  .take-body{padding-bottom:6vh}
}

@media (max-width:900px){
  .takes{margin-top:var(--unit)}
  .take + .take{margin-top:0}
  .take{
    position:relative;
    height:auto;
    min-height:100svh;
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:58svh auto;
  }
  .take::before{content:none}
  .take-frame{position:relative;inset:auto;grid-area:1 / 1}
  .take-frame::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#07081a;z-index:4}
  .take-img{object-position:var(--tpm,var(--tp,50% 50%))}
  .take-frame{
    --take-scrim:radial-gradient(155% 96% at 0% 112%,
      rgba(7,8,26,.92) 0%,
      rgba(7,8,26,.906) 18%,
      rgba(7,8,26,.866) 32%,
      rgba(7,8,26,.796) 45%,
      rgba(7,8,26,.696) 56%,
      rgba(7,8,26,.562) 66%,
      rgba(7,8,26,.418) 75%,
      rgba(7,8,26,.274) 83%,
      rgba(7,8,26,.150) 90%,
      rgba(7,8,26,.062) 95%,
      rgba(7,8,26,.015) 98.5%,
      rgba(7,8,26,0) 100%);
  }
  .take-head{grid-area:1 / 1;align-self:end;padding:0 20px 18px}
  .take-body{
    grid-area:2 / 1;
    padding:22px 20px 7vh;
    text-shadow:none;
  }
  .take-stamp{font-size:10.5px;letter-spacing:.12em;padding:6px 10px;margin-bottom:12px}
  .take-name{font-size:clamp(30px,9.4vw,44px);letter-spacing:-.022em;line-height:1}
  .take-line{font-size:9px;letter-spacing:.11em;margin-top:10px}
  .take-note{font-size:15px;line-height:1.5;margin-top:0;max-width:470px}
  .take-quote{font-size:17px;margin-top:18px;padding-top:15px;max-width:430px}
  .take-attr{font-size:8.5px;letter-spacing:.11em;margin-top:9px}
  .take-cta{margin-top:22px}
}

@media (prefers-reduced-motion:reduce){
  .take-img{transform:scale(1.02)}
}