/* index */

@media (min-width:901px){
  .bio-grid .porthold{align-self:stretch}
  .bio-grid .portrait{position:sticky!important;top:clamp(72px,10vh,112px)}
}

/* ---------- INTRO ---------- */
.intro{
  position:fixed;
  inset:0;
  z-index:200;
  background:var(--paper);
  box-shadow:0 25vh 0 0 var(--paper);
  display:grid;
  place-items:center;
  overflow:hidden;
  cursor:pointer;
}
.hero .wm{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(64px,17vw,208px);
  line-height:.9;
  letter-spacing:-.03em;
  color:var(--ink);
}
.hero .wm .it{font-style:italic}
.hero .heroimg{width:100%;aspect-ratio:4/5;overflow:hidden;background:#211f18}
.hero .heroimg img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.hero .qline{font-family:var(--serif);font-style:italic;font-size:clamp(22px,3.4vw,34px);color:var(--olive)}
.hero .foot{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-family:var(--mono);
  font-size:clamp(9px,1vw,10.5px);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--soft);
  margin-top:8px;
}
.hero .foot .sc{display:flex;align-items:center;gap:10px}
.hero .foot .sc i{width:40px;height:1px;background:var(--line2);display:block}

@media (min-width:1000px){
  /* wordmark width */
  .hero .wm{font-size:clamp(64px,15.5vw,208px);min-width:0}
  .hero .wm{grid-area:wm}
  .hero .qline{grid-area:q}
  .hero .foot{grid-area:foot;align-self:start}
  .hero .heroimg{
    grid-area:photo;
    align-self:stretch;
    height:100%;
    aspect-ratio:auto;
    width:min(27vw,400px);
    justify-self:end;
    margin:0;
  }
}

/* ---------- BIOGRAFIA ---------- */
.bio-grid{display:grid;grid-template-columns:1fr;gap:clamp(24px,4vw,44px);align-items:start}
.bio-grid .bp{
  font-family:var(--sans);
  font-size:clamp(14.5px,1.05vw,16.5px);
  line-height:1.78;
  color:#3b372e;
  max-width:60ch;
  margin-top:18px;
}
.bio-grid .pull{
  font-family:var(--serif);
  font-style:italic;
  font-size:clamp(21px,2.5vw,33px);
  line-height:1.24;
  letter-spacing:-.01em;
  color:var(--olive);
  max-width:22ch;
  margin:30px 0 6px;
  padding-left:20px;
  border-left:2px solid var(--line2);
}

@media (min-width:761px){
  .bio-grid{column-gap:clamp(48px,6vw,90px)}
}

.bio-grid .rep{grid-column:1/-1;max-width:100%;margin-top:clamp(40px,6vw,70px)}
.bio-grid .rep img{width:100%;height:auto;display:block}
.bio-grid .repcap{
  grid-column:1/-1;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--soft);
  margin-top:10px;
}
/* ---------- GROW ---------- */
.grow{position:relative;height:180vh;padding:0!important;border-top:0!important;background:var(--paper)}
.grow .sticky{
  position:sticky;
  top:0;
  height:100vh;
  height:100dvh;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  overflow:hidden;
}
.grow .gwrap{width:40vw;height:54vh;overflow:hidden;will-change:width,height}
.grow .gwrap img{width:100%;height:100%;object-fit:cover;object-position:50% 34%}
.grow .gcap{
  position:absolute;
  bottom:clamp(24px,4vh,48px);
  top:auto;
  left:var(--gut);
  display:flex;
  align-items:center;
  gap:14px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--soft);
  z-index:2;
}
.grow .gcap i{display:block;width:34px;height:1px;background:var(--bronze)}

@media (max-width:760px){
  .grow .gwrap{width:78vw;height:44vh}
}

