/* ==========================================================================
   ARCTIC — page modules
   Breadcrumb, order results, database table, top-up console, cart page and
   the legacy bootstrap sheets (FAQ / instructors). Loads after arctic.css.
   ========================================================================== */

/* ==========================================================================
   BREADCRUMB — arctic page header band
   ========================================================================== */
section.pcrumb,
.pcrumb {
	position: relative;
	overflow: hidden;
	margin: 0;
	padding: clamp(48px, 6vw, 78px) 0 clamp(40px, 5vw, 60px);
	background: linear-gradient(125deg, var(--ab-ink) 0%, #06313f 55%, #041d26 100%);
	border: 0;
	border-radius: 0;
	isolation: isolate;
}

.pcrumb::after {
	content: '';
	position: absolute;
	inset-inline: 0;
	bottom: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--arctic-blue-5) 0%, var(--arctic-blue-2) 36%, transparent 80%);
}

.pcrumb__grid {
	position: absolute;
	inset: 0;
	opacity: .45;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(144, 224, 239, .09) 1px, transparent 1px),
		linear-gradient(90deg, rgba(144, 224, 239, .09) 1px, transparent 1px);
	background-size: 58px 58px;
	-webkit-mask-image: radial-gradient(80% 100% at 4% 50%, #000 0%, transparent 72%);
	mask-image: radial-gradient(80% 100% at 4% 50%, #000 0%, transparent 72%);
}

.pcrumb__glow {
	position: absolute;
	top: -170px;
	right: -110px;
	width: 430px;
	height: 430px;
	border-radius: 50%;
	background: var(--arctic-blue-5);
	filter: blur(120px);
	opacity: .38;
	pointer-events: none;
}

.pcrumb__inner {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.pcrumb__trail ol {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	padding: 0;
	margin: 0 0 16px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.pcrumb__trail li {
	display: inline-flex;
	align-items: center;
}

.pcrumb__trail li a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 14px;
	border-radius: 999px;
	background: rgba(144, 224, 239, .1);
	border: 1px solid rgba(144, 224, 239, .22);
	color: rgba(202, 240, 248, .85) !important;
	text-decoration: none;
	transition: .25s;
}

.pcrumb__trail li a i {
	font-size: 10px;
	color: var(--arctic-blue-4);
}

.pcrumb__trail li a:hover {
	background: var(--arctic-blue-5);
	border-color: var(--arctic-blue-5);
	color: #04252f !important;
}

.pcrumb__trail li a:hover i {
	color: #04252f;
}

.pcrumb__sep {
	color: rgba(144, 224, 239, .4);
	font-size: 9px;
}

.pcrumb__current {
	color: var(--arctic-blue-3);
	padding: 6px 2px;
}

.pcrumb__title {
	font-family: var(--ab-head) !important;
	font-size: clamp(30px, 3.6vw, 48px) !important;
	font-weight: 600 !important;
	line-height: 1.08 !important;
	letter-spacing: -.02em !important;
	color: #fff !important;
	margin: 0 !important;
}

.pcrumb__desc {
	font-size: 15px;
	line-height: 1.7;
	margin: 12px 0 0;
	max-width: 62ch;
	color: rgba(202, 240, 248, .75) !important;
}

.pcrumb__mark {
	position: relative;
	flex: none;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: rgba(144, 224, 239, .1);
	border: 1px solid rgba(144, 224, 239, .24);
	color: var(--arctic-blue-3);
	font-size: 28px;
}

.pcrumb__mark-ring {
	position: absolute;
	inset: -11px;
	border-radius: 50%;
	border: 1px dashed rgba(144, 224, 239, .3);
	animation: pcrumbSpin 24s linear infinite;
}

@keyframes pcrumbSpin {
	to {
		transform: rotate(360deg);
	}
}

@media (max-width: 640px) {
	.pcrumb__mark {
		display: none;
	}

	.pcrumb__trail ol {
		gap: 7px;
		font-size: 10px;
	}

	.pcrumb__trail li a {
		padding: 5px 11px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.pcrumb__mark-ring {
		animation: none;
	}
}

/* ==========================================================================
   ORDER RESULT PAGES (.ordr)
   ========================================================================== */
[class*="page-order"] .ordr {
	background: var(--ab-wash);
	padding: clamp(52px, 7vw, 88px) 0;
}

[class*="page-order"] .ordr__shell {
	width: min(880px, calc(100% - 40px));
	margin-inline: auto;
}

[class*="page-order"] .ordr-mono {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
}

[class*="page-order"] .ordr__band {
	position: relative;
	overflow: hidden;
	background: var(--ab-ink);
	color: #fff;
	border-radius: var(--ab-r-xl);
	padding: clamp(32px, 5vw, 54px);
	margin-bottom: 22px;
}

[class*="page-order"] .ordr__band-glow {
	position: absolute;
	width: 380px;
	height: 380px;
	border-radius: 50%;
	filter: blur(120px);
	opacity: .45;
	top: -160px;
	right: -80px;
	background: var(--arctic-blue-5);
}

[class*="page-order"] .ordr--fail .ordr__band-glow {
	background: #e4572e;
	opacity: .35;
}

[class*="page-order"] .ordr__band-inner {
	position: relative;
}

[class*="page-order"] .ordr__band-label {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: var(--arctic-blue-2);
	margin-bottom: 16px;
}

[class*="page-order"] .ordr--fail .ordr__band-label {
	color: #ffb59e;
}

[class*="page-order"] .ordr__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--arctic-blue-4);
	box-shadow: 0 0 0 5px rgba(72, 202, 228, .22);
}

[class*="page-order"] .ordr--fail .ordr__dot {
	background: #e4572e;
	box-shadow: 0 0 0 5px rgba(228, 87, 46, .22);
}

[class*="page-order"] .ordr__band-title {
	font-family: var(--ab-head);
	font-size: clamp(28px, 4vw, 44px);
	line-height: 1.1;
	margin: 0 0 12px;
	color: #fff;
}

[class*="page-order"] .ordr__band-text {
	font-size: 16px;
	line-height: 1.75;
	color: rgba(202, 240, 248, .76);
	margin: 0;
	max-width: 60ch;
}

[class*="page-order"] .ordr__record {
	background: #fff;
	border: 1px solid var(--ab-line);
	border-radius: var(--ab-r-lg);
	padding: 8px 26px;
	margin: 0 0 22px;
}

[class*="page-order"] .ordr__row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
	align-items: center;
	justify-content: space-between;
	padding: 18px 0;
	border-bottom: 1px solid var(--ab-line);
}

