section.numbered-cards>.inset{display:flex;flex-wrap:wrap;gap:var(--standard-size)}section.numbered-cards>.inset>.side{opacity:0}@media(max-width: 900px){section.numbered-cards>.inset>.side{flex:1 1 440px}}@media(min-width: 901px){section.numbered-cards>.inset>.side:first-of-type{flex:1 1 400px}section.numbered-cards>.inset>.side:last-of-type{flex:1 1 200px}}section.numbered-cards>.inset>.side.lined{padding-left:var(--slim-size);position:relative}section.numbered-cards>.inset>.side.lined:before{content:"";display:block;width:1px;height:100%;max-height:0;background:#939393;position:absolute;top:0;left:0}section.numbered-cards>.inset>.side:first-of-type{transform:translate(-30px, 0)}section.numbered-cards>.inset>.side:last-of-type{transform:translate(30px, 0)}section.numbered-cards>.inset>.side>.insert{display:grid;gap:20px;margin-top:var(--standard-size)}section.numbered-cards>.inset>.side>.insert>.numbered-card{display:block;width:100%;position:relative;padding:var(--slim-size);background:#000;transform:translate(0, 30px);opacity:0}section.numbered-cards>.inset>.side>.insert>.numbered-card:before{content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;background:rgba(0,0,0,.75)}section.numbered-cards>.inset>.side>.insert>.numbered-card>.inset{position:relative;z-index:3;color:#fff}section.numbered-cards>.inset>.side>.insert>.numbered-card>.inset>.number{display:block;width:2rem;height:2rem;border:2px solid #fff;border-radius:100%;position:relative;margin:0 auto 1rem}section.numbered-cards>.inset>.side>.insert>.numbered-card>.inset>.number>span{font-size:.8rem;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}section.numbered-cards>.inset>.side>.insert>.numbered-card.in-view{transition:opacity .5s ease-in,transform .5s ease-in;transform:translate(0, 0);opacity:1}section.numbered-cards.in-view>.inset>.side{transition:opacity .5s ease-in,transform .5s ease-in;transform:translate(0, 0);opacity:1}section.numbered-cards.in-view>.inset>.side.lined:before{transition:max-height 2s ease-in-out;max-height:100%}
/*# sourceMappingURL=numbered-cards.css.map */