:root{--card-height:26vw;--card-margin:4vw;--card-top-offset:1em;--numcards:5;--outline-width:0px}@media (max-width:767px){:root{--card-height:-10vw;--card-margin:-10vw;--card-top-offset:1em;--numcards:5;--outline-width:0px;--card-gap:0}}@media (max-width:1024px){:root{--card-height:35vw;--card-margin:-10vw;--card-top-offset:1em;--numcards:5;--outline-width:0px;--card-gap:0}}.body{color:#fff;text-align:center;padding-bottom:4rem;padding-top:4rem}header,main{width:100%;margin:0 auto}#cards{list-style:none;display:grid;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)}#card-1{--index:1}#card-2{--index:2}#card-3{--index:3}#card-4{--index:4}#card-5{--index:5}#card-6{--index:6}.card{position:sticky;top:6rem;padding-top:calc(var(--index) * var(--card-top-offset))}.card-content{box-shadow:0 .2em 1em rgba(0,0,0,.1),0 1em 2em rgba(0,0,0,.1);background:#fff;color:#131212;border-radius:2rem;overflow:hidden;display:grid;grid-template-areas:"text img";grid-template-columns:1fr 1fr;grid-template-rows:auto;align-items:stretch;padding:1.4em}#cards .card:nth-child(2n) .card-content{grid-template-areas:"img text"}#cards .card:nth-child(odd) .card-content{grid-template-areas:"text img"}.card-content>div{grid-area:text;width:95%;max-width:800px;place-self:center;text-align:left;display:grid;gap:1em;place-items:start}.card-content>figure{grid-area:img;overflow:hidden}.card-content>figure>img{width:80%;height:100%;object-fit:cover;border-radius:.4em}h1{font-weight:300;font-size:3rem;margin-bottom:1rem}h2{font-weight:700;font-size:2.5rem;margin:0}p{font-weight:300;line-height:1.42;font-size:1.1rem}@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:8s}.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:767px){#cards{gap:var(--card-margin)}#cards,.card-content{display:flex;flex-direction:column}.card-content>div,.card-content>figure{width:100%}@media (max-width:767px){#cards{gap:var(--card-margin)}#cards,.card-content{display:flex;flex-direction:column}.card-content{align-items:center}.card-content>div,.card-content>figure{width:100%}.card-content>figure{display:flex;justify-content:center}.card-content>figure>img{width:100%;height:auto}}.card-content>figure>img{width:100%;height:auto}}@media (min-width:768px){#cards .card:nth-child(2n) .card-content{flex-direction:row-reverse!important}}