:root{--card-height:40vw;--card-margin:4vw;--numcards:4;--outline-width:0px}main{width:80vw;margin:0 auto}#cards{grid-template-columns:1fr;grid-template-rows:repeat(var(--numcards), var(--card-height));gap:var(--card-margin);padding-bottom:calc(var(--numcards) * var(--card-top-offset));margin-bottom:var(--card-margin);list-style:none;display:grid}#card-1{--index:1;--card-top-offset:120px}#card-2{--index:2;--card-top-offset:140px}#card-3{--index:3;--card-top-offset:160px}#card-4{--index:4;--card-top-offset:180px}.card{padding-top:var(--card-top-offset);position:sticky;top:0}.card-content{color:#131212;background:#fff;border-radius:2rem;grid-template-columns:1fr 1fr;grid-template-areas:"text img";align-items:stretch;min-height:600px;padding:1.4em;display:grid;overflow:hidden;box-shadow:0 .2em 1em #0000001a,0 1em 2em #0000001a}.card-content>div{text-align:left;grid-area:text;place-self:center;place-items:start;gap:1em;width:95%;max-width:800px;display:grid}.card-content>figure{grid-area:img;overflow:hidden}.card-content>figure>img{object-fit:cover;border-radius:.4em;width:100%;height:100%}h1{margin-bottom:1rem;font-family:Cormorant Garamond,serif;font-size:3rem;font-weight:300}h2{margin:0;font-family:Cormorant Garamond,serif;font-size:2.5rem;font-weight:700}p{font-size:1.1rem;font-weight:300;line-height:1.42}@media (min-width:769px){@supports (animation-timeline:works){@scroll-timeline cards-element-scrolls-in-body{source: selector(body); scroll-offsets: selector(#cards) start 1, selector(#cards) start 0; start: selector(#cards) start 1; end: selector(#cards) start 0; time-range: 4s;}.card{--index0:calc(var(--index) - 1);--reverse-index:calc(var(--numcards) - var(--index0));--reverse-index0:calc(var(--reverse-index) - 1)}.card__content{transform-origin:50% 0;will-change:transform;--duration:calc(var(--reverse-index0) * 1s);--delay:calc(var(--index0) * 1s);animation:var(--duration) linear scale var(--delay) forwards;animation-timeline:cards-element-scrolls-in-body}@keyframes scale{to{transform:scale(calc(1.1 - calc(.1 * var(--reverse-index))))}}}}@media (max-width:768px){:root{--card-height:auto;--card-margin:1.5rem}#cards{grid-template-rows:auto;padding-bottom:0}.card{padding-top:0;position:static}#card-1{padding-top:30px}.card-content{text-align:center;grid-template-columns:1fr;grid-template-areas:"text""img";min-height:auto;padding:1rem}.card-content>div{text-align:center;place-items:center;width:100%}.card-content>figure{border-radius:1em;margin-top:30px;overflow:hidden}.card-content>figure>img{object-fit:cover;width:100%;height:100%}.card__content{animation:none!important;transform:none!important}h1{font-size:2rem}h2{font-size:1.5rem}p{font-size:1rem}}