.footer .h2 .it{color:#C7C49B}
.footer .bigmark .it{font-style:italic;color:#C7C49B}

@media (max-width:760px){
  main{margin-left:0;padding-top:52px}
}

/* hide section eyebrows */
.eyerow{display:none!important}
/* brigade caption */
.grow .gcap{right:var(--gut);justify-content:space-between;gap:24px}
.grow .gcap .gq{display:flex;align-items:center;gap:14px}
.grow .gcap .gid{text-align:right}

@media (max-width:760px){
  .grow .gcap{display:block}
  .grow .gcap .gid{display:block;text-align:left;margin-top:6px}
}

@media (min-width:1200px){
  .bio-grid{grid-template-columns:minmax(0,620px) minmax(400px,1fr)}
}

@media (max-width:1199px){
  .bio-grid{grid-template-columns:1fr}
  .bio-grid .portrait{max-width:min(100%,760px)}
}

@media (min-width:761px){
  .bio-grid .portrait{position:static}
}

@media (prefers-reduced-motion:reduce){
  .bio-grid .portrait{position:static}
}

.tl b{white-space:nowrap}
.prog-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(14px,2vw,28px);align-items:start}
.prog-col{grid-column:1/span 6}
.prog-img{grid-column:7/span 6;margin:clamp(14px,2vw,30px) calc(var(--gut)*-1) 0 0}
.prog-img img{width:100%;height:auto;display:block}
.prog-img figcaption{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--soft);
  margin-top:11px;
}
.prog{list-style:none;margin:clamp(24px,3vw,40px) 0 0;padding:0;counter-reset:pg}
.prog li{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:baseline;
  gap:clamp(14px,2vw,26px);
  padding:clamp(15px,1.7vw,22px) 0;
}
.prog i{font-style:normal;font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--bronze)}
.prog b{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(22px,2.9vw,40px);
  line-height:1.1;
  letter-spacing:-.015em;
  color:var(--ink);
}
.prog em{
  font-style:normal;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--soft);
  white-space:nowrap;
}

@media (max-width:760px){
  .prog-col, .prog-img{grid-column:1/-1}
  .prog-img{margin-right:0}
  .prog b{font-size:clamp(20px,5.4vw,30px)}
}

@media (min-width:1600px){
  main{margin-left:calc((100vw - 1560px) / 2 + var(--rail));margin-right:calc((100vw - 1560px) / 2)}
}

.lead, .bio-grid .pull, .hero .qline, .cinvite{text-wrap:balance}
main{
  margin-left:0!important;
  margin-right:0!important;
  max-width:1560px!important;
  margin-inline:auto!important;
  padding-top:0!important;
}
.gs{
  position:fixed!important;
  top:clamp(20px,2.4vh,27px)!important;
  left:clamp(22px,4vw,54px)!important;
  z-index:305!important;
  font-family:var(--serif)!important;
  font-size:clamp(22px,2vw,28px)!important;
  line-height:1!important;
  color:#fff!important;
  mix-blend-mode:difference!important;
  pointer-events:none!important;
}
.gs i{font-style:italic}
.gs{opacity:0;transition:opacity .7s cubic-bezier(.16,1,.3,1) .05s}
.lead, .hero .qline, .bio-grid .pull, .cinvite{text-wrap:balance}
.bio-grid .bp{text-wrap:pretty}
.prog li{cursor:default}
.prog li b{display:inline-block;transition:transform .5s cubic-bezier(.16,1,.3,1),color .3s}
.prog li i{transition:color .35s}
.prog li em{transition:color .3s}
.prog li em::after{
  content:"→";
  display:inline-block;
  margin-left:14px;
  color:var(--bronze);
  opacity:0;
  transform:translateX(-8px);
  transition:opacity .4s,transform .45s cubic-bezier(.16,1,.3,1);
}

@media (hover:hover){
  .prog:hover li:not(:hover){opacity:.32}
  .prog li{transition:opacity .45s cubic-bezier(.16,1,.3,1)}
  .prog li:hover b{transform:translateX(clamp(8px,1.2vw,20px))}
  .prog li:hover i{color:var(--bronze)}
  .prog li:hover em::after{opacity:1;transform:none}
}

@media (prefers-reduced-motion:reduce){
  .prog li b, .prog li, .prog li em::after{transition:opacity .2s}
}

