:root{--bg:#0f0f0f;--fg:#fff;--card-1:#b2b2b2;--card-2:#ce2017;--card-3:#2f2f2f}img{width:100%;height:100%;object-fit:cover}h1{font-size:4rem;font-weight:500;line-height:1}p{font-size:2rem;font-weight:500;line-height:1}section{position:relative;width:100%;height:100svh;padding:2rem;background-color:var(--bg);color:var(--fg)}.intro,.outro{text-align:center;align-content:center}.intro h1,.outro h1{width:30%;margin:0 auto}.sticky{display:flex;justify-content:center;align-items:center}.sticky-header{position:absolute;top:20%;left:50%;transform:translate(-50%,-50%)}.sticky-header h1{position:relative;text-align:center;will-change:transform,opacity;transform:translateY(40px);opacity:0}.card-container{position:relative;width:75%;display:flex;perspective:1000px;transform:translateY(40px);will-change:width}.card{position:relative;flex:1;aspect-ratio:5/7;transform-style:preserve-3d;transform-origin:top}#card-1{border-radius:20px 0 0 20px}#card-3{border-radius:0 20px 20px 0}.card-back,.card-front{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:inherit;overflow:hidden}.card-back{display:flex;justify-content:center;align-items:center;text-align:center;transform:rotateY(180deg);padding:2rem}.card-back span{position:absolute;top:2rem;left:2rem;opacity:.4}#card-1 .card-back{background-color:var(--card-1);color:var(--bg)}#card-2 .card-back{background-color:var(--card-2)}#card-3 .card-back{background-color:var(--card-3)}