[class*="page-order"] .ordr__row:last-child {
	border-bottom: 0;
}

[class*="page-order"] .ordr__row dt {
	color: var(--ab-muted);
	margin: 0;
}

[class*="page-order"] .ordr__value {
	margin: 0;
	font-weight: 650;
	font-size: 15px;
	color: var(--ab-ink);
}

[class*="page-order"] .ordr__value--code {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	background: var(--ab-wash);
	padding: 6px 12px;
	border-radius: 8px;
	font-size: 13.5px;
}

[class*="page-order"] .ordr__pill {
	display: inline-block;
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--arctic-blue-1);
	color: var(--arctic-blue-5);
	font-size: 12.5px;
	font-weight: 700;
}

[class*="page-order"] .ordr__row--total {
	background: var(--ab-wash);
	margin: 0 -26px;
	padding: 20px 26px;
	border-radius: 0 0 var(--ab-r-lg) var(--ab-r-lg);
	border-bottom: 0;
}

[class*="page-order"] .ordr__value--total {
	font-family: var(--ab-head);
	font-size: 26px;
	color: var(--arctic-blue-5);
}

[class*="page-order"] .ordr__steps {
	background: #fff;
	border: 1px solid var(--ab-line);
	border-radius: var(--ab-r-lg);
	padding: 26px;
	margin-bottom: 22px;
}

[class*="page-order"] .ordr__steps-label {
	color: var(--ab-muted);
	margin: 0 0 16px;
}

[class*="page-order"] .ordr__steps-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 12px;
}

[class*="page-order"] .ordr__steps-list li {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	border-radius: var(--ab-r-sm);
	background: var(--ab-wash);
	font-size: 14.5px;
	color: var(--ab-slate);
}

[class*="page-order"] .ordr__steps-num {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	display: grid;
	place-items: center;
	background: var(--arctic-blue-1);
	color: var(--arctic-blue-5);
	font-size: 12px;
}

[class*="page-order"] .ordr__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 20px;
}

[class*="page-order"] .ordr__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 15px 26px;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 650;
	text-decoration: none;
	border: 1.5px solid transparent;
	transition: .25s;
}

[class*="page-order"] .ordr__btn--go {
	background: var(--arctic-blue-5);
	color: #04252f;
	box-shadow: 0 16px 34px -16px rgba(0, 180, 216, .8);
}

[class*="page-order"] .ordr__btn--go:hover {
	background: var(--ab-ink);
	color: #fff;
	transform: translateY(-2px);
}