@media print{
  .intro, .curve, .viewer{display:none!important}
  main{margin-left:0!important}
  html.js .rvf, html.js .rv{opacity:1!important;transform:none!important}
  .rvl .word, .rvl .char, .mlc b, .ml b{transform:none!important;opacity:1!important}
  section{break-inside:avoid;padding:18pt 0}
  .footer, .foot{background:none!important;color:#18160F!important}
}

/* proof band */
.proof{padding:clamp(48px,7vw,96px) var(--gut) clamp(56px,8vw,110px)}
.proof .pfl{
  display:inline-block;
  margin-top:clamp(18px,2.4vw,28px);
  font-family:var(--mono);
  font-size:clamp(9px,1vw,11px);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--bronze);
}
.proof .pfl:hover{color:var(--ink)}
/* explicit line breaks on desktop */
.footer .cinvite{max-width:none}

@media (max-width:900px){
  .footer .cinvite{max-width:38ch}
}

/* caption below photo */
.prog li a.proglink{
  color:inherit;
  text-decoration:none;
  cursor:pointer;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:baseline;
  gap:clamp(14px,2vw,26px);
  grid-column:1/-1;
}
.prog li:has(a.proglink){display:block}
.prog li a.proglink:hover b{color:var(--olive)}
.sustain .h2{margin-bottom:clamp(28px,4vw,52px)}
.sus-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.sus-grid .lead{max-width:46ch}
.sus-figs{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.5vw,20px)}
.sus-fig{margin:0}
.sus-fig img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;display:block;background:var(--bone)}
.sus-fig figcaption{
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--soft);
  margin-top:11px;
}

@media (max-width:820px){
  .sus-grid{grid-template-columns:1fr;gap:clamp(24px,6vw,40px)}
  .sus-figs{grid-template-columns:1fr}
}

