.speakers>header{--text-color:#000;margin:0 auto 3.75rem;text-align:center}.speakers>header,.speakers>header *{color:var(--text-color)}.speakers>header.text-color--white{--text-color:#fff}.speakers>header.text-align--left{margin-inline:unset;text-align:left}.speakers>div.grid{display:grid;gap:30px;grid-auto-flow:dense;grid-template-columns:repeat(var(--grid-cols,1),minmax(0,400px));justify-content:center;margin-inline:auto;max-width:1280px}.speakers>div.grid article{aspect-ratio:1/1;border-radius:20px;box-shadow:0 10px 20px 0 #28007440;overflow:hidden;position:relative;width:100%}.speakers>div.grid article>a.card-link{display:block;inset:0;position:absolute;z-index:4}.speakers>div.grid article:before{background:linear-gradient(180deg,rgba(245,242,254,0) 34.74%,rgba(0,0,0,.5));content:"";inset:0;position:absolute;z-index:3}.speakers>div.grid article:after{background-color:rgba(103,23,255,.8);content:"";inset:0;opacity:0;position:absolute;transition:opacity .4s ease;z-index:2}.speakers>div.grid article header{bottom:20px;left:30px;position:absolute;z-index:3}.speakers>div.grid article header *{opacity:1;transition:opacity .4s ease,visibility .4s ease;visibility:visible}.speakers>div.grid article p.description{color:#fff;left:30px;opacity:0;position:absolute;right:30px;top:50%;transform:translateY(-50%);transition:opacity .4s ease,visiblity .4s ease;visibility:hidden;z-index:3}.speakers>div.grid article header :not(.text--tag){color:#fff;margin:0}.speakers>div.grid article header .text--tag{margin:10px 0 0}.speakers>div.grid article figure img{height:100%;inset:0;object-fit:cover;position:absolute;width:100%}.speakers>div.grid article figure.filter--black img{filter:grayscale(1)}.speakers>div.grid article:not(.no-description):hover p.description{opacity:1;visibility:visible}.speakers>div.grid article:not(.no-description):hover header *{opacity:0;visibility:hidden}.speakers>div.grid article:not(.no-description):hover:after{opacity:1}@media (min-width:768px){.speakers>div.grid{--grid-cols:2;gap:64px 30px}.speakers>div.grid[data-grid-length="1"]{--grid-cols:1}}@media (min-width:1080px){.speakers>div.grid{--grid-cols:3}.speakers>div.grid[data-grid-length="2"]{--grid-cols:2}}