[class*="page-order"] .ordr__btn--ghost {
	background: #fff;
	border-color: var(--ab-line);
	color: var(--ab-ink);
}

[class*="page-order"] .ordr__btn--ghost:hover {
	border-color: var(--arctic-blue-4);
	color: var(--arctic-blue-5);
}

[class*="page-order"] .ordr__note,
[class*="page-order"] .ordr__support {
	background: #fff;
	border: 1px solid var(--ab-line);
	border-left: 3px solid var(--arctic-blue-4);
	border-radius: var(--ab-r-sm);
	padding: 18px 22px;
	font-size: 14.5px;
	line-height: 1.7;
	color: var(--ab-slate);
}

[class*="page-order"] .ordr__note i {
	color: var(--arctic-blue-5);
	margin-right: 8px;
}

[class*="page-order"] .ordr__support-label {
	color: var(--ab-muted);
	margin: 0 0 8px;
}

[class*="page-order"] .ordr__support-text {
	margin: 0;
}

[class*="page-order"] .ordr__note a,
[class*="page-order"] .ordr__support a {
	color: var(--arctic-blue-5);
	font-weight: 650;
}

/* ==========================================================================
   DATABASE TABLE (.dbx)
   ========================================================================== */
.page-database .dbx {
	background: var(--ab-wash);
	padding: clamp(48px, 6vw, 80px) 0;
}

.page-database .dbx__shell {
	width: min(1240px, calc(100% - 40px));
	margin-inline: auto;
}

.page-database .dbx-mono {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ab-muted);
}

.page-database .dbx__bar {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 22px;
}

.page-database .dbx__count {
	display: flex;
	align-items: baseline;
	gap: 10px;
	margin: 0;
}

.page-database .dbx__count-num {
	font-family: var(--ab-head);
	font-size: 36px;
	color: var(--ab-ink);
	line-height: 1;
}

.page-database .dbx__search {
	display: flex;
	align-items: center;
	gap: 11px;
	background: #fff;
	border: 1.5px solid var(--ab-line);
	border-radius: 999px;
	padding: 12px 22px;
	min-width: min(360px, 100%);
	transition: .25s;
}

.page-database .dbx__search:focus-within {
	border-color: var(--arctic-blue-4);
	box-shadow: 0 0 0 5px var(--arctic-blue-1);
}

.page-database .dbx__search i {
	color: var(--arctic-blue-5);
}

.page-database .dbx__search input {
	flex: 1;
	border: 0;
	outline: 0;
	background: none;
	font-size: 15px;
	color: var(--ab-ink);
	font-family: var(--ab-font);
}

.page-database .dbx__table {
	background: #fff;
	border: 1px solid var(--ab-line);
	border-radius: var(--ab-r-lg);
	overflow: hidden;
}

.page-database .dbx__head,
.page-database .dbx__row {
	display: grid;
	grid-template-columns: 64px 1fr 150px 150px;
	gap: 16px;
	align-items: center;
	padding: 14px 24px;
}

.page-database .dbx__head {
	background: var(--ab-ink);
	color: rgba(202, 240, 248, .8);
}

.page-database .dbx__head span {
	color: inherit;
}

.page-database .dbx__right {
	text-align: right;
}

.page-database .dbx__row {
	border-bottom: 1px solid var(--ab-line);
	transition: background .22s;
}

.page-database .dbx__row:last-child {
	border-bottom: 0;
}

.page-database .dbx__row:hover {
	background: var(--ab-wash);
}

.page-database .dbx__row-index {
	color: var(--arctic-blue-5);
}

.page-database .dbx__row-main {
	display: flex;
	align-items: center;
	gap: 15px;
	min-width: 0;
}

.page-database .dbx__row-thumb {
	width: 62px;
	height: 46px;
	border-radius: 10px;
	overflow: hidden;
	flex-shrink: 0;
	background: var(--arctic-blue-1);
}

.page-database .dbx__row-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.page-database .dbx__row-copy {
	min-width: 0;
}

.page-database .dbx__row-title {
	display: block;
	font-weight: 650;
	font-size: 15px;
	color: var(--ab-ink);
	text-decoration: none;
}

.page-database .dbx__row-title:hover {
	color: var(--arctic-blue-5);
}

.page-database .dbx__row-summary {
	display: block;
	font-size: 13px;
	color: var(--ab-muted);
	margin-top: 3px;
}

.page-database .dbx__row-price {
	text-align: right;
	font-weight: 700;
	font-size: 16px;
	color: var(--ab-ink);
}

