section.u5m-cards-side{margin:var(--section-margin-none);padding:var(--section-padding-medium);&.dark-mode{background:var(--black);color:var(--white);.card{.content .title span{color:var(--orange-2)}a.btn-inline-black{color:var(--black);&:focus,&:hover{color:var(--orange-3)}}}}.intro-content{&.left-aligned{align-items:flex-start;flex-direction:column;gap:0;justify-content:flex-start;.button-group{margin-top:30px}}}.outer-wrap{align-items:center;display:flex;gap:50px;margin:0 auto;max-width:var(--center);padding:0 20px;@media (max-width:768px){align-items:stretch;flex-direction:column;gap:40px}.left{flex:0 1 320px;min-width:0}.right{flex:1;min-width:0;.wrapper{align-items:stretch;display:flex;flex-wrap:wrap;gap:20px;justify-content:flex-start;.card{box-sizing:border-box}&:not(.landscape) .card:has(.media.icon-gradient),&:not(.landscape) .card:has(.media.icon:not(.icon-gradient)){flex:1 1 260px;max-width:280px}&:not(.landscape) .card:has(.media.image){flex:1 1 280px;min-width:0}&:not(.landscape) .card:not(:has(.media)){flex:1 1 260px;max-width:280px}&.two:not(.landscape) .card:has(.media.image){flex:1 1 calc(50% - 10px)}&.three:not(.landscape) .card:has(.media.image){flex:1 1 calc(33.333% - 14px)}&.four:not(.landscape) .card:has(.media.image){flex:1 1 calc(25% - 15px)}&.two:not(.landscape) .card:has(.media.icon-gradient),&.two:not(.landscape) .card:has(.media.icon:not(.icon-gradient)){flex:1 1 calc(50% - 10px);max-width:280px}&.landscape{flex-direction:column;.card{flex:1 0 100%;flex-direction:row;gap:20px;max-width:none;.media.image{aspect-ratio:unset;border-bottom-left-radius:inherit;border-bottom-right-radius:unset;border-top-right-radius:unset;min-height:160px;width:40%}}}.card.filled:has(.media.icon-gradient){.media.icon-gradient{align-items:center;border:1px solid var(--light-gray);border-radius:9px;box-sizing:border-box;display:flex;justify-content:center;left:41px;min-height:93px;padding:0;top:-36px;width:72px;svg{height:50px;width:50px}}}@media (max-width:1024px){&.four:not(.landscape) .card:has(.media.image),&.three:not(.landscape) .card:has(.media.image){flex:1 1 calc(50% - 10px)}&.four:not(.landscape) .card:has(.media.icon-gradient),&.four:not(.landscape) .card:has(.media.icon:not(.icon-gradient)),&.three:not(.landscape) .card:has(.media.icon-gradient),&.three:not(.landscape) .card:has(.media.icon:not(.icon-gradient)){flex:1 1 calc(50% - 10px);max-width:none}}@media (max-width:580px){flex-direction:column;.card{max-width:none;width:100%}&.landscape .card{flex-direction:column}}}}}}