.testi .eyerow{margin-bottom:clamp(30px,4.5vw,60px)}
.testi .who{
  margin-top:clamp(24px,3vw,40px);
  font-family:var(--mono);
  font-size:clamp(10px,1vw,12px);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--soft);
}
.testi .who b{color:var(--ink);font-weight:400}
.testi .who{margin-top:clamp(22px,2.6vw,34px)}
/* ---------- IN THEIR WORDS · STEP QUOTES ---------- */
.credits.credits-steps .credvp{position:sticky;top:0;height:100vh;height:100lvh;overflow:hidden}
.credits.credits-steps .credroll{position:absolute;inset:0;padding:0 var(--gut);transform:none!important}
.credits.credits-steps .cred{
  position:absolute;
  left:var(--gut);
  right:var(--gut);
  top:50%;
  text-align:center;
  opacity:0;
  transform:translateY(calc(-50% + 46px));
  transition:opacity .5s ease,transform .6s cubic-bezier(.16,1,.3,1);
  pointer-events:none;
}
.credits.credits-steps .cred.on{opacity:1;transform:translateY(-50%)}
.credits.credits-steps .cred.out{opacity:0;transform:translateY(calc(-50% - 46px))}
.numbers2{border-top:0}
.numbers2+.proof{border-top:0}
.proof+.sustain{border-top:0}
/* ---------- BY THE NUMBERS · BAND ---------- */
.numbers2{background:var(--spine);padding:clamp(56px,7.5vw,104px) var(--gut);overflow:hidden}
.numbers2 .eyerow{margin-bottom:clamp(28px,3.5vw,52px)}
.numbers2 .eyerow span{color:#A8A188}
.n2stack{display:flex;flex-direction:column;max-width:1240px;margin:0 auto;gap:clamp(20px,2.6vw,40px)}
.n2row{display:flex;align-items:baseline;gap:clamp(22px,3.4vw,56px);width:fit-content;max-width:100%}
.n2row1{align-self:flex-start}
.n2row2{align-self:center;margin-left:clamp(0px,6vw,120px)}
.n2row3{align-self:flex-end}
.n2big{
  margin:0;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(44px,7.4vw,116px);
  line-height:1.02;
  letter-spacing:-.022em;
  color:var(--cream);
  white-space:nowrap;
}
.n2vision em{font-style:italic;color:#C9A664}
.n2mask{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.03em .08em .06em 0}
html.js .n2mask>span{display:inline-block;transform:translateY(114%);will-change:transform;backface-visibility:hidden}
html.js .numbers2.on .n2mask>span{transform:none;transition:transform .95s cubic-bezier(.16,1,.3,1)}
html.js .numbers2.on .n2row1 .n2mask>span{transition-delay:0s}
html.js .numbers2.on .n2row2 .n2mask>span{transition-delay:.15s}
html.js .numbers2.on .n2row3 .n2mask>span{transition-delay:.3s}
.n2fact{
  margin:0;
  font-family:var(--mono);
  font-size:clamp(9px,.82vw,11px);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#A8A188;
  line-height:1.9;
}
.n2fl{text-align:right}
.n2fr{text-align:left}
.n2fact i{font-style:normal;color:#C9A664}
.n2v{color:#E9E4D4}
html.js .n2fact{opacity:0;transform:translateY(10px)}
html.js .numbers2.on .n2fact{
  opacity:1;
  transform:none;
  transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1);
}
html.js .numbers2.on .n2row1 .n2fact{transition-delay:.25s}
html.js .numbers2.on .n2row2 .n2fact{transition-delay:.4s}
html.js .numbers2.on .n2row3 .n2fact{transition-delay:.55s}
/* ---------- APERTURA · LEDE CASCADE ---------- */
.q2 .q2l{display:block}
.q2 .q2l2{margin-left:clamp(26px,5vw,110px)}
.q2 .q2l3{margin-left:clamp(52px,10vw,220px)}
/* ---------- RECOGNITION · INDEX TABLE ---------- */
.proof .eyerow{margin-bottom:clamp(20px,2.6vw,34px)}
.prow{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:baseline;
  column-gap:clamp(18px,3vw,44px);
  padding:clamp(15px,1.9vw,24px) 0;
  border-top:1px solid var(--line2);
}
.pt{font-family:var(--serif);font-size:clamp(17px,1.75vw,25px);color:var(--ink);line-height:1.32}
.pd{
  font-family:var(--mono);
  font-size:clamp(9px,.85vw,11px);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--soft);
  text-align:right;
  white-space:nowrap;
}

@media (max-width:860px){
  .n2row{flex-direction:column;gap:10px;align-items:flex-start}
  .n2big{white-space:normal;font-size:clamp(36px,10.5vw,64px)}
  .n2row2{align-self:flex-start;margin-left:clamp(16px,5.5vw,48px)}
  .n2row2 .n2fact{order:2}
  .n2row3{align-self:flex-start;margin-left:clamp(32px,11vw,96px)}
  .n2fl{text-align:left}
  .prow{grid-template-columns:1fr;row-gap:6px}
  .pd{text-align:left;white-space:normal}
  .q2 .q2l2{margin-left:clamp(16px,5vw,40px)}
  .q2 .q2l3{margin-left:clamp(32px,10vw,80px)}
}

@media (prefers-reduced-motion:reduce){
  html.js .n2mask>span{transform:none;transition:none}
  html.js .n2fact{opacity:1;transform:none;transition:none}
}

/* ---------- CURSOR ON DARK ---------- */
.numbers2{cursor:auto}
body.overdark .cur{opacity:0!important;transition:opacity .25s ease}
/* ---------- CONTENT ---------- */
.herostat{
  font-family:var(--mono);
  font-size:clamp(9.5px,.9vw,11.5px);
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--bronze);
  margin:0 0 14px;
}
.herocta{
  display:inline-block;
  margin-top:clamp(16px,2vw,26px);
  font-family:var(--mono);
  font-size:clamp(9px,1vw,11px);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--bronze);
}
.believe{padding:clamp(56px,8vw,110px) var(--gut) 0}
.believe .eyerow{margin-bottom:clamp(20px,2.6vw,34px)}
.recintro{
  max-width:62ch;
  font-family:var(--serif);
  font-size:clamp(17px,1.6vw,22px);
  line-height:1.5;
  color:var(--ink);
  margin:0 0 14px;
}
.recintro+.recintro{margin-bottom:clamp(24px,3vw,40px)}
.proof .ptable+.recintro{margin-top:clamp(24px,3vw,40px)}
.progintro{
  max-width:52ch;
  font-family:var(--serif);
  font-size:clamp(16px,1.5vw,21px);
  line-height:1.55;
  color:var(--soft);
  margin:0 0 12px;
}
.jcont{padding:clamp(56px,8vw,110px) var(--gut)}
.jcont .eyerow{margin-bottom:clamp(20px,2.6vw,34px)}
.jclead{
  margin:0 0 clamp(18px,2.2vw,30px);
  font-family:var(--serif);
  font-size:clamp(24px,3vw,44px);
  line-height:1.18;
  letter-spacing:-.015em;
  color:var(--ink);
}
.jclead span{display:block}
.jclead .l2b{margin-left:clamp(22px,4vw,80px)}
.jclead .l2c{margin-left:clamp(44px,8vw,160px)}
.prog li em{display:block;white-space:normal;max-width:46ch;line-height:1.7;margin-top:6px}
/* ---------- ART DIRECTION ---------- */
.bsub{
  font-family:var(--mono);
  font-size:clamp(9px,.85vw,11px);
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--bronze);
  margin:clamp(26px,3vw,40px) 0 12px;
}
.bio-grid .txt .bp:first-of-type::first-letter{
  font-family:var(--serif);
  font-size:3.1em;
  line-height:.82;
  float:left;
  padding:6px 10px 0 0;
  color:var(--ink);
}
.believe{padding:clamp(64px,9vw,130px) var(--gut)}
.believe .eyerow{margin-bottom:clamp(34px,4.5vw,64px)}
.blstack{display:flex;flex-direction:column;gap:clamp(26px,3.4vw,54px);max-width:1240px;margin:0 auto}
.blrow{display:flex;align-items:baseline;gap:clamp(22px,3.2vw,52px);width:fit-content;max-width:100%}
.bl1{align-self:flex-start}
.bl2{align-self:center;margin-left:clamp(0px,4vw,90px)}
.bl3{align-self:flex-start;margin-left:clamp(16px,8vw,180px)}
.bl4{align-self:flex-end;margin-right:clamp(0px,4vw,90px)}
.bl5{align-self:flex-end}
.blbig{
  margin:0;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(28px,3.6vw,56px);
  line-height:1.04;
  letter-spacing:-.02em;
  color:var(--ink);
  white-space:nowrap;
}
.blbig .it{color:var(--olive)}
.blnote{
  margin:0;
  font-family:var(--mono);
  font-size:clamp(9px,.82vw,11px);
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--soft);
  line-height:1.85;
  max-width:30ch;
}
.blr{text-align:right}