.page-database .dbx__row-action {
	justify-self: end;
	margin: 0;
}

.page-database .dbx__add {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 11px 18px;
	border-radius: 999px;
	border: 1.5px solid var(--ab-line);
	background: #fff;
	color: var(--ab-ink);
	font-size: 13.5px;
	font-weight: 650;
	cursor: pointer;
	transition: .25s;
}

.page-database .dbx__add:hover {
	background: var(--arctic-blue-5);
	border-color: var(--arctic-blue-5);
	color: #04252f;
}

.page-database .dbx__none {
	padding: 40px;
	text-align: center;
	color: var(--ab-muted);
}

.page-database .dbx__panel {
	background: #fff;
	border: 1px solid var(--ab-line);
	border-radius: var(--ab-r-lg);
	padding: 60px 30px;
	text-align: center;
}

.page-database .dbx__panel-title {
	font-family: var(--ab-head);
	font-size: 28px;
	margin: 10px 0 22px;
	color: var(--ab-ink);
}

.page-database .dbx__panel-cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 26px;
	border-radius: 999px;
	background: var(--arctic-blue-5);
	color: #04252f;
	font-weight: 650;
	text-decoration: none;
}

.page-database .dbx__pager {
	margin-top: 26px;
	display: flex;
	justify-content: center;
}

@media (max-width: 900px) {

	.page-database .dbx__head {
		display: none;
	}

	.page-database .dbx__row {
		grid-template-columns: 1fr auto;
		row-gap: 10px;
	}

	.page-database .dbx__row-index {
		display: none;
	}

	.page-database .dbx__row-main {
		grid-column: 1 / -1;
	}
}

/* ==========================================================================
   TOP-UP CONSOLE (.tconsole)
   ========================================================================== */
.page-topup .topup-console-section {
	position: relative;
	overflow: hidden;
	background: var(--ab-wash);
	padding: clamp(52px, 7vw, 90px) 0 !important;
}

.page-topup .tconsole__glow {
	position: absolute;
	width: 460px;
	height: 460px;
	border-radius: 50%;
	filter: blur(140px);
	opacity: .3;
	pointer-events: none;
}

.page-topup .tconsole__glow--a {
	background: var(--arctic-blue-4);
	top: -180px;
	left: -140px;
}

.page-topup .tconsole__glow--b {
	background: var(--arctic-blue-3);
	bottom: -220px;
	right: -140px;
}

.page-topup .tconsole {
	position: relative;
	z-index: 1;
	width: min(1240px, calc(100% - 40px));
	max-width: none;
	margin-inline: auto;
	padding: 0 !important;
}

.page-topup .tconsole__head {
	text-align: center;
	max-width: 720px;
	margin: 0 auto clamp(30px, 4vw, 46px);
}

.page-topup .tconsole__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--arctic-blue-5);
	background: var(--arctic-blue-1);
	border-radius: 999px;
	padding: 8px 16px;
	margin-bottom: 16px;
}

.page-topup .tconsole__title {
	font-family: var(--ab-head);
	font-size: clamp(30px, 4.2vw, 50px);
	line-height: 1.1;
	margin: 0 0 12px;
	color: var(--ab-ink);
}

.page-topup .tconsole__lede {
	font-size: 16px;
	line-height: 1.75;
	color: var(--ab-slate);
	margin: 0;
}

.page-topup .tconsole__deck {
	display: grid;
	grid-template-columns: 1.2fr auto .7fr auto 1fr;
	align-items: end;
	gap: 18px;
	background: #fff;
	border: 1px solid var(--ab-line);
	border-radius: var(--ab-r-xl);
	box-shadow: var(--ab-shadow-lg);
	padding: clamp(24px, 3.4vw, 38px);
}

.page-topup .tconsole__cell-label {
	display: block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ab-muted);
	margin-bottom: 10px;
}

.page-topup .tconsole__input {
	display: flex;
	align-items: center;
	gap: 10px;
	border: 2px solid var(--ab-line);
	border-radius: var(--ab-r);
	padding: 4px 18px;
	transition: .25s;
}

.page-topup .tconsole__input:focus-within {
	border-color: var(--arctic-blue-4);
	box-shadow: 0 0 0 5px var(--arctic-blue-1);
}

.page-topup .tconsole__sym {
	font-size: 24px;
	font-weight: 700;
	color: var(--arctic-blue-5);
}

.page-topup .tconsole__amount {
	flex: 1;
	width: 100%;
	border: 0;
	outline: 0;
	background: none;
	font-family: var(--ab-font);
	font-size: 32px;
	font-weight: 700;
	color: var(--ab-ink);
	padding: 10px 0;
}

