.collection-hero-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:65px;align-items:center}.collection-hero h1{font-size:clamp(37px,4.5vw,59px);line-height:1.15;letter-spacing:-2px;margin-bottom:22px;color:#fff}.collection-hero p{color:#fff;font-size:17px;line-height:1.85;max-width:700px}.collection-hero .button{margin-top:25px}.collection-hero-art{border:2px solid #f7d681;border-radius:22px;overflow:hidden;background:#ffffff18;max-width:320px;justify-self:end;width:100%;box-shadow:0 15px 40px #25153e2b}.collection-hero-art>img{width:100%;aspect-ratio:1.2;object-fit:cover}.collection-hero-art>.topic-art{width:100%;aspect-ratio:1;border:0;border-radius:0}.collection-hero-art>.slot-icon{width:100%;height:230px;display:flex;align-items:center;justify-content:center}.collection-hero-art>.slot-icon img{width:160px;height:160px;object-fit:contain}.collection-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.collection-tile{background:#fff;border:1px solid #e1d6ef;box-shadow:0 8px 24px #3221480a;display:flex;align-items:center;gap:16px;padding:18px;border-radius:18px;color:#181d3e}.collection-tile:hover{border-color:#b93ea8;box-shadow:0 12px 28px #8f3cb51a}.collection-tile>span:nth-child(2){min-width:0;flex:1}.collection-tile strong{font-size:16px;line-height:1.4;display:block}.collection-tile small{display:block;color:#4f4b62;font-size:12px;margin-top:6px}.collection-tile-art{width:72px;flex:0 0 72px;border-radius:12px;overflow:hidden;display:grid;place-items:center}.collection-tile-art>img{width:100%;height:64px;object-fit:contain}.collection-tile-art>.topic-art{width:72px;height:72px}.collection-tile-art .slot-icon{width:64px;height:64px}.collection-tile>.icon{width:18px;color:#963a9d}.collection-tile.casinos .collection-tile-art{background:#19234a;padding:8px;width:105px;flex-basis:105px}.collection-tile.types .collection-tile-art{width:100px;flex-basis:100px}.collection-tile.types img{height:85px;object-fit:cover}.collection-filters{grid-template-columns:2fr 1fr}.collection-crosslinks{display:flex;flex-wrap:wrap;gap:18px 30px;padding-block:30px}.collection-crosslinks a{display:flex;gap:12px;align-items:center;font-size:14px;font-weight:800;color:#67318a}.collection-crosslinks .icon{width:18px}
@media(max-width:900px){.collection-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-hero-layout{gap:30px}}
.collection-hero-art>.slot-icon{width:150px;height:150px;margin:30px auto;display:block}
@media(max-width:600px){.collection-hero-layout{grid-template-columns:1fr;gap:24px}.collection-hero h1{font-size:36px;letter-spacing:-1.3px}.collection-hero p{font-size:15px}.collection-hero-art{max-width:210px;justify-self:center}.collection-hero-art>img{aspect-ratio:1.8}.collection-hero-art>.topic-art{aspect-ratio:1.8}.collection-hero-art>.slot-icon{height:120px}.collection-hero-art>.slot-icon img{width:105px;height:105px}.collection-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.collection-tile{display:block;padding:15px 12px;border-radius:14px}.collection-tile-art{width:64px;height:64px;margin-bottom:12px}.collection-tile-art>.topic-art{width:64px;height:64px}.collection-tile strong{font-size:13px;line-height:1.5}.collection-tile small{font-size:10px}.collection-tile>.icon{display:none}.collection-tile.casinos .collection-tile-art{width:100%;height:64px}.collection-tile.types .collection-tile-art{width:100%;height:85px}.collection-filters{grid-template-columns:1fr}.collection-filters .filter-field{grid-column:1/-1}.collection-crosslinks{gap:15px;font-size:12px}.collection-crosslinks a{font-size:12px}}

.collection-hero-art.brand-art{background:#19234a;padding:28px}.collection-hero-art.brand-art>img{object-fit:contain;aspect-ratio:2.4}

.collection-tile-art .producer-logo-dark{background:#202456;padding:12px;border-radius:10px;box-sizing:border-box}
/* Each bonus category uses a distinct original symbol. */
.collection-tile.bonuses{background:linear-gradient(135deg,#f1f5ff,#fff1fc);border-color:#dec9ed}
.collection-tile.bonuses:nth-child(2n){background:linear-gradient(135deg,#fff7e3,#f8ebff)}
.collection-tile.bonuses .collection-tile-art{overflow:visible;filter:drop-shadow(0 5px 9px #8f44b336)}
.collection-hero h1 em{font-style:normal;color:#ffe347}
.collection-hero .button{margin-top:22px}

/* Compact collection headers end just below their action; approved theme and producer headers retain their layout. */
.directory-hero.directory-hero--compact{min-height:0;padding-bottom:24px}
.directory-hero--compact .collection-hero-layout{padding-block:0}
.directory-hero--compact .collection-hero-layout>div{display:flow-root}
.directory-hero--compact .collection-hero-layout>div>.button{margin-bottom:0}
.directory-hero .casino-brand.logo-navy{background:#19234a;border:1px solid #7a85b9}
.directory-hero .casino-brand.logo-cream,.collection-tile.casinos .collection-tile-art.logo-cream{background:#fff8e9;border:1px solid #f6db96}
.directory-hero .casino-brand{padding:14px 22px;max-width:100%}
.directory-hero .casino-brand img{width:182px;height:47px;object-fit:contain}
.collection-tile.bonuses .bonus-symbol{width:76px;height:76px;object-fit:contain;display:block}
.producer-story .review-heading>.section-symbol{display:block;width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 0 9px #fff4b64d)}
@media(max-width:700px){
 .directory-hero.directory-hero--compact{min-height:0;padding-bottom:20px}
 .directory-hero .casino-brand{padding:11px 18px}
 .directory-hero .casino-brand img{width:155px;height:40px}
 .producer-story .review-heading>.section-symbol{width:45px;height:45px}
 .collection-tile.bonuses .bonus-symbol{width:64px;height:64px}
}

/* Book of Ra: original scenery and the unchanged official explorer occupy separate layers. */
.directory-hero.book-family-hero{padding-top:22px;padding-bottom:24px;overflow:hidden;background:#172c79}
.book-family-hero:before{background:linear-gradient(90deg,#102969bf 0%,#142a6f80 40%,#27276208 72%)}
.book-family-hero .game-breadcrumb{margin-bottom:18px}
.book-family-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:30px;min-height:390px}
.book-family-copy{min-width:0;align-self:end;padding-top:24px;position:relative;z-index:1}
.book-family-hero h1{font-size:clamp(52px,5.6vw,78px);line-height:1.04;letter-spacing:-2.4px;margin:0 0 23px;color:#fff;font-weight:800}
.book-family-hero h1 em{display:block;color:#ffe13e;-webkit-text-stroke:.35px #fff9;text-shadow:0 1px #fff8,0 3px 18px #78460a66}
.book-family-hero .book-family-copy p{font-size:18px;line-height:1.7;max-width:400px;color:#fff;text-shadow:0 1px 6px #081e52}
.book-family-hero .button{margin-top:28px;margin-bottom:0;min-height:58px;padding:15px 25px;border-radius:13px;background:linear-gradient(110deg,#ed20a5,#b725dc);color:#fff;box-shadow:0 8px 26px #bc20ce38}
.book-family-hero .button:hover{background:linear-gradient(110deg,#f635b4,#cb37e7)}
.book-family-character{position:relative;min-width:0;overflow:visible;pointer-events:none;align-self:stretch;margin-bottom:-24px}
.book-family-character img{position:absolute;top:7px;right:calc((1280px - 100vw)/2 - 72px);left:auto;width:620px;max-width:none;height:auto;transform:none}
@media(min-width:1050px) and (max-width:1368px){.book-family-character img{right:-116px}}
@media(max-width:1049px){
 .book-family-character img{width:570px;right:-100px}
 .book-family-layout{min-height:335px;gap:20px}
 .book-family-hero h1{font-size:clamp(44px,6.2vw,64px)}
 .book-family-hero .book-family-copy p{font-size:16px}
}
@media(max-width:700px){
 .directory-hero.book-family-hero{padding-top:16px;padding-bottom:20px}
 .book-family-hero:before{background:linear-gradient(90deg,#122d78bd 0%,#142c7270 51%,#29286308 80%)}
 .book-family-hero .game-breadcrumb{font-size:11px;margin-bottom:22px}
 .book-family-layout{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:10px;min-height:0}
 .book-family-copy{padding-top:0;align-self:start}
 .book-family-hero h1{font-size:clamp(33px,10vw,54px);line-height:1.08;letter-spacing:-1.35px;margin:0 0 19px}
 .book-family-hero .book-family-copy p{max-width:180px;font-size:15px;line-height:1.7}
 .book-family-hero .button{width:100%;max-width:235px;min-height:51px;padding:13px 10px;margin-top:23px;gap:9px;font-size:13px;border-radius:12px}
 .book-family-hero .button .icon{width:18px;height:18px}
 .book-family-character{margin-bottom:-20px}
 .book-family-character img{width:clamp(320px,68vw,460px);top:5px;right:clamp(-94px,-15vw,-58px)}
}
