/* Square image tiles, measured against EmiratesBet's Pragmatic grid. */
#cards{grid-template-columns:repeat(7,minmax(0,1fr));gap:20px 14px}
.card{display:block;min-height:0;padding:0;border:0;border-radius:12px;background:transparent;overflow:visible;isolation:auto;transition:transform .18s}
.card:after,.card .arrow,.card .logo{display:none}
.cover-frame{position:relative;width:100%;aspect-ratio:1;overflow:hidden;border-radius:12px;background:#18233a;box-shadow:0 3px 12px #0004}
.card .cover{position:static;display:block;width:100%;height:100%;object-fit:cover;z-index:auto;transition:transform .3s}
.card h3{font:600 13px/1.3 Arial;color:#edf0f8;letter-spacing:0;margin:9px 2px 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card small{display:block;font:9px/1.3 Arial;letter-spacing:.08em;color:#8390aa;margin:0 2px}
.card:hover{transform:translateY(-3px)}.card:hover .cover{transform:scale(1.035)}
.play-hover{position:absolute;inset:0;display:grid;place-items:center;font-size:27px;background:#07102255;opacity:0;transition:opacity .2s;color:white;text-shadow:0 2px 8px #000}
.card:hover .play-hover,.card:focus-visible .play-hover{opacity:1}.card:focus-visible{outline:2px solid #e8d096;outline-offset:5px}
.cover-error .cover-frame{outline:1px solid #e7ac76}.hero{min-height:320px;padding:35px 50px}.hero h1{font-size:clamp(32px,4vw,55px)}
@media(max-width:1250px){#cards{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:950px){#cards{grid-template-columns:repeat(5,minmax(0,1fr));gap:17px 12px}}
@media(max-width:700px){#cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 10px}.card{min-height:0;padding:0}.cover-frame{border-radius:10px}.card h3{font-size:11px;margin-top:7px}.card small{font-size:7px}.hero{min-height:0;padding:25px;flex-direction:row;text-align:left;gap:12px}.hero img{width:35%}.hero h1{font-size:25px}.hero p:not(.eyebrow){display:none}.hero .play{font-size:8px;padding:9px 12px}.hero .eyebrow{font-size:8px}.section-title{padding-top:17px}.section-title h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){.card,.card .cover,.play-hover{transition:none}.card:hover,.card:hover .cover{transform:none}}