@media (max-width:860px){
  .blrow{flex-direction:column;gap:8px;align-items:flex-start;margin:0!important;align-self:flex-start!important}
  .blbig{white-space:normal}
  .blr{text-align:left}
  .blnote{order:2}
}

.jcont{background:var(--spine);padding:clamp(72px,10vw,140px) var(--gut)}
.jcont .eyerow span{color:#A8A188}
.jcont .eyerow{margin-bottom:clamp(24px,3vw,40px)}
.jcont .jclead{color:var(--cream);font-size:clamp(28px,3.8vw,58px)}
.jcont .jclead .it{color:#C9A664}
.jcont .jcta{color:#C9A664}
/* hovers */
a.pfl, a.herocta, .jindex a, .proglink, .archrub .pt a{transition:color .3s ease}
a.pfl:hover, a.herocta:hover{color:var(--ink)}
.jcont .jcta:hover{color:var(--cream)}
.proglink:hover b{color:var(--olive)}
.prow{transition:background .3s ease}
/* ---------- INTRODUCTION ---------- */
.intro-sec .h2{margin-bottom:clamp(24px,3vw,42px)}
.intro-body{max-width:64ch}
.intro-sec .lead{max-width:60ch;margin:0 0 clamp(16px,2vw,24px);color:#3b372e}
.intro-sec .lead.l1{font-size:clamp(21px,2.9vw,30px);color:var(--ink)}
.intro-sec .dcta{
  display:inline-block;
  margin-top:clamp(12px,1.8vw,20px);
  font-family:var(--mono);
  font-size:clamp(9px,1vw,11px);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--bronze);
  transition:color .3s ease;
}
.intro-sec .dcta:hover{color:var(--ink)}

@media (min-width:1000px){
  .hero{grid-template-areas:"eye photo" "wm photo" "stat photo" "q photo" "cta photo" "foot photo"}
  .herostat{grid-area:stat;align-self:end}
  .herocta{grid-area:cta;justify-self:start;align-self:start}
}

/* display headings spacing */
#biografia .head{margin-bottom:clamp(16px,1.8vw,26px)}
#libro .prog-col .h2{margin-bottom:clamp(30px,3.6vw,54px)}
/* Testimonials - end credits */
.credits{position:relative;padding:0;background:var(--spine)}
.credvp{position:sticky;top:0;height:100vh;height:100lvh;overflow:hidden}
.credeye{position:absolute;top:clamp(20px,3vh,34px);left:var(--gut);z-index:2}
.credits .eyerow span{color:var(--cream)}
.credits .eyerow span:first-child{color:#BFB9A4}
.credroll{position:absolute;left:0;right:0;top:0;padding:0 var(--gut);text-align:center;will-change:transform}
.cred{margin:0 auto clamp(72px,17vh,170px);max-width:60ch}
.cred:first-child{margin-top:0}
.cwho{
  font-family:var(--mono);
  font-size:clamp(9.5px,.9vw,11.5px);
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#BFB9A4;
  line-height:1.7;
}
.cq{
  margin:clamp(14px,2.2vh,26px) auto 0;
  font-family:var(--serif);
  font-size:clamp(23px,2.9vw,42px);
  line-height:1.18;
  letter-spacing:-.015em;
  color:var(--cream);
  max-width:26ch;
}
.credits.credits--static{padding:clamp(64px,10vw,120px) 0}
.credits.credits--static .credvp{position:static;height:auto;overflow:visible}
.credits.credits--static .credeye{position:static;margin:0 0 clamp(40px,6vh,70px) var(--gut)}
.credits.credits--static .credroll{position:static;transform:none!important}
.bio-grid .bp:first-of-type::first-letter{
  font-family:var(--serif);
  font-weight:400;
  font-size:3.1em;
  line-height:.78;
  float:left;
  padding:.08em .14em 0 0;
  color:var(--olive);
}

/* closing statement */
.jcont{padding-bottom:clamp(20px,2.6vw,40px)}
.jcont+.footer{border-top:0;padding-top:clamp(40px,5.5vw,84px)}

/* closing statement cascade */
@media (min-width:901px){
  .jcont .jclead{font-size:clamp(34px,4.4vw,66px);line-height:1.08;max-width:none;white-space:nowrap}
  .jclead .l2b{margin-left:22vw}
  .jclead .l2c{margin-left:0;text-align:right}
  .jcont .jcta{display:table;margin-left:auto;margin-top:clamp(22px,2.6vw,38px)}
  .jcont .eyerow{margin-bottom:clamp(34px,4vw,56px)}
}

/* max width 1560px */
.numbers2, .credits, .jcont{margin-inline:min(0px, calc((1560px - 100vw) / 2))}
.numbers2, .credits, .jcont{padding-inline:calc(var(--gut) + max(0px, (100vw - 1560px) / 2))}

/* work with me */
.work{padding:clamp(56px,8vw,110px) var(--gut) clamp(64px,9vw,130px)}
.work-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(14px,2vw,28px);align-items:start}
.work-col{grid-column:1/span 5}
.work-col .h2{margin-bottom:clamp(30px,3.6vw,54px)}
.work-list{grid-column:6/span 7;margin-top:clamp(8px,1vw,14px)}
.work-list li{border-top:1px solid var(--line)}
.work-list li:last-child{border-bottom:1px solid var(--line)}
@media (max-width:760px){
  .work-col, .work-list{grid-column:1/-1}
  .work-list{margin-top:clamp(18px,3vw,28px)}
  .work-list li{grid-template-columns:auto 1fr;row-gap:8px}
  .work-list li em{grid-column:2;margin-top:0}
}