.page-topup .tconsole__op {
	padding-bottom: 18px;
	color: var(--ab-muted);
	font-size: 16px;
}

.page-topup .tconsole__multi,
.page-topup .tconsole__out {
	display: block;
	font-family: var(--ab-head);
	font-size: clamp(28px, 3.4vw, 42px);
	line-height: 1.1;
	color: var(--ab-ink);
	padding-bottom: 10px;
}

.page-topup .tconsole__out {
	color: var(--arctic-blue-5);
}

.page-topup .tconsole__go {
	grid-column: 1 / -1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 16px 30px;
	border-radius: 999px;
	border: 0;
	background: var(--ab-ink);
	color: #fff;
	font-size: 15.5px;
	font-weight: 650;
	cursor: pointer;
	transition: .25s;
}

.page-topup .tconsole__go:hover {
	background: var(--arctic-blue-5);
	color: #04252f;
	transform: translateY(-2px);
}

.page-topup .tconsole__go-ico {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .16);
	display: grid;
	place-items: center;
	font-size: 12px;
}

.page-topup .tconsole__readout {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 20px 0 clamp(36px, 5vw, 58px);
}

.page-topup .tconsole__readout-item {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 11px 18px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--ab-line);
	font-size: 13.5px;
	color: var(--ab-slate);
}

.page-topup .tconsole__readout-item strong {
	color: var(--ab-ink);
	font-size: 15px;
}

.page-topup .tconsole__readout-item--trust i {
	color: var(--arctic-blue-5);
}

.page-topup .tconsole__track-head {
	text-align: center;
	margin-bottom: 26px;
}

.page-topup .tconsole__track-title {
	font-family: var(--ab-head);
	font-size: clamp(24px, 3vw, 34px);
	margin: 0 0 8px;
	color: var(--ab-ink);
}

.page-topup .tconsole__track-sub {
	color: var(--ab-slate);
	margin: 0;
}

.page-topup .tconsole__track {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 18px;
	margin-bottom: 34px;
}

.page-topup .tconsole__node {
	position: relative;
	padding: 28px 24px;
	border-radius: var(--ab-r-lg);
	background: #fff;
	border: 1.5px solid var(--ab-line);
	transition: .3s;
}

.page-topup .tconsole__node:hover,
.page-topup .tconsole__node.timeline-step-highlight {
	border-color: var(--arctic-blue-5);
	transform: translateY(-5px);
	box-shadow: var(--ab-shadow);
}

.page-topup .tconsole__node.timeline-step-highlight {
	background: linear-gradient(180deg, var(--arctic-blue-1), #fff);
}

.page-topup .tconsole__node-multi {
	display: inline-block;
	font-size: 20px;
	font-weight: 750;
	color: var(--arctic-blue-5);
	margin-bottom: 14px;
}

.page-topup .tconsole__node-mark {
	position: absolute;
	top: 24px;
	right: 24px;
}

.page-topup .tconsole__node-dot {
	width: 34px;
	height: 34px;
	border-radius: 11px;
	background: var(--arctic-blue-1);
	color: var(--arctic-blue-5);
	display: grid;
	place-items: center;
	font-size: 12px;
	font-weight: 700;
}

.page-topup .tconsole__node-name {
	display: block;
	font-size: 18px;
	font-weight: 700;
	color: var(--ab-ink);
	margin-bottom: 5px;
}

.page-topup .tconsole__node-range {
	display: block;
	font-size: 13px;
	font-weight: 650;
	color: var(--ab-muted);
	margin-bottom: 10px;
}

.page-topup .tconsole__node-desc {
	display: block;
	font-size: 14px;
	line-height: 1.65;
	color: var(--ab-slate);
}

.page-topup .tconsole__perks {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}

.page-topup .tconsole__perk {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 20px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--ab-line);
	font-size: 14px;
	font-weight: 600;
	color: var(--ab-ink);
}

.page-topup .tconsole__perk-ico {
	color: var(--arctic-blue-5);
}

@media (max-width: 900px) {
	.page-topup .tconsole__deck {
		grid-template-columns: 1fr;
	}

	.page-topup .tconsole__op {
		display: none;
	}
}

/* ==========================================================================
   CART PAGE (.cart-*)
   ========================================================================== */
.page-cart .cart-redesign {
	position: relative;
	overflow: hidden;
	background: var(--ab-wash);
	padding: clamp(48px, 6vw, 84px) 0;
}

