/* Joker Win — joker_01_vst
   Light page on white, deep-purple chrome (#3b0a75), magenta CTA (#ad00ff).
   url() paths here are relative to this file: the dashboard preview rewrites
   HTML src/href but never CSS url(), so an absolute /assets/… would 302. */

@font-face {
	font-family: 'Rubik';
	src: url('rubik-cyr.woff2') format('woff2');
	font-weight: 300 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: 'Rubik';
	src: url('rubik-lat.woff2') format('woff2');
	font-weight: 300 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--pur:    #3b0a75;
	--pur-d:  #2c0757;
	--mag:    #ad00ff;
	--mag-h:  #be33ff;
	--grn:    #94e000;
	--ink:    #000;
	--mute:   #999;
	--line:   rgba(166, 66, 255, .22);
	--card:   #fff;
	--shadow: 4px 4px 8px 0 rgb(34 60 80 / 20%);
	--wrap:   1180px;
	--r-s:    5px;
	--r-m:    10px;
	--r-l:    15px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 84px; }

body {
	margin: 0;
	background: #fff;
	color: var(--ink);
	font-family: 'Rubik', Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

img { max-width: 100%; }

.jw-wrap {
	max-width: var(--wrap);
	width: 100%;
	margin: 0 auto;
	padding: 0 10px;
}

/* ---------- buttons ---------- */

.jw-btn {
	display: inline-block;
	padding: 9px 25px;
	border: 1px solid var(--mag);
	border-radius: var(--r-m);
	font-size: 14px;
	font-weight: 900;
	line-height: 23px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .3s, color .3s;
	white-space: nowrap;
}

.jw-btn--fill { background: var(--mag); color: #fff; }
.jw-btn--fill:hover { background: var(--mag-h); border-color: var(--mag-h); }
.jw-btn--ghost { background: transparent; color: var(--mag); }
.jw-btn--ghost:hover { background: rgba(173, 0, 255, .19); }
.jw-btn--on-dark { color: #fff; border-color: #fff; }
.jw-btn--on-dark:hover { background: rgba(255, 255, 255, .15); }

/* ---------- header ---------- */

.jw-hdr {
	position: sticky;
	top: 0;
	z-index: 40;
	background: var(--pur);
}

.jw-hdr__in {
	position: relative;
	display: flex;
	align-items: center;
	gap: 18px;
	max-width: var(--wrap);
	min-height: 70px;
	margin: 0 auto;
	padding: 8px 10px;
}

.jw-burger {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	padding: 0 8px;
	background: var(--pur-d);
	border: 0;
	border-radius: var(--r-m);
	cursor: pointer;
}

.jw-burger span {
	display: block;
	height: 3px;
	border-radius: 2px;
	background: #fff;
}

.jw-hdr__links { display: flex; align-items: center; gap: 22px; }

.jw-hdr__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #fff;
	font-size: 15px;
	font-weight: 300;
	text-decoration: none;
}

.jw-hdr__link:hover { color: var(--grn); }

.jw-hdr__link svg {
	width: 24px;
	height: 24px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.jw-logo {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	display: block;
	line-height: 0;
}

.jw-logo img { width: 197px; height: auto; }

.jw-hdr__act { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.jw-hdr__act .jw-btn--ghost { color: #fff; border-color: #fff; }
.jw-hdr__act .jw-btn--ghost:hover { background: rgba(255, 255, 255, .14); }

/* ---------- drawer ---------- */

.jw-dim {
	position: fixed;
	inset: 0;
	z-index: 50;
	background: rgba(0, 0, 0, .5);
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s, visibility .3s;
}

.jw-dim.is-on { opacity: 1; visibility: visible; }

.jw-drawer {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 60;
	width: 300px;
	max-width: 86vw;
	height: 100%;
	padding: 16px;
	overflow-y: auto;
	background: #fff;
	box-shadow: var(--shadow);
	transform: translateX(-102%);
	transition: transform .3s;
}

.jw-drawer.is-on { transform: none; }

.jw-drawer__x {
	display: block;
	width: 32px;
	height: 32px;
	margin-left: auto;
	padding: 8px;
	background: none;
	border: 0;
	cursor: pointer;
}

.jw-drawer__x svg { width: 16px; height: 16px; fill: none; stroke: var(--mute); stroke-width: 1.5; stroke-linecap: round; }

/* Own artwork, so the box keeps the plate's ratio — nothing to crop. */
.jw-drawer__promo {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	aspect-ratio: 536 / 760;
	margin-bottom: 18px;
	padding: 18px;
	border-radius: var(--r-m);
	background-color: var(--pur);
	background-position: center;
	background-size: cover;
}

.jw-drawer__promo .jw-btn { width: 100%; }

.jw-drawer__nav { display: flex; flex-direction: column; }

.jw-drawer__i {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 13px 6px;
	border-bottom: 1px solid #eee;
	color: var(--ink);
	font-size: 17px;
	font-weight: 300;
	text-decoration: none;
}

.jw-drawer__i:hover { color: var(--mag); }
.jw-drawer__i img { width: 24px; height: 24px; }

/* ---------- hero slider ---------- */

.jw-hero {
	position: relative;
	max-width: var(--wrap);
	margin: 40px auto 0;
	padding: 0 10px;
}

/* No scroll-snap here: it stalls Chromium's LCP candidate on an image track. */
.jw-hero__track {
	display: flex;
	gap: 10px;
	overflow-x: auto;
	scrollbar-width: none;
	border-radius: var(--r-m);
}

.jw-hero__track::-webkit-scrollbar { display: none; }

.jw-hero__s {
	position: relative;
	flex: 0 0 100%;
	border-radius: var(--r-m);
	overflow: hidden;
}

.jw-hero__s img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1160 / 267;
	object-fit: cover;
}

.jw-hero__b {
	position: absolute;
	top: 50%;
	left: 50px;
	transform: translateY(-50%);
	width: 300px;
	color: #fff;
}

.jw-hero__cap {
	display: block;
	margin-bottom: 18px;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	text-shadow: 0 2px 8px rgba(0, 0, 0, .45);
}

.jw-hero__play {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 44px;
	border: 1px solid #fff;
	border-radius: var(--r-s);
	background: rgba(0, 0, 0, .2);
}

.jw-hero__play svg { width: 15px; height: 22px; fill: #fff; }

.jw-hero__sub {
	display: block;
	margin-top: 14px;
	font-size: 14px;
	font-weight: 300;
	line-height: 1.35;
	text-shadow: 0 2px 8px rgba(0, 0, 0, .45);
}

.jw-hero__dots {
	position: absolute;
	right: 34px;
	bottom: 14px;
	display: flex;
	gap: 8px;
}

.jw-hero__dot {
	width: 10px;
	height: 10px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .55);
	cursor: pointer;
}

.jw-hero__dot.is-on { background: var(--pur); }

/* ---------- chip / anchor bar ---------- */

.jw-chips {
	display: flex;
	align-items: center;
	margin: 36px 0 10px;
	border-radius: var(--r-l);
	box-shadow: 0 0 15px 5px rgb(0 0 0 / 5%);
}

.jw-chips__scroll {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	min-width: 0;
	overflow-x: auto;
	white-space: nowrap;
	border: 1px solid #ccc;
	border-right: 0;
	border-radius: var(--r-l) 0 0 var(--r-l);
	scrollbar-width: none;
}

.jw-chips__scroll::-webkit-scrollbar { display: none; }

.jw-chips__i {
	position: relative;
	flex: 0 0 auto;
	padding: 0 18px;
	color: var(--ink);
	font-size: 19px;
	font-weight: 300;
	line-height: 61px;
	text-decoration: none;
	transition: color .3s;
}

.jw-chips__i:hover { color: var(--mag); }

.jw-chips__i:not(:last-child)::after {
	content: '';
	position: absolute;
	top: 6px;
	right: 0;
	width: 1px;
	height: 48px;
	background: rgba(128, 128, 128, .18);
}

.jw-chips__search {
	flex: 0 0 355px;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 0 20px;
	border: 1px solid #ccc;
	border-radius: 0 var(--r-l) var(--r-l) 0;
	line-height: 61px;
}

.jw-chips__search svg { flex: 0 0 auto; width: 30px; height: 31px; fill: #fff; stroke: var(--pur); stroke-width: 2; }
.jw-chips__search svg rect { fill: var(--pur); stroke: none; }
.jw-chips__search a { color: var(--mute); font-weight: 300; text-decoration: none; }

/* ---------- section titles (spans, never headings) ---------- */

.jw-sec-t {
	position: relative;
	margin: 34px 0 18px;
	color: var(--pur);
	font-size: 20px;
	font-weight: 300;
	text-align: center;
}

.jw-sec-t::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 1px;
	background: var(--line);
}

.jw-sec-t span {
	position: relative;
	display: inline-block;
	padding: 0 18px;
	background: #fff;
}

/* Page header for toplist / review — the page's single H1. */
.jw-phead {
	position: relative;
	margin: 30px 0 20px;
	padding-bottom: 14px;
	color: var(--pur);
	font-size: 28px;
	font-weight: 400;
	line-height: 1.25;
	text-align: center;
}

.jw-phead::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 120px;
	height: 3px;
	border-radius: 2px;
	background: var(--mag);
}

/* ---------- game grids ---------- */

.jw-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
}

.jw-tile {
	position: relative;
	height: 175px;
	border-radius: 8px;
	overflow: hidden;
}

.jw-tile img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.jw-tile__ov {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 10px;
	background: rgba(0, 0, 0, .78);
	opacity: 0;
	transition: opacity .3s;
}

.jw-tile:hover .jw-tile__ov,
.jw-tile:focus-within .jw-tile__ov { opacity: 1; }

.jw-tile__n {
	margin-bottom: 14px;
	color: #fff;
	font-size: 17px;
	font-weight: 400;
	line-height: 1.4;
	text-align: center;
}

.jw-tile__ov .jw-btn { width: 102px; padding: 10px 15px; border-radius: var(--r-s); }

.jw-tile__demo {
	margin-top: 16px;
	border-bottom: 1px solid;
	color: var(--mute);
	font-size: 12px;
	line-height: 1.4;
	text-decoration: none;
	text-transform: uppercase;
}

.jw-more {
	display: block;
	width: 209px;
	margin: 20px auto 30px;
	padding: 9px 0;
	border-radius: var(--r-l);
	background: var(--mag);
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	transition: background-color .3s;
}

.jw-more:hover { background: var(--mag-h); }

/* ---------- bonuses ---------- */

.jw-bonus__row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.jw-bonus__c {
	background: var(--card);
	border-radius: var(--r-m);
	box-shadow: var(--shadow);
	overflow: hidden;
	transition: transform .3s;
}

.jw-bonus__c:hover { transform: translateY(-4px); }

/* The promo covers are portrait (500×560); the box keeps that ratio so the
   game title at the top of the artwork is never cropped away. */
.jw-bonus__img {
	display: block;
	overflow: hidden;
	background: var(--pur);
}

.jw-bonus__img img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 500 / 560;
	object-fit: cover;
	transition: transform .3s;
}

.jw-bonus__c:hover .jw-bonus__img img { transform: scale(1.06); }

.jw-bonus__d { padding: 12px 14px 0; color: var(--mute); font-size: 13px; text-align: center; }

.jw-bonus__n {
	display: block;
	padding: 8px 14px 18px;
	color: var(--ink);
	font-size: 21px;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
}

.jw-bonus__c:hover .jw-bonus__n { color: var(--pur); }

/* ---------- providers ---------- */

.jw-prov__grid {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	gap: 12px;
}

.jw-prov__i {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 96px;
	padding: 10px;
	border: 1px solid #e3ebf2;
	border-radius: var(--r-m);
	background: #fff;
	transition: border-color .3s, box-shadow .3s;
}

.jw-prov__i:hover { border-color: var(--mag); box-shadow: 0 0 12px rgba(173, 0, 255, .18); }
.jw-prov__i img { max-height: 100%; width: auto; object-fit: contain; }

.jw-prov__all {
	display: block;
	width: 200px;
	margin: 25px auto 0;
	padding: 11px 15px;
	border-radius: var(--r-s);
	background: var(--pur);
	color: #fff;
	font-size: 18px;
	text-align: center;
	text-decoration: none;
	transition: background-color .3s;
}

.jw-prov__all:hover { background: var(--mag); }

/* ---------- article text ---------- */

.jw-text { padding: 34px 0 40px; }
.jw-text--plain { padding-top: 26px; }

.jw-text__h1 {
	margin: 0 0 18px;
	color: var(--ink);
	font-size: 30px;
	font-weight: 300;
	line-height: 1.25;
}

.jw-text__b { font-size: 17px; font-weight: 300; line-height: 1.6; }
.jw-text__b h2 { margin: 28px 0 12px; font-size: 25px; font-weight: 400; }
.jw-text__b h3 { margin: 22px 0 10px; font-size: 21px; font-weight: 400; }
.jw-text__b h4 { margin: 18px 0 8px; font-size: 18px; font-weight: 500; }
.jw-text__b p { margin: 0 0 14px; }
.jw-text__b a { color: var(--mag); }
.jw-text__b ul, .jw-text__b ol { margin: 0 0 16px; padding-left: 22px; }
.jw-text__b li { margin-bottom: 6px; }
/* Editorial images: centred, never wider than the column, never distorted. */
.jw-text__b img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 18px auto;
	border-radius: var(--r-m);
}
.jw-text__b blockquote {
	margin: 0 0 16px;
	padding: 12px 18px;
	border-left: 4px solid var(--mag);
	background: #faf5ff;
}

