.bonus-territory { --territory-deep: #083a50; --territory-ink: #173f4d; --territory-accent: #f4b73d; background: #f4f7f5; }
.bonus-territory__hero { position: relative; isolation: isolate; min-height: 620px; overflow: hidden; display: flex; align-items: center; color: #fff; background: var(--territory-deep); }
.bonus-territory__hero-art, .bonus-territory__hero-art img { position: absolute; height: 100%; }
.bonus-territory__hero-art { inset: 0 auto 0 50%; z-index: -2; width: 1860px; max-width: 1860px; transform: translateX(-50%); -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .2) 4%, rgba(0, 0, 0, .55) 9%, #000 18%, #000 82%, rgba(0, 0, 0, .55) 91%, rgba(0, 0, 0, .2) 96%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .2) 4%, rgba(0, 0, 0, .55) 9%, #000 18%, #000 82%, rgba(0, 0, 0, .55) 91%, rgba(0, 0, 0, .2) 96%, transparent 100%); }
.bonus-territory__hero-art img { inset: 0; width: 100%; object-fit: contain; object-position: center; }
.bonus-territory__hero-inner { position: relative; padding-top: 70px; padding-bottom: 70px; max-width: 1320px; width: 100%; }
.bonus-territory__hero-copy { width: min(100%, 650px); padding: clamp(28px, 3.5vw, 46px); border: 1px solid rgba(255, 255, 255, .28); border-radius: 18px; background: rgba(4, 43, 57, .65); -webkit-backdrop-filter: blur(5px) saturate(.9); backdrop-filter: blur(5px) saturate(.9); box-shadow: 0 18px 45px rgba(4, 29, 39, .25); }
.bonus-territory__breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; font-size: 13px; }
.bonus-territory__breadcrumbs a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.bonus-territory__world-name { color: var(--territory-accent); font-family: var(--heading-font, inherit); font-size: clamp(18px, 2vw, 26px); font-weight: 700; margin: 0 0 8px; }
.bonus-territory__hero h1 { color: #fff; font-size: clamp(38px, 5vw, 64px); line-height: .98; margin: 0; max-width: 610px; }
.bonus-territory__intro { font-size: 18px; line-height: 1.55; margin: 20px 0 28px; max-width: 570px; }
.bonus-territory__hero-cta { background: var(--territory-accent); color: #172e34; display: inline-flex; gap: 14px; align-items: center; font-weight: 800; padding: 14px 22px; text-decoration: none; }
.bonus-territory__compare, .bonus-territory__guide { margin-top: 58px; }
.bonus-territory__section-heading { max-width: 760px; margin-bottom: 22px; }
.bonus-territory__section-heading h2 { margin: 0; }
.bonus-territory__directory-heading { align-items: end; gap: 20px; }
.bonus-territory__directory-heading > div > p:last-child { margin: 8px 0 0; max-width: 680px; }
.bonus-territory__filter-form { grid-template-columns: minmax(210px, 1.3fr) repeat(4, minmax(0, 1fr)) minmax(175px, .85fr); }
.bonus-territory__field input[type="search"] { width: 100%; min-height: 44px; margin: 0; padding: 8px 12px; border: 1px solid rgba(7, 42, 53, .22); border-radius: 8px; color: var(--archive-ink); background: #fff; font: 650 14px/1.2 "Work Sans", sans-serif; }
.bonus-territory__field input[type="search"]::placeholder { color: #78847e; opacity: 1; }
.bonus-territory__controls[aria-busy="true"] { opacity: .72; }
.bonus-territory__field-guide { margin-top: 58px; }
.bonus-territory__field-guide + .bonus-territory__compare { margin-top: 38px; }
.bonus-territory__compare { padding: clamp(38px, 5vw, 72px) clamp(28px, 6vw, 86px); border: 1px solid var(--archive-line); border-radius: 14px; background: #fff; box-shadow: 0 4px 18px rgba(7, 42, 53, .07); }
.bonus-territory__compare .bonus-territory__section-heading { max-width: 900px; margin-bottom: 24px; }
.bonus-territory__compare .bonus-territory__section-heading > p:last-child { max-width: 760px; margin: 14px 0 0; color: #46584f; font-size: 17px; line-height: 1.65; }
.bonus-territory__compare .casino-comparison-table-wrap { margin-bottom: 0; }
.bonus-territory__compare .casino-comparison-table { margin: 0; }
.bonus-territory__guide { display: block; width: 100%; max-width: none; margin: 58px 0 0; padding: 0; overflow: hidden; border: 1px solid var(--archive-line); border-radius: 14px; background: #fff; box-shadow: 0 4px 18px rgba(7, 42, 53, .07); }
.bonus-territory__guide .casino-editorial-section { overflow: hidden; }
.bonus-territory__guide-section > * { position: relative; z-index: 1; }
.bonus-territory__guide-heading { display: grid; grid-template-columns: minmax(0, 1fr) clamp(230px, 25vw, 360px); align-items: center; gap: clamp(32px, 5vw, 76px); }
.bonus-territory__guide-heading .casino-editorial-heading__copy { width: auto; max-width: 820px; }
.bonus-territory__section-art { position: static; width: 100%; max-width: 360px; margin: 0; justify-self: end; pointer-events: none; user-select: none; }
.bonus-territory__section-art img { display: block; width: 100%; height: auto; object-fit: contain; }
.bonus-territory__guide-section--art-left .bonus-territory__guide-heading { grid-template-columns: clamp(230px, 25vw, 360px) minmax(0, 1fr); }
.bonus-territory__guide-section--art-left .casino-editorial-heading__copy { order: 2; justify-self: end; }
.bonus-territory__guide-section--art-left .bonus-territory__section-art { order: 1; justify-self: start; }
.bonus-territory__guide-section--types .bonus-territory__section-art { max-width: 285px; }
.bonus-territory__guide-section--basics { background: linear-gradient(130deg, #fff 0%, #f8fbfa 63%, #edf6f6 100%); }
.bonus-territory__guide-section--compare { background: #e8f3f4; }
.bonus-territory__guide-section--types { background: #fff; }
.bonus-territory__guide-section--terms { background: #f5f8f1; }
.bonus-territory__guide-section--fit { background: #fff8ea; }
.bonus-territory__guide-section--more { background: linear-gradient(112deg, #173d25, #28552d); }
.bonus-territory__guide-section--more::after { background: linear-gradient(90deg, rgba(244, 183, 61, 0), rgba(244, 183, 61, .55) 18%, rgba(244, 183, 61, .9) 50%, rgba(244, 183, 61, .55) 82%, rgba(244, 183, 61, 0)); }
.bonus-territory__guide-section--more h2, .bonus-territory__guide-section--more h3, .bonus-territory__guide-section--more p { color: #fff !important; }
.bonus-territory__guide-section--more .casino-archive__kicker { color: #f4c75a; }
.bonus-territory__claim-trail { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin: 42px 0 0; padding: 0; list-style: none; }
.bonus-territory__claim-trail::before { position: absolute; top: 48px; right: 8%; left: 8%; height: 4px; border-radius: 999px; background: linear-gradient(90deg, #6f943f, #e3b241 50%, #6f943f); content: ""; box-shadow: 0 1px 0 rgba(255, 255, 255, .8); }
.bonus-territory__claim-trail li { position: relative; z-index: 1; display: flex; min-width: 0; margin: 0; padding: 0; flex-direction: column; align-items: center; color: #46584f; font-size: 14px; line-height: 1.5; }
.bonus-territory__claim-icon { display: grid; width: 98px; height: 98px; padding: 7px; place-items: center; border: 1px solid rgba(8, 58, 80, .16); border-radius: 50%; background: rgba(255, 255, 255, .94); box-shadow: 0 8px 22px rgba(7, 42, 53, .13); }
.bonus-territory__claim-icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.bonus-territory__claim-copy { display: flex; width: 100%; min-height: 158px; margin-top: -5px; padding: 22px 16px 17px; flex-direction: column; gap: 8px; border: 1px solid rgba(8, 58, 80, .14); border-radius: 12px; background: rgba(255, 255, 255, .88); box-shadow: 0 5px 16px rgba(7, 42, 53, .05); }
.bonus-territory__claim-copy strong { align-self: center; margin-top: -2px; padding: 5px 11px; border-radius: 999px; color: #083a50; background: #f7d06a; font: 850 11px/1 "Archivo", sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.bonus-territory__claim-copy > span { display: block; }
.bonus-territory__guide-checklist { max-width: 1120px; }
.bonus-territory__definition-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 32px 0 0; }
.bonus-territory__definition-grid div { min-width: 0; padding: 24px; border: 1px solid rgba(8, 58, 80, .14); border-radius: 12px; background: #fbfdfb; box-shadow: 0 5px 16px rgba(7, 42, 53, .05); }
.bonus-territory__definition-grid dt { margin: 0 0 8px; color: var(--territory-ink); font: 800 18px/1.3 "Work Sans", sans-serif; }
.bonus-territory__definition-grid dd { margin: 0; color: #46584f; font-size: 15px; line-height: 1.6; }
.bonus-territory__guide-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 32px; }
.bonus-territory__guide-links div { display: grid; gap: 8px; min-height: 116px; padding: 20px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 12px; background: rgba(255, 255, 255, .09); color: #fff; }
.bonus-territory__guide-links span { color: #f4cf71; font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.bonus-territory__guide-links strong { align-self: end; font: 800 18px/1.25 "Work Sans", sans-serif; }
@media (max-width: 900px) { .bonus-territory__guide-heading, .bonus-territory__guide-section--art-left .bonus-territory__guide-heading { grid-template-columns: minmax(0, 1fr) minmax(175px, 235px); gap: 28px; } .bonus-territory__guide-section--art-left .bonus-territory__guide-heading { grid-template-columns: minmax(175px, 235px) minmax(0, 1fr); } .bonus-territory__guide-links { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1099px) { .bonus-territory__filter-form { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .bonus-territory__filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bonus-territory__field--search, .bonus-territory__filter-form .casino-archive__filter-actions { grid-column: 1 / -1; } }
@media (max-width: 480px) { .bonus-territory__filter-form { grid-template-columns: 1fr; } .bonus-territory__field--search, .bonus-territory__filter-form .casino-archive__filter-actions { grid-column: auto; } }
@media (min-width: 701px) and (max-width: 1199px) { .bonus-territory__hero-art { inset: 0; width: 100%; max-width: none; transform: none; -webkit-mask-image: none; mask-image: none; } .bonus-territory__hero-art img { object-fit: cover; object-position: center 56%; } }
@media (max-width: 700px) { .bonus-territory__hero { align-items: end; min-height: 820px; } .bonus-territory__hero-art { inset: 0; width: 100%; max-width: none; transform: none; -webkit-mask-image: none; mask-image: none; } .bonus-territory__hero-art img { object-fit: cover; object-position: center top; } .bonus-territory__hero-inner { padding-top: 410px; padding-bottom: 34px; } .bonus-territory__hero-copy { width: calc(100% - 24px); margin-inline: auto; padding: 24px 20px; border-radius: 14px; background: rgba(4, 43, 57, .65); } .bonus-territory__world-name { font-size: 19px; } .bonus-territory__hero h1 { font-size: clamp(36px, 11vw, 47px); } .bonus-territory__intro { font-size: 16px; } .bonus-territory__directory-heading { display: block; } .bonus-territory__field-guide { margin-top: 38px; } .bonus-territory__compare { border-radius: 0; margin-left: -10px; margin-right: -10px; padding: 32px 16px; } .bonus-territory__compare .bonus-territory__section-heading > p:last-child { font-size: 16px; } .bonus-territory__guide { margin-top: 38px; } .bonus-territory__guide-heading, .bonus-territory__guide-section--art-left .bonus-territory__guide-heading { display: flex; flex-direction: column; align-items: stretch; gap: 20px; } .bonus-territory__guide-section--art-left .casino-editorial-heading__copy, .bonus-territory__guide-section--art-left .bonus-territory__section-art { order: initial; } .bonus-territory__section-art, .bonus-territory__guide-section--art-left .bonus-territory__section-art { width: min(68vw, 250px); max-width: none; margin: 0 auto -4px; justify-self: center; } .bonus-territory__guide-section--types .bonus-territory__section-art { width: min(52vw, 205px); } .bonus-territory__claim-trail, .bonus-territory__definition-grid, .bonus-territory__guide-links { grid-template-columns: 1fr; } .bonus-territory__claim-trail { gap: 14px; margin-top: 30px; } .bonus-territory__claim-trail::before { top: 34px; right: auto; bottom: 34px; left: 40px; width: 4px; height: auto; background: linear-gradient(180deg, #6f943f, #e3b241 50%, #6f943f); } .bonus-territory__claim-trail li { display: grid; grid-template-columns: 82px minmax(0, 1fr); align-items: center; gap: 12px; text-align: left; } .bonus-territory__claim-icon { width: 82px; height: 82px; padding: 6px; } .bonus-territory__claim-copy { min-height: 0; margin: 0; padding: 16px; gap: 7px; } .bonus-territory__claim-copy strong { align-self: flex-start; margin: 0; } .bonus-territory__definition-grid { gap: 10px; margin-top: 24px; } .bonus-territory__definition-grid div { padding: 19px; } .bonus-territory__guide-links { gap: 10px; margin-top: 24px; } .bonus-territory__guide-links div { min-height: 92px; padding: 17px; } }