.page-cart .cart-pattern {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: .5;
	background-image:
		linear-gradient(rgba(144, 224, 239, .16) 1px, transparent 1px),
		linear-gradient(90deg, rgba(144, 224, 239, .16) 1px, transparent 1px);
	background-size: 60px 60px;
	-webkit-mask-image: radial-gradient(70% 60% at 50% 0%, #000, transparent 75%);
	mask-image: radial-gradient(70% 60% at 50% 0%, #000, transparent 75%);
}

.page-cart .cart-glow {
	position: absolute;
	width: 420px;
	height: 420px;
	border-radius: 50%;
	filter: blur(140px);
	opacity: .3;
	pointer-events: none;
}

.page-cart .cart-glow-mint {
	background: var(--arctic-blue-4);
	top: -160px;
	left: -120px;
}

.page-cart .cart-glow-sky {
	background: var(--arctic-blue-3);
	bottom: -200px;
	right: -120px;
}

.page-cart .cart-redesign .container {
	position: relative;
	z-index: 1;
}

.page-cart .cart-items-section,
.page-cart .cart-sidebar {
	background: #fff;
	border: 1px solid var(--ab-line);
	border-radius: var(--ab-r-lg);
	padding: clamp(22px, 3vw, 32px);
}

.page-cart .cart-sidebar {
	position: sticky;
	top: 120px;
}

.page-cart .cart-section-header,
.page-cart .cart-sidebar__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--ab-line);
	margin-bottom: 20px;
}

.page-cart .cart-section-title,
.page-cart .cart-sidebar__title {
	display: flex;
	align-items: center;
	gap: 11px;
	font-family: var(--ab-head);
	font-size: 22px;
	margin: 0;
	color: var(--ab-ink);
}

.page-cart .cart-section-title i,
.page-cart .cart-sidebar__title i {
	font-size: 17px;
	color: var(--arctic-blue-5);
}

.page-cart .cart-section-count {
	min-width: 30px;
	height: 30px;
	padding: 0 10px;
	border-radius: 999px;
	background: var(--arctic-blue-5);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	display: grid;
	place-items: center;
}

.page-cart .cart-items-list {
	display: grid;
	gap: 14px;
}

.page-cart .cart-item-card {
	display: grid;
	grid-template-columns: 120px 1fr auto auto;
	gap: 18px;
	align-items: center;
	padding: 16px;
	border: 1px solid var(--ab-line);
	border-radius: var(--ab-r);
	background: var(--ab-wash);
	transition: .28s;
}

.page-cart .cart-item-card:hover {
	border-color: var(--arctic-blue-3);
	box-shadow: var(--ab-shadow);
}

.page-cart .cart-item-card__media {
	position: relative;
	border-radius: var(--ab-r-sm);
	overflow: hidden;
	aspect-ratio: 4/3;
}

.page-cart .cart-item-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.page-cart .cart-item-card__badge {
	position: absolute;
	left: 7px;
	bottom: 7px;
	background: rgba(255, 255, 255, .92);
	color: var(--ab-ink);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: 5px 9px;
	border-radius: 999px;
}

.page-cart .cart-item-card__credits-visual {
	display: grid;
	place-items: center;
	gap: 2px;
	aspect-ratio: 4/3;
	border-radius: var(--ab-r-sm);
	background: var(--ab-ink);
	color: #fff;
}

.page-cart .cart-item-card__credits-visual i {
	font-size: 20px;
	color: var(--arctic-blue-4);
}

.page-cart .cart-item-card__credits-amount {
	font-weight: 750;
	font-size: 17px;
}

.page-cart .cart-item-card__credits-unit {
	font-size: 10px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--arctic-blue-2);
}

.page-cart .cart-item-card__title {
	display: block;
	font-size: 17px;
	font-weight: 700;
	color: var(--ab-ink);
	text-decoration: none;
	margin-bottom: 7px;
}

.page-cart .cart-item-card__title:hover {
	color: var(--arctic-blue-5);
}

.page-cart .cart-item-card__type {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--arctic-blue-5);
	background: var(--arctic-blue-1);
	padding: 6px 12px;
	border-radius: 999px;
}

.page-cart .cart-item-card__price {
	text-align: right;
}

.page-cart .cart-item-card__price-label {
	display: block;
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ab-muted);
	margin-bottom: 4px;
}

.page-cart .cart-item-card__price-value {
	font-size: 17px;
	font-weight: 750;
	color: var(--ab-ink);
}

.page-cart .price-creds i {
	color: var(--arctic-blue-5);
	margin-right: 4px;
}