/* A wide table must scroll inside its own box, not push the page sideways. */
/* A wide table must scroll inside its own box, not push the page sideways.
   The scroll lives on the wrapper — a `display:block` table loses its column
   layout, so the table itself stays a table and just grows past the wrapper. */
.jw-text__b .table-scroll {
	margin: 0 0 18px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.jw-text__b table {
	width: max-content;
	min-width: 100%;
	border-collapse: collapse;
	margin: 0 0 18px;
	font-size: 16px;
}

.jw-text__b .table-scroll table { margin: 0; }
.jw-text__b .table-scroll th { white-space: nowrap; }
.jw-text__b .table-scroll td { max-width: 38ch; }

.jw-text__b th,
.jw-text__b td { padding: 9px 12px; border: 1px solid #e4e1e1; text-align: left; }
.jw-text__b th { background: #f7f2ff; color: var(--pur); font-weight: 500; }

/* ---------- toplist ---------- */

.jw-top { display: grid; gap: 14px; margin-bottom: 10px; }

.jw-top__i {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 20px;
	border-radius: var(--r-m);
	background: #fff;
	box-shadow: var(--shadow);
}

.jw-top__n {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--pur);
	color: #fff;
	font-size: 20px;
	font-weight: 700;
}

.jw-top__b { flex: 1 1 auto; font-weight: 300; }

/* ---------- review ---------- */

.jw-rev { display: flex; gap: 26px; align-items: flex-start; padding-bottom: 30px; }

.jw-rev__side {
	flex: 0 0 300px;
	position: sticky;
	top: 92px;
	padding: 18px;
	border-radius: var(--r-m);
	background: #fff;
	box-shadow: var(--shadow);
	text-align: center;
}

.jw-rev__logo { width: 170px; height: auto; margin-bottom: 14px; }

.jw-rev__tbl { width: 100%; border-collapse: collapse; font-size: 14px; text-align: left; }
.jw-rev__tbl td { padding: 7px 8px; border-bottom: 1px solid #eee; }
.jw-rev__tbl td:first-child { color: var(--mute); }

.jw-rev__cta { display: block; margin-top: 16px; }
.jw-rev__body { flex: 1 1 auto; min-width: 0; }

/* ---------- landing ---------- */

/* A flat brand gradient, not a promo banner: the source's banner art carries
   baked-in campaign text that would show through any overlay. */
.jw-land {
	background: radial-gradient(120% 140% at 50% 0%, #6a12c9 0%, var(--pur) 48%, var(--pur-d) 100%);
}

.jw-land__in {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 64px 16px;
	text-align: center;
}

.jw-land__t { margin: 0; color: #fff; font-size: 32px; font-weight: 500; line-height: 1.25; }
.jw-land__cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

/* ---------- mobile bottom bar ---------- */

.jw-bar {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 45;
	display: none;
	align-items: center;
	gap: 14px;
	width: 100%;
	height: 52px;
	padding: 0 12px;
	background: var(--pur);
}

.jw-burger--bar { width: 34px; height: 34px; padding: 0 6px; gap: 4px; background: transparent; }
.jw-burger--bar span { height: 2px; }

.jw-bar__cta { margin-left: auto; padding: 6px 16px; font-size: 12px; }

/* ---------- footer ---------- */

.jw-foot { margin-top: 30px; padding: 28px 0 24px; background: var(--pur); color: #fff; }

.jw-foot__in {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1.1fr 1.1fr 1fr;
	gap: 24px;
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 0 10px;
}

.jw-foot__col { display: flex; flex-direction: column; gap: 8px; }

.jw-foot__t { font-size: 20px; font-weight: 500; }
.jw-foot__mail { color: #fff; font-size: 15px; text-decoration: underline; }
.jw-foot__sub { color: rgba(255, 255, 255, .75); font-size: 14px; font-weight: 300; }

.jw-foot__i { color: #fff; font-size: 15px; font-weight: 300; text-decoration: none; }
.jw-foot__i:hover { color: var(--grn); }

.jw-foot__soc { display: flex; gap: 12px; }
.jw-foot__soc img { width: 32px; height: 32px; }
.jw-foot__pay { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.jw-foot__pay img { width: 46px; height: 30px; object-fit: contain; }

.jw-foot__note {
	max-width: var(--wrap);
	margin: 22px auto 0;
	padding: 18px 10px 0;
	border-top: 1px solid rgba(255, 255, 255, .18);
	color: rgba(255, 255, 255, .8);
	font-size: 13px;
	font-weight: 300;
	line-height: 1.55;
}

.jw-foot__note p { margin: 0 0 8px; }

.jw-foot__age {
	display: inline-block;
	margin-bottom: 10px;
	padding: 3px 10px;
	border: 1px solid var(--grn);
	border-radius: 50px;
	color: var(--grn);
	font-size: 13px;
	font-weight: 700;
}

/* ---------- responsive ---------- */

/* The logo is centred absolutely, so the two link groups must not grow into
   it. These labels are long, and at 1024 the left group came within 4px of the
   logo — hence the earlier breakpoint for the third cluster link. The drawer
   still carries all of them. */
@media (max-width: 1199px) {
	.jw-hdr__link:nth-child(3) { display: none; }
}

@media (max-width: 1023px) {
	.jw-prov__grid { grid-template-columns: repeat(5, 1fr); }
	.jw-bonus__row { grid-template-columns: repeat(2, 1fr); }
	.jw-chips__search { flex-basis: 260px; }
	.jw-rev { flex-direction: column; }
	.jw-rev__side { position: static; width: 100%; flex-basis: auto; }
	.jw-foot__in { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 767px) {
	body { padding-bottom: 52px; }
	.jw-hdr__in { min-height: 56px; gap: 10px; }
	.jw-hdr__links, .jw-hdr__act, .jw-burger:not(.jw-burger--bar) { display: none; }
	.jw-logo { position: static; transform: none; margin: 0 auto; }
	.jw-logo img { width: 130px; }
	.jw-bar { display: flex; }

	.jw-hero { margin-top: 16px; }
	.jw-hero__s img { aspect-ratio: 16 / 11; }

	/* The banner art fills the phone crop edge to edge, so the caption needs a
	   scrim of its own — over bare artwork it is unreadable. */
	.jw-hero__s::after {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(90deg, rgba(28, 4, 56, .88) 0%, rgba(28, 4, 56, .55) 52%, rgba(28, 4, 56, .1) 100%);
		pointer-events: none;
	}

	.jw-hero__b { top: 50%; left: 16px; right: 16px; width: auto; z-index: 1; }
	.jw-hero__cap { font-size: 19px; margin-bottom: 10px; }
	.jw-hero__play { width: 68px; height: 36px; }
	.jw-hero__sub { margin-top: 10px; font-size: 13px; }
	.jw-hero__dots { right: 20px; bottom: 10px; }

	.jw-chips { margin-top: 22px; box-shadow: none; }
	.jw-chips__search { display: none; }
	.jw-chips__scroll { border-right: 1px solid #ccc; border-radius: var(--r-l); }
	.jw-chips__i { font-size: 16px; line-height: 46px; padding: 0 14px; }
	.jw-chips__i:not(:last-child)::after { height: 34px; top: 6px; }

	.jw-grid { grid-template-columns: repeat(2, 1fr); }
	.jw-tile { height: 118px; }
	.jw-tile__n { font-size: 14px; margin-bottom: 8px; }
	.jw-tile__demo { margin-top: 8px; }

	.jw-bonus__row { grid-template-columns: 1fr; }
	.jw-bonus__c { max-width: 420px; margin: 0 auto; }
	.jw-prov__grid { grid-template-columns: repeat(3, 1fr); }
	.jw-prov__i { height: 74px; }

	.jw-text__h1 { font-size: 24px; }
	.jw-text__b { font-size: 16px; }
	.jw-text__b h2 { font-size: 21px; }
	.jw-text__b h3 { font-size: 18px; }
	

	.jw-land__in { padding: 44px 16px; }
	.jw-land__t { font-size: 24px; }

	.jw-foot__in { grid-template-columns: 1fr; gap: 18px; }
}