ul{list-style:none}.main{padding:5em 1.5em}.cards{position:relative;z-index:9999}.cards__inner{display:grid;grid-template-areas:"card1 card2 card2 card3" "card1 card4 card4 card5" "card6 card6 card7 card5";grid-gap:2.5em;margin:0 auto;max-width:75rem}.card{--flow-space:0.5em;--hsl:var(--hue),var(--saturation),var(--lightness);flex:1 1 14rem;padding:3rem 1rem;display:grid;grid-template-rows:auto auto auto auto 1fr;align-items:start;gap:1rem;color:#eceff1;background-color:#2b2b2b;background-color:transparent;border:1px solid;border-radius:15px;border-color:hsla(var(--hsl),1)}.card:first-child{grid-area:card1;background:url(https://i.ibb.co/MkLfV9B9/magazine.jpg);background-size:cover;background-position:50%}.card:first-child,.card:nth-child(2){--hue:291.34;--saturation:95.9%;--lightness:61.76%;filter:brightness(.6);box-shadow:0 4px 6px rgba(0,0,0,.1)}.card:nth-child(2){grid-area:card2;background:url(https://i.ibb.co/RkbX2s1M/michi.jpg);background-size:cover;background-position:50%}.card:nth-child(3){grid-area:card3;background:url(https://i.ibb.co/MfWZtph/DLCA-capture.png);background-size:cover;background-position:50%}.card:nth-child(3),.card:nth-child(4){--hue:291.34;--saturation:95.9%;--lightness:61.76%;filter:brightness(.6);box-shadow:0 4px 6px rgba(0,0,0,.1)}.card:nth-child(4){grid-area:card4;background:url(https://i.ibb.co/qFCryGB6/dun.jpg);background-size:cover;background-position:50%}.card:nth-child(5){grid-area:card5;background:url(https://i.ibb.co/3ygSG7h3/alpacapower.jpg);background-size:cover;background-position:50%}.card:nth-child(5),.card:nth-child(6){--hue:291.34;--saturation:95.9%;--lightness:61.76%;filter:brightness(.6);box-shadow:0 4px 6px rgba(0,0,0,.1)}.card:nth-child(6){grid-area:card6;background:url(https://i.ibb.co/7xw3KKzn/imgen-connect.jpg);background-size:cover;background-position:50%}.card:nth-child(7){grid-area:card7;--hue:291.34;--saturation:95.9%;--lightness:61.76%;background:url(https://i.ibb.co/1GPQK2yp/rapid.jpg);background-size:cover;background-position:50%;filter:brightness(.6);box-shadow:0 4px 6px rgba(0,0,0,.1)}.card__bullets{line-height:1.4}.card__bullets li:before{display:inline-block;content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' viewBox='0 0 512 512' width='16' title='check' fill='%23dddddd'%3E%3Cpath d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z' /%3E%3C/svg%3E");transform:translatey(.25ch);margin-right:1ch}.card__heading{font-size:1.05em;font-weight:600}.card__price{font-size:1.75em;font-weight:700}.flow>*+*{margin-top:var(--flow-space,1.25em)}.overlay{position:absolute;inset:0;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--opacity,0);-webkit-mask:radial-gradient(25rem 25rem at var(--x) var(--y),#000 1%,transparent 50%);mask:radial-gradient(25rem 25rem at var(--x) var(--y),#000 1%,transparent 50%);transition:-webkit-mask .4s ease;transition:mask .4s ease;transition:mask .4s ease,-webkit-mask .4s ease;will-change:mask}.overlay .card{background-color:hsla(var(--hsl),.15);border-color:hsla(var(--hsl),1);box-shadow:0 0 0 1px inset hsl(var(--hsl))}.overlay .cta{display:block;grid-row:-1;width:100%;background-color:hsl(var(--hsl));box-shadow:0 0 0 1px hsl(var(--hsl))}:not(.overlay)>.card{transition:background .4s ease;will-change:background}:not(.overlay)>.card:hover{--lightness:95%;background:hsla(var(--hsl),.1)}@media screen and (max-width:600px){.cards__inner{display:grid;grid-template-areas:"card1 card3" "card2 card4" "card1 card2" "card4 card7" "card7 card5" "card6 card5";grid-gap:.6rem}}.card__content{position:absolute;bottom:1rem;left:1rem;right:1rem;text-align:center;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.card__description{position:relative;top:4px;bottom:.1rem;left:0;right:0;text-align:center}.tech-icons{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;position:absolute;margin-top:auto}.icon-container{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#eceff1;transition:transform .2s ease,background-color .2s ease;box-shadow:0 4px 6px rgba(0,0,0,.1)}.icon-container:hover{transform:scale(1.1);background-color:#d1d5db}.card:hover .card__content{opacity:1;visibility:visible}.circles{top:0;left:0;height:100%;overflow:hidden;pointer-events:none}.circles,.circles:before{position:absolute;width:100%}.circles:before{bottom:0;height:250px;content:"";z-index:2;background:linear-gradient(180deg,rgba(237,208,232,0),#524e4e)}.dark .circles:before{background:linear-gradient(180deg,rgba(255,255,255,0),#0D0D0D)}.circles li{position:absolute;display:block;list-style:none;width:20px;height:20px;background:#e9b5d2;background-image:linear-gradient(225deg,#ff3cac,#784ba0 50%,#2b86c5);animation:animate 25s linear infinite;bottom:-150px;pointer-events:none}.dark .circles li{background:#ff3cac;background-image:linear-gradient(225deg,#ff3cac,#784ba0 50%,#2b86c5)}.circles li:first-child{left:25%;width:80px;height:80px;animation-delay:0s}.circles li:nth-child(2){left:10%;width:20px;height:20px;animation-delay:2s;animation-duration:12s}.circles li:nth-child(3){left:70%;width:20px;height:20px;animation-delay:4s}.circles li:nth-child(4){left:40%;width:60px;height:60px;animation-delay:0s;animation-duration:18s}.circles li:nth-child(5){left:65%;width:20px;height:20px;animation-delay:0s}.circles li:nth-child(6){left:75%;width:56px;height:56px;animation-delay:3s}.circles li:nth-child(7){left:35%;width:42px;height:42px;animation-delay:7s}.circles li:nth-child(8){left:50%;width:25px;height:25px;animation-delay:15s;animation-duration:45s}.circles li:nth-child(9){left:20%;width:15px;height:15px;animation-delay:2s;animation-duration:35s}.circles li:nth-child(10){left:85%;width:56px;height:56px;animation-delay:0s;animation-duration:11s}@keyframes animate{0%{transform:translateY(0) rotate(0deg);opacity:1;border-radius:0}to{transform:translateY(-1000px) rotate(2turn);opacity:0;border-radius:50%}}