.page-cart .price-unit {
	font-size: 11px;
	text-transform: uppercase;
	color: var(--ab-muted);
}

.page-cart .cart-item-card__remove {
	width: 40px;
	height: 40px;
	border-radius: 12px;
	display: grid;
	place-items: center;
	background: #fff;
	border: 1px solid var(--ab-line);
	color: #c0392b;
	transition: .22s;
}

.page-cart .cart-item-card__remove:hover {
	background: #fdecea;
	border-color: #f5c6c0;
	color: #c0392b;
}

.page-cart .cart-continue-link {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	margin-top: 20px;
	font-weight: 650;
	font-size: 14.5px;
	color: var(--arctic-blue-5);
	text-decoration: none;
}

.page-cart .cart-empty-state {
	text-align: center;
	padding: 50px 20px;
}

.page-cart .cart-empty-state__icon-wrap {
	width: 84px;
	height: 84px;
	margin: 0 auto 20px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--arctic-blue-1);
	color: var(--arctic-blue-5);
	font-size: 30px;
}

.page-cart .cart-empty-state__title {
	font-family: var(--ab-head);
	font-size: 24px;
	margin: 0 0 20px;
	color: var(--ab-ink);
}

.page-cart .cart-action-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 15px 26px;
	border-radius: 999px;
	font-weight: 650;
	font-size: 15px;
	text-decoration: none;
	transition: .25s;
}

.page-cart .cart-action-btn--primary,
.page-cart .cart-action-btn--checkout {
	background: var(--ab-ink);
	color: #fff;
}

.page-cart .cart-action-btn--primary:hover,
.page-cart .cart-action-btn--checkout:hover {
	background: var(--arctic-blue-5);
	color: #04252f;
	transform: translateY(-2px);
}

.page-cart .cart-action-btn--block {
	width: 100%;
}

.page-cart .cart-sidebar__rows {
	margin-bottom: 20px;
}

.page-cart .cart-sidebar__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 16px 18px;
	border-radius: var(--ab-r-sm);
	background: var(--ab-wash);
}

.page-cart .cart-sidebar__row-label {
	font-weight: 650;
	color: var(--ab-slate);
}

.page-cart .cart-sidebar__row-value {
	font-family: var(--ab-head);
	font-size: 24px;
	color: var(--arctic-blue-5);
}

.page-cart .total-unit {
	font-size: 12px;
	text-transform: uppercase;
	color: var(--ab-muted);
}

.page-cart .cart-sidebar__trust {
	list-style: none;
	margin: 20px 0;
	padding: 0;
	display: grid;
	gap: 12px;
}

.page-cart .cart-sidebar__trust li {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 14px;
	color: var(--ab-slate);
}

.page-cart .cart-sidebar__trust-icon-wrap {
	width: 36px;
	height: 36px;
	border-radius: 11px;
	display: grid;
	place-items: center;
	background: var(--arctic-blue-1);
	color: var(--arctic-blue-5);
	font-size: 13px;
}

.page-cart .cart-sidebar__pay img {
	max-width: 100%;
	opacity: .85;
}

.page-cart .cart-sidebar__empty {
	text-align: center;
	padding: 30px 10px;
	color: var(--ab-muted);
}

.page-cart .cart-sidebar__empty i {
	font-size: 26px;
	color: var(--arctic-blue-3);
	margin-bottom: 10px;
	display: block;
}

@media (max-width: 767px) {
	.page-cart .cart-item-card {
		grid-template-columns: 92px 1fr;
	}

	.page-cart .cart-item-card__price,
	.page-cart .cart-item-card__action {
		grid-column: 2;
		text-align: left;
	}
}

/* ==========================================================================
   LEGACY BOOTSTRAP SHEETS — FAQ / instructors
   ========================================================================== */
.faq-section,
.instructor-section,
.instructor-detail-section {
	background: var(--ab-wash) !important;
	padding: clamp(48px, 6vw, 86px) 0 !important;
}

.accordion-wrapper .modern-card {
	background: #fff;
	border: 1px solid var(--ab-line) !important;
	border-radius: var(--ab-r-lg) !important;
	box-shadow: none !important;
	transition: border-color .25s, box-shadow .25s;
}

.accordion-wrapper .modern-card:hover {
	border-color: var(--arctic-blue-3) !important;
	box-shadow: var(--ab-shadow) !important;
}

.accordion-header {
	background: transparent !important;
	padding: 22px 26px !important;
}

.accordion-link {
	font-family: var(--ab-font);
	font-size: 16.5px;
	font-weight: 650 !important;
	color: var(--ab-ink) !important;
	gap: 18px;
}

.accordion-link i {
	width: 34px;
	height: 34px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--arctic-blue-1);
	color: var(--arctic-blue-5) !important;
	display: grid;
	place-items: center;
	font-size: 12px;
	transition: transform .3s, background .25s;
}

.accordion-link:hover i {
	background: var(--arctic-blue-5);
	color: #fff !important;
}

.accordion-body {
	padding: 20px 26px 24px !important;
	border-top: 1px solid var(--ab-line) !important;
	font-size: 15px;
	line-height: 1.8;
	color: var(--ab-slate) !important;
}

.instructor-section .modern-card,
.instructor-detail-section .modern-card {
	background: #fff;
	border: 1px solid var(--ab-line) !important;
	border-radius: var(--ab-r-lg) !important;
	box-shadow: none !important;
	padding: clamp(26px, 4vw, 48px) !important;
}

.instructor-section h3,
.instructor-detail-section h3 {
	font-family: var(--ab-head);
	font-weight: 600 !important;
	font-size: clamp(26px, 3.4vw, 38px);
	color: var(--ab-ink) !important;
}

.instructor-section h5 {
	font-family: var(--ab-font);
	font-weight: 700 !important;
	font-size: 18px;
	color: var(--ab-ink) !important;
}

.instructor-section .text-primary,
.instructor-detail-section .text-primary {
	color: var(--arctic-blue-5) !important;
}

.instructor-section p,
.instructor-section li,
.instructor-detail-section p,
.instructor-detail-section li,
.instructor-bio {
	font-size: 15.5px;
	line-height: 1.85;
	color: var(--ab-slate) !important;
}

.instructor-section strong,
.instructor-detail-section strong {
	color: var(--ab-ink);
}

.instructor-section .border-top,
.instructor-detail-section .border-top {
	border-color: var(--ab-line) !important;
}

.instructor-section ul {
	padding-left: 20px;
}

.instructor-section ul li::marker {
	color: var(--arctic-blue-4);
}

/* Legacy tl-breadcrumb banner reskin */
.tl-breadcrumb.about-banner {
	position: relative;
	overflow: hidden;
	background: linear-gradient(125deg, var(--ab-ink) 0%, #06313f 55%, #041d26 100%) !important;
	padding: clamp(48px, 6vw, 78px) 0 clamp(40px, 5vw, 60px) !important;
}

.tl-breadcrumb.about-banner::after {
	content: '';
	position: absolute;
	inset-inline: 0;
	bottom: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--arctic-blue-5), var(--arctic-blue-2) 36%, transparent 80%);
}

.tl-breadcrumb-title {
	font-family: var(--ab-head) !important;
	font-weight: 600 !important;
	font-size: clamp(30px, 3.6vw, 48px) !important;
	color: #fff !important;
	margin: 0 !important;
}

.tl-breadcrumb-nav {
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--arctic-blue-3);
}

.tl-breadcrumb-nav a {
	color: rgba(202, 240, 248, .85) !important;
	text-decoration: none;
}

.tl-breadcrumb-nav a:hover {
	color: var(--arctic-blue-4) !important;
}

.breadcrumb-float-element {
	display: none;
}

/* ==========================================================================
   PAGINATION — shared by list views
   ========================================================================== */
.pagination {
	gap: 7px;
	justify-content: center;
	flex-wrap: wrap;
}

.pagination .page-link {
	border: 1px solid var(--ab-line) !important;
	border-radius: 12px !important;
	color: var(--ab-ink) !important;
	font-weight: 650;
	padding: 10px 16px !important;
	background: #fff !important;
	box-shadow: none !important;
}

.pagination .page-item.active .page-link,
.pagination .page-link:hover {
	background: var(--arctic-blue-5) !important;
	border-color: var(--arctic-blue-5) !important;
	color: #fff !important;
}

/* accordion spacing (bootstrap utility classes removed from the markup) */
.accordion-wrapper {
	display: grid;
	gap: 14px;
}

.accordion-title {
	margin: 0;
}

.accordion-link {
	text-decoration: none !important;
}

.instructor-detail-section .col-lg-4 .modern-card {
	position: sticky;
	top: 120px;
}

.instructor-detail-section .modern-card h3 {
	margin-bottom: 6px;
}

/* The site header is sticky and in-flow now — drop app.css's fixed-header
   offset on the database table head so it stops overlapping the first row. */
.page-database .dbx__head {
	position: static;
	top: auto;
	padding: 14px 24px;
	border-